diff --git a/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.js b/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.js index cab2ebdf..03eafccd 100644 --- a/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.js +++ b/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.js @@ -10,6 +10,9 @@ import View from '../../View'; const RootComponent = () =>
; +const styles = StyleSheet.create({ root: { borderWidth: 1234, backgroundColor: 'purple' } }); +const AlternativeComponent = () => ; + describe('AppRegistry', () => { describe('getApplication', () => { const canUseDOM = ExecutionEnvironment.canUseDOM; @@ -29,56 +32,51 @@ describe('AppRegistry', () => { test('returns "element" and "getStyleElement"', () => { AppRegistry.registerComponent('App', () => RootComponent); - const { element, getStyleElement } = AppRegistry.getApplication('App', {}); + const styleElement = ReactDOMServer.renderToStaticMarkup(getStyleElement()); + expect(element).toMatchSnapshot(); - expect(ReactDOMServer.renderToStaticMarkup(getStyleElement())).toMatchSnapshot(); + expect(styleElement).toMatchSnapshot(); }); test('"getStyleElement" produces styles that are a function of rendering "element"', () => { - const getTextContent = getStyleElement => - getStyleElement().props.dangerouslySetInnerHTML.__html; - - // First "RootComponent" render - AppRegistry.registerComponent('App1', () => RootComponent); - let app = AppRegistry.getApplication('App1', {}); - render(app.element); - const first = getTextContent(app.getStyleElement); - - // Next render is a different tree; the style sheet should be different - const styles = StyleSheet.create({ root: { borderWidth: 1234, backgroundColor: 'purple' } }); - const Component = () => ; - AppRegistry.registerComponent('App2', () => Component); - app = AppRegistry.getApplication('App2', {}); - render(app.element); - const second = getTextContent(app.getStyleElement); - - const diff = second.split(first)[1]; + const getApplicationStyles = appName => { + const { element, getStyleElement } = AppRegistry.getApplication(appName, {}); + render(element); + return getStyleElement().props.dangerouslySetInnerHTML.__html; + }; + // First render "RootComponent" + AppRegistry.registerComponent('App', () => RootComponent); + const first = getApplicationStyles('App'); expect(first).toMatchSnapshot('CSS for an unstyled app'); - expect(diff).toMatchSnapshot('Additional CSS for styled app'); + + // Second render "AlternativeComponent" + AppRegistry.registerComponent('AlternativeApp', () => AlternativeComponent); + const second = getApplicationStyles('AlternativeApp'); + const diff = second.split(first)[1]; expect(first).not.toEqual(second); + expect(diff).toMatchSnapshot('Additional CSS for styled app'); - // Final render is once again "RootComponent"; the style sheet should not - // be polluted by earlier rendering of a different tree - app = AppRegistry.getApplication('App1', {}); - render(app.element); - const third = getTextContent(app.getStyleElement); - + // Third render "RootComponent" again + const third = getApplicationStyles('App'); expect(first).toEqual(third); }); }); describe('runApplication', () => { test('callback after render', () => { - AppRegistry.registerComponent('App', () => RootComponent); - - const callback = jest.fn(); + // setup const rootTag = document.createElement('div'); rootTag.id = 'react-root'; document.body.appendChild(rootTag); + + const callback = jest.fn(); + AppRegistry.registerComponent('App', () => RootComponent); AppRegistry.runApplication('App', { initialProps: {}, rootTag, callback }); expect(callback).toHaveBeenCalledTimes(1); + + // cleanup document.body.removeChild(rootTag); }); }); diff --git a/packages/react-native-web/src/exports/AsyncStorage/__tests__/index-test.js b/packages/react-native-web/src/exports/AsyncStorage/__tests__/index-test.js index 9635de5b..102489ea 100644 --- a/packages/react-native-web/src/exports/AsyncStorage/__tests__/index-test.js +++ b/packages/react-native-web/src/exports/AsyncStorage/__tests__/index-test.js @@ -159,7 +159,7 @@ describe('apis/AsyncStorage', () => { }); describe('multiSet', () => { - const assertResult = result => { + const assertResult = () => { expect(mockLocalStorage.getItem('UID123')).toEqual(JSON.stringify(uid123Object)); expect(mockLocalStorage.getItem('UID124')).toEqual(JSON.stringify(uid124Object)); }; @@ -206,7 +206,7 @@ describe('apis/AsyncStorage', () => { }); describe('multiMerge', () => { - const assertResult = result => { + const assertResult = () => { expect(JSON.parse(mockLocalStorage.getItem('UID123'))).toMatchSnapshot(); expect(JSON.parse(mockLocalStorage.getItem('UID124'))).toMatchSnapshot(); }; @@ -253,7 +253,7 @@ describe('apis/AsyncStorage', () => { }); describe('multiRemove', () => { - const assertResult = result => { + const assertResult = () => { expect(mockLocalStorage.getItem('UID123')).toBeUndefined(); expect(mockLocalStorage.getItem('UID124')).toBeUndefined(); }; diff --git a/packages/react-native-web/src/exports/Button/__tests__/index-test.js b/packages/react-native-web/src/exports/Button/__tests__/index-test.js index a6307d39..85b2ebf6 100644 --- a/packages/react-native-web/src/exports/Button/__tests__/index-test.js +++ b/packages/react-native-web/src/exports/Button/__tests__/index-test.js @@ -1,31 +1,32 @@ /* eslint-env jasmine, jest */ /* eslint-disable react/jsx-no-bind */ -import React from 'react'; import Button from '..'; -import { mount, shallow } from 'enzyme'; - -const findNativeButton = wrapper => wrapper.getDOMNode(); +import React from 'react'; +import StyleSheet from '../../StyleSheet'; +import TouchableOpacity from '../../TouchableOpacity'; +import { render, shallow } from 'enzyme'; describe('components/Button', () => { test('prop "color"', () => { const onPress = () => {}; const color = 'blue'; - const button = findNativeButton(mount(