Migrate tests to this repo

packages/drawer/.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["react-native"]
+}

packages/drawer/.eslintignore

@@ -1,2 +1,3 @@
 node_modules/
 dist/
+jest-setup.js

packages/drawer/__setup__/enzyme.js

@@ -1,4 +0,0 @@
-import Enzyme from 'enzyme';
-import Adapter from 'enzyme-adapter-react-16';
-
-Enzyme.configure({ adapter: new Adapter() });

packages/drawer/jest-setup.js

@@ -0,0 +1,18 @@
+/**
+ * eslint-env jest
+ */
+
+// No setup
+
+import React from 'react';
+
+jest.mock('react-native-drawer-layout-polyfill', () => {
+  const View = require.requireActual('View');
+  class DrawerLayout extends View {
+    static positions = {
+      Left: 'left',
+      Right: 'right',
+    };
+  }
+  return DrawerLayout;
+});

packages/drawer/package.json

@@ -40,22 +40,19 @@
   "devDependencies": {
     "@expo/vector-icons": "^6.2.0",
     "babel-cli": "^6.26.0",
-    "babel-jest": "^21.2.0",
+    "babel-jest": "^22.4.1",
     "babel-plugin-syntax-class-properties": "^6.13.0",
     "babel-plugin-syntax-jsx": "^6.18.0",
     "babel-plugin-syntax-object-rest-spread": "^6.13.0",
     "babel-plugin-transform-flow-strip-types": "^6.22.0",
     "babel-preset-react-native": "^4.0.0",
-    "enzyme": "3.2.0",
-    "enzyme-adapter-react-16": "^1.1.0",
-    "enzyme-to-json": "^3.2.2",
     "eslint": "^4.12.1",
     "eslint-config-satya164": "^1.0.1",
     "eslint-plugin-react-native-globals": "^0.1.0",
     "husky": "^0.14.3",
-    "jest": "^21.2.1",
+    "jest": "^22.1.3",
     "prettier": "^1.8.2",
-    "react": "16.3.1",
+    "react": "16.3.2",
     "react-dom": "16.3.1",
     "react-native": "~0.55.4",
     "react-navigation": "^2.1.0",
@@ -68,14 +65,18 @@
   },
   "jest": {
     "preset": "react-native",
+    "testRegex": "/__tests__/[^/]+-test\\.js$",
     "setupFiles": [
-      "<rootDir>/__setup__/enzyme.js"
+      "<rootDir>/jest-setup.js"
+    ],
+    "coveragePathIgnorePatterns": [
+      "jest-setup.js"
     ],
     "modulePathIgnorePatterns": [
-      "<rootDir>/example/node_modules"
+      "<rootDir>/example/"
     ],
-    "snapshotSerializers": [
-      "enzyme-to-json/serializer"
+    "transformIgnorePatterns": [
+      "node_modules/(?!(jest-)?react-native|react-clone-referenced-element|react-navigation-deprecated-tab-navigator|react-navigation)"
     ]
   }
 }

packages/drawer/src/navigators/__tests__/DrawerNavigator-test.js

@@ -0,0 +1,27 @@
+import React, { Component } from 'react';
+import { View } from 'react-native';
+import renderer from 'react-test-renderer';
+
+import createDrawerNavigator from '../createDrawerNavigator';
+
+class HomeScreen extends Component {
+  static navigationOptions = ({ navigation }) => ({
+    title: `Welcome ${
+      navigation.state.params ? navigation.state.params.user : 'anonymous'
+    }`,
+    gesturesEnabled: true,
+  });
+
+  render() {
+    return <View style={{ flex: 1 }} />;
+  }
+}
+
+describe('createDrawerNavigator', () => {
+  it('renders successfully', () => {
+    const MyDrawerNavigator = createDrawerNavigator({ Home: HomeScreen });
+    const rendered = renderer.create(<MyDrawerNavigator />).toJSON();
+
+    expect(rendered).toMatchSnapshot();
+  });
+});

packages/drawer/src/navigators/__tests__/__snapshots__/DrawerNavigator-test.js.snap

