add redux integration tests \#1649

integration/redux/MyContainer.js

@@ -0,0 +1,31 @@
+const React = require('react');
+const { Component } = require('react');
+
+const { Text } = require('react-native');
+const { connect } = require('react-redux');
+const store = require('./MyStore');
+
+class MyContainer extends Component {
+  render() {
+    if (this.props.renderCountIncrement) {
+      this.props.renderCountIncrement();
+    }
+
+    return this.renderText(this.props.printAge ? this.props.age : this.props.name);
+  }
+
+  renderText(txt) {
+    return (
+      <Text>{txt}</Text>
+    );
+  }
+}
+
+function mapStateToProps(state) {
+  return {
+    name: store.selectors.getName(state),
+    age: store.selectors.getAge(state)
+  };
+}
+
+module.exports = connect(mapStateToProps)(MyContainer);

integration/redux/MyStore.js

@@ -0,0 +1,39 @@
+const redux = require('redux');
+const _ = require('lodash');
+
+const initialState = {
+  person: {
+    name: 'no name'
+  }
+};
+
+const reducer = (state = initialState, action) => {
+  switch (action.type) {
+    case 'redux.MyStore.setName': {
+      return _.merge({}, state, { person: { name: action.name } });
+    }
+    case 'redux.MyStore.setAge': {
+      return _.merge({}, state, { person: { age: action.age } });
+    }
+    default: {
+      return state;
+    }
+  }
+};
+
+const selectors = {
+  getName(state) {
+    return _.get(state, 'person.name');
+  },
+
+  getAge(state) {
+    return state.person.age;
+  }
+};
+
+const reduxStore = redux.createStore(reducer);
+
+module.exports = {
+  reduxStore,
+  selectors
+};

integration/redux/Redux.test.js

@@ -0,0 +1,59 @@
+const React = require('react');
+require('react-native');
+const renderer = require('react-test-renderer');
+const { Provider } = require('react-redux');
+
+describe('redux support', () => {
+  let MyConnectedContainer;
+  let store;
+
+  beforeEach(() => {
+    MyConnectedContainer = require('./MyContainer');
+    store = require('./MyStore');
+  });
+
+  it('renders normally', () => {
+    const tree = renderer.create(
+      <Provider store={store.reduxStore}>
+        <MyConnectedContainer />
+      </Provider>
+    );
+    expect(tree.toJSON().children).toEqual(['no name']);
+  });
+
+  it('rerenders as a result of an underlying state change (by selector)', () => {
+    const renderCountIncrement = jest.fn();
+    const tree = renderer.create(
+      <Provider store={store.reduxStore}>
+        <MyConnectedContainer renderCountIncrement={renderCountIncrement} />
+      </Provider>
+    );
+
+    expect(tree.toJSON().children).toEqual(['no name']);
+    expect(renderCountIncrement).toHaveBeenCalledTimes(1);
+
+    store.reduxStore.dispatch({ type: 'redux.MyStore.setName', name: 'Bob' });
+    expect(store.selectors.getName(store.reduxStore.getState())).toEqual('Bob');
+    expect(tree.toJSON().children).toEqual(['Bob']);
+
+    expect(renderCountIncrement).toHaveBeenCalledTimes(2);
+  });
+
+  it('rerenders as a result of an underlying state change with a new key', () => {
+    const renderCountIncrement = jest.fn();
+    const tree = renderer.create(
+      <Provider store={store.reduxStore}>
+        <MyConnectedContainer printAge={true} renderCountIncrement={renderCountIncrement} />
+      </Provider>
+    );
+
+    expect(tree.toJSON().children).toEqual(null);
+    expect(renderCountIncrement).toHaveBeenCalledTimes(1);
+
+    store.reduxStore.dispatch({ type: 'redux.MyStore.setAge', age: 30 });
+    expect(store.selectors.getAge(store.reduxStore.getState())).toEqual(30);
+    expect(tree.toJSON().children).toEqual(['30']);
+
+    expect(renderCountIncrement).toHaveBeenCalledTimes(2);
+  });
+});

integration/remx/component.js → integration/remx/MyContainer.js

@@ -3,7 +3,7 @@ const { Component } = require('react');
 
 const { Text } = require('react-native');
 const { connect } = require('remx');
-const store = require('./store');
+const store = require('./MyStore');
 
 class MyContainer extends Component {
   render() {

integration/remx/store.js → integration/remx/MyStore.js

@@ -1,4 +1,3 @@
-const _ = require('lodash');
 const remx = require('remx');
 
 const state = remx.state({
@@ -19,11 +18,11 @@ const setters = remx.setters({
 
 const getters = remx.getters({
   getName() {
-    return _.get(state, ['person', 'name']);
+    return state.person.name;
   },
 
   getAge() {
-    return _(state).get('person.age');
+    return state.person.age;
   }
 });
 

integration/remx/remx.test.js

@@ -7,9 +7,8 @@ describe('remx support', () => {
   let store;
 
   beforeEach(() => {
-    jest.resetModules();
-    MyConnectedContainer = require('./component');
-    store = require('./store');
+    MyConnectedContainer = require('./MyContainer');
+    store = require('./MyStore');
   });
 
   it('renders normally', () => {

package-lock.json

@@ -4561,9 +4561,9 @@
       "dev": true
     },
     "hoist-non-react-statics": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-1.2.0.tgz",
-      "integrity": "sha1-qkSM8JhtVcxAdzsXF0t90GbLfPs=",
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.3.1.tgz",
+      "integrity": "sha1-ND24TGAYxlB3iJgkATWhQg7iLOA=",
       "dev": true
     },
     "home-or-tmp": {
@@ -5754,6 +5754,12 @@
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
       "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
     },
+    "lodash-es": {
+      "version": "4.17.4",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.4.tgz",
+      "integrity": "sha1-3MHXVS4VCgZABzupyzHXDwMpUOc=",
+      "dev": true
+    },
     "lodash._baseassign": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz",
@@ -6180,6 +6186,14 @@
       "dev": true,
       "requires": {
         "hoist-non-react-statics": "1.2.0"
+      },
+      "dependencies": {
+        "hoist-non-react-statics": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-1.2.0.tgz",
+          "integrity": "sha1-qkSM8JhtVcxAdzsXF0t90GbLfPs=",
+          "dev": true
+        }
       }
     },
     "mocha": {
@@ -7541,6 +7555,20 @@
         "react-deep-force-update": "1.1.1"
       }
     },
+    "react-redux": {
+      "version": "5.0.6",
+      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-5.0.6.tgz",
+      "integrity": "sha512-8taaaGu+J7PMJQDJrk/xiWEYQmdo3mkXw6wPr3K3LxvXis3Fymiq7c13S+Tpls/AyNUAsoONkU81AP0RA6y6Vw==",
+      "dev": true,
+      "requires": {
+        "hoist-non-react-statics": "2.3.1",
+        "invariant": "2.2.2",
+        "lodash": "4.17.4",
+        "lodash-es": "4.17.4",
+        "loose-envify": "1.3.1",
+        "prop-types": "15.5.10"
+      }
+    },
     "react-test-renderer": {
       "version": "16.0.0-alpha.6",
       "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-16.0.0-alpha.6.tgz",
@@ -7660,6 +7688,18 @@
         "strip-indent": "1.0.1"
       }
     },
+    "redux": {
+      "version": "3.7.2",
+      "resolved": "https://registry.npmjs.org/redux/-/redux-3.7.2.tgz",
+      "integrity": "sha512-pNqnf9q1hI5HHZRBkj3bAngGZW/JMCmexDlOxw4XagXY2o1327nHH54LoTjiPJ0gizoqPDRqWyX/00g0hD6w+A==",
+      "dev": true,
+      "requires": {
+        "lodash": "4.17.4",
+        "lodash-es": "4.17.4",
+        "loose-envify": "1.3.1",
+        "symbol-observable": "1.0.4"
+      }
+    },
     "regenerate": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz",
@@ -8466,6 +8506,12 @@
         "has-flag": "2.0.0"
       }
     },
+    "symbol-observable": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.0.4.tgz",
+      "integrity": "sha1-Kb9hXUqnEhvdiYsi1LP5vE4qoD0=",
+      "dev": true
+    },
     "symbol-tree": {
       "version": "3.2.2",
       "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.2.tgz",

package.json

@@ -59,6 +59,8 @@
     "react-native": "0.44.0",
     "react-test-renderer": "16.0.0-alpha.6",
     "remx": "2.x.x",
+    "redux": "3.x.x",
+    "react-redux": "5.x.x",
     "semver": "5.x.x",
     "shell-utils": "1.x.x"
   },