@@ -0,0 +1,22 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`createDrawerNavigator renders successfully 1`] = `
+<RCTView
+  drawerBackgroundColor="white"
+  drawerLockMode={undefined}
+  drawerPosition="left"
+  drawerWidth={320}
+  onDrawerClose={[Function]}
+  onDrawerOpen={[Function]}
+  renderNavigationView={[Function]}
+  useNativeAnimations={true}
+>
+  <View
+    style={
+      Object {
+        "flex": 1,
+      }
+    }
+  />
+</RCTView>
+`;

packages/drawer/src/routers/__tests__/DrawerRouter-test.js

@@ -0,0 +1,226 @@
+/* eslint react/display-name:0 */
+
+import React from 'react';
+import DrawerRouter from '../DrawerRouter';
+
+import { NavigationActions, SwitchRouter } from 'react-navigation';
+import DrawerActions from '../../routers/DrawerActions';
+
+const INIT_ACTION = { type: NavigationActions.INIT };
+
+describe('DrawerRouter', () => {
+  test('Handles basic tab logic', () => {
+    const ScreenA = () => <div />;
+    const ScreenB = () => <div />;
+    const router = DrawerRouter({
+      Foo: { screen: ScreenA },
+      Bar: { screen: ScreenB },
+    });
+    const state = router.getStateForAction(INIT_ACTION);
+    const expectedState = {
+      index: 0,
+      isTransitioning: false,
+      routes: [
+        { key: 'Foo', routeName: 'Foo', params: undefined },
+        { key: 'Bar', routeName: 'Bar', params: undefined },
+      ],
+      isDrawerOpen: false,
+    };
+    expect(state).toEqual(expectedState);
+    const state2 = router.getStateForAction(
+      { type: NavigationActions.NAVIGATE, routeName: 'Bar' },
+      state
+    );
+    const expectedState2 = {
+      index: 1,
+      isTransitioning: false,
+      routes: [
+        { key: 'Foo', routeName: 'Foo', params: undefined },
+        { key: 'Bar', routeName: 'Bar', params: undefined },
+      ],
+      isDrawerOpen: false,
+    };
+    expect(state2).toEqual(expectedState2);
+    expect(router.getComponentForState(expectedState)).toEqual(ScreenA);
+    expect(router.getComponentForState(expectedState2)).toEqual(ScreenB);
+  });
+
+  test('Handles initial route navigation', () => {
+    const FooScreen = () => <div />;
+    const BarScreen = () => <div />;
+    const router = DrawerRouter(
+      {
+        Foo: {
+          screen: FooScreen,
+        },
+        Bar: {
+          screen: BarScreen,
+        },
+      },
+      { initialRouteName: 'Bar' }
+    );
+    const state = router.getStateForAction({
+      type: NavigationActions.NAVIGATE,
+      routeName: 'Foo',
+    });
+    expect(state).toEqual({
+      index: 0,
+      isDrawerOpen: false,
+      isTransitioning: false,
+      routes: [
+        {
+          key: 'Foo',
+          params: undefined,
+          routeName: 'Foo',
+        },
+        {
+          key: 'Bar',
+          params: undefined,
+          routeName: 'Bar',
+        },
+      ],
+    });
+  });
+
+  test('Drawer opens closes and toggles', () => {
+    const ScreenA = () => <div />;
+    const ScreenB = () => <div />;
+    const router = DrawerRouter({
+      Foo: { screen: ScreenA },
+      Bar: { screen: ScreenB },
+    });
+    const state = router.getStateForAction(INIT_ACTION);
+    expect(state.isDrawerOpen).toEqual(false);
+    const state2 = router.getStateForAction(
+      { type: DrawerActions.OPEN_DRAWER },
+      state
+    );
+    expect(state2.isDrawerOpen).toEqual(true);
+    const state3 = router.getStateForAction(
+      { type: DrawerActions.CLOSE_DRAWER },
+      state2
+    );
+    expect(state3.isDrawerOpen).toEqual(false);
+    const state4 = router.getStateForAction(
+      { type: DrawerActions.TOGGLE_DRAWER },
+      state3
+    );
+    expect(state4.isDrawerOpen).toEqual(true);
+  });
+
+  test('Drawer opens closes with key targeted', () => {
+    const ScreenA = () => <div />;
+    const ScreenB = () => <div />;
+    const router = DrawerRouter({
+      Foo: { screen: ScreenA },
+      Bar: { screen: ScreenB },
+    });
+    const state = router.getStateForAction(INIT_ACTION);
+    const state2 = router.getStateForAction(
+      { type: DrawerActions.OPEN_DRAWER, key: 'wrong' },
+      state
+    );
+    expect(state2.isDrawerOpen).toEqual(false);
+    const state3 = router.getStateForAction(
+      { type: DrawerActions.OPEN_DRAWER, key: state.key },
+      state2
+    );
+    expect(state3.isDrawerOpen).toEqual(true);
+  });
+});
+
+test('Nested routers bubble up blocked actions', () => {
+  const ScreenA = () => <div />;
+  ScreenA.router = {
+    getStateForAction(action, lastState) {
+      if (action.type === 'CHILD_ACTION') return null;
+      return lastState;
+    },
+  };
+  const ScreenB = () => <div />;
+  const router = DrawerRouter({
+    Foo: { screen: ScreenA },
+    Bar: { screen: ScreenB },
+  });
+  const state = router.getStateForAction(INIT_ACTION);
+
+  const state2 = router.getStateForAction({ type: 'CHILD_ACTION' }, state);
+  expect(state2).toEqual(null);
+});
+
+test('Drawer stays open when child routers return new state', () => {
+  const ScreenA = () => <div />;
+  ScreenA.router = {
+    getStateForAction(action, lastState = { changed: false }) {
+      if (action.type === 'CHILD_ACTION')
+        return { ...lastState, changed: true };
+      return lastState;
+    },
+  };
+  const router = DrawerRouter({
+    Foo: { screen: ScreenA },
+  });
+
+  const state = router.getStateForAction(INIT_ACTION);
+  expect(state.isDrawerOpen).toEqual(false);
+
+  const state2 = router.getStateForAction(
+    { type: DrawerActions.OPEN_DRAWER, key: state.key },
+    state
+  );
+  expect(state2.isDrawerOpen).toEqual(true);
+
+  const state3 = router.getStateForAction({ type: 'CHILD_ACTION' }, state2);
+  expect(state3.isDrawerOpen).toEqual(true);
+  expect(state3.routes[0].changed).toEqual(true);
+});
+
+test('DrawerRouter will close drawer on child navigaton, not on child param changes', () => {
+  class FooView extends React.Component {
+    render() {
+      return <div />;
+    }
+  }
+  const BarRouter = SwitchRouter({
+    Qux: FooView,
+    Quo: FooView,
+  });
+  class BarView extends React.Component {
+    static router = BarRouter;
+    render() {
+      return <div />;
+    }
+  }
+  const router = DrawerRouter({
+    Bar: BarView,
+    Foo: FooView,
+  });
+
+  const emptyState = router.getStateForAction(NavigationActions.init());
+  const initState = router.getStateForAction(
+    DrawerActions.openDrawer(),
+    emptyState
+  );
+  expect(initState.isDrawerOpen).toBe(true);
+
+  const state0 = router.getStateForAction(
+    NavigationActions.navigate({ routeName: 'Quo' }),
+    initState
+  );
+  expect(state0.isDrawerOpen).toBe(false);
+
+  const initSwitchState = initState.routes[initState.index];
+  const initQuxState = initSwitchState.routes[initSwitchState.index];
+
+  const state1 = router.getStateForAction(
+    NavigationActions.setParams({
+      key: initQuxState.key,
+      params: { foo: 'bar' },
+    }),
+    initState
+  );
+  expect(state1.isDrawerOpen).toBe(true);
+  const state1switchState = state1.routes[state1.index];
+  const state1quxState = state1switchState.routes[state1switchState.index];
+  expect(state1quxState.params.foo).toEqual('bar');
+});