Update Busy to React 16.1.0 (#1068)

* Integrate ReduxInfiniteScroll to Busy as vendor component.
* Update enzyme and jest to work with React 16
* Update React and ReactDOM

package.json

@@ -85,9 +85,10 @@
     "postcss-loader": "^2.0.8",
     "prop-types": "^15.5.10",
     "raven-js": "^3.8.0",
-    "react": "^15.6.1",
+    "react": "^16.1.0",
+    "react-addons-css-transition-group": "^15.6.2",
     "react-custom-scrollbars": "^4.1.2",
-    "react-dom": "^15.6.1",
+    "react-dom": "^16.1.0",
     "react-dropzone": "^4.1.3",
     "react-helmet": "^5.0.2",
     "react-hot-loader": "^3.1.1",
@@ -103,7 +104,6 @@
     "react-visibility-sensor": "^3.10.1",
     "redux": "^3.5.2",
     "redux-actions": "^0.12.0",
-    "redux-infinite-scroll": "^1.0.9",
     "redux-mock-store": "^1.3.0",
     "redux-promise-middleware": "^4.0.0",
     "redux-thunk": "^2.1.0",
@@ -130,16 +130,16 @@
   "devDependencies": {
     "babel-register": "^6.24.1",
     "chai": "^3.5.0",
-    "enzyme": "^2.9.1",
+    "enzyme": "^3.1.1",
+    "enzyme-adapter-react-16": "^1.0.4",
     "eslint": "^4.3.0",
     "eslint-config-airbnb": "^15.1.0",
     "eslint-plugin-import": "^2.7.0",
     "eslint-plugin-jest": "^20.0.3",
     "eslint-plugin-jsx-a11y": "^5.1.1",
     "eslint-plugin-react": "^7.1.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^20.0.4",
-    "jest-cli": "^21.0.1",
+    "jest": "^21.3.0-beta.8",
     "pre-commit": "^1.2.2",
     "react-test-renderer": "^15.6.1",
     "webpack-dev-server": "~2.9.3",
@@ -148,7 +148,8 @@
   "jest": {
     "moduleNameMapper": {
       "\\.((s)css|less)$": "identity-obj-proxy"
-    }
+    },
+    "setupTestFrameworkScriptFile": "<rootDir>/setupTests.js"
   },
   "repository": "https://github.com/adcpm/busy.git",
   "license": "MIT"

setupTests.js

@@ -0,0 +1,5 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import enzyme from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+
+enzyme.configure({ adapter: new Adapter() });

src/components/Button/__tests__/__snapshots__/Action.js.snap

@@ -2,128 +2,98 @@
 
 exports[`<Action /> renders without exploding 1`] = `
 ShallowWrapper {
-  "complexSelector": ComplexSelector {
-    "buildPredicate": [Function],
-    "childrenOfNode": [Function],
-    "findWhereUnwrapped": [Function],
-  },
   "length": 1,
-  "node": <button
-    className="Action ant-btn-lg Action--primary"
+  Symbol(enzyme.__root__): [Circular],
+  Symbol(enzyme.__unrendered__): <Action
     disabled={false}
+    loading={true}
     onClick={[Function]}
+    primary={true}
+    small={false}
     style={Object {}}
-  >
-    <Icon
-      type="loading"
-    />
-    Example text
-  </button>,
-  "nodes": Array [
-    <button
-      className="Action ant-btn-lg Action--primary"
-      disabled={false}
-      onClick={[Function]}
-      style={Object {}}
-    >
-      <Icon
-        type="loading"
-      />
-      Example text
-    </button>,
-  ],
-  "options": Object {},
-  "renderer": ReactShallowRenderer {
-    "_instance": ShallowComponentWrapper {
-      "_calledComponentWillUnmount": false,
-      "_compositeType": 2,
-      "_context": Object {},
-      "_currentElement": <Action
-        disabled={false}
-        loading={true}
-        onClick={[Function]}
-        primary={true}
-        small={false}
-        style={Object {}}
-        text="Example text"
-      />,
-      "_debugID": 1,
-      "_hostContainerInfo": null,
-      "_hostParent": null,
-      "_instance": StatelessComponent {
-        "_reactInternalInstance": [Circular],
-        "context": Object {},
+    text="Example text"
+  />,
+  Symbol(enzyme.__renderer__): Object {
+    "batchedUpdates": [Function],
+    "getNode": [Function],
+    "render": [Function],
+    "simulateEvent": [Function],
+    "unmount": [Function],
+  },
+  Symbol(enzyme.__node__): Object {
+    "instance": null,
+    "key": undefined,
+    "nodeType": "host",
+    "props": Object {
+      "children": Array [
+        <Icon
+          type="loading"
+        />,
+        "Example text",
+      ],
+      "className": "Action ant-btn-lg Action--primary",
+      "disabled": false,
+      "onClick": [Function],
+      "style": Object {},
+    },
+    "ref": null,
+    "rendered": Array [
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "function",
         "props": Object {
-          "disabled": false,
-          "loading": true,
-          "onClick": [Function],
-          "primary": true,
-          "small": false,
-          "style": Object {},
-          "text": "Example text",
-        },
-        "refs": Object {},
-        "state": null,
-        "updater": Object {
-          "enqueueCallback": [Function],
-          "enqueueCallbackInternal": [Function],
-          "enqueueElementInternal": [Function],
-          "enqueueForceUpdate": [Function],
-          "enqueueReplaceState": [Function],
-          "enqueueSetState": [Function],
-          "isMounted": [Function],
-          "validateCallback": [Function],
+          "type": "loading",
         },
+        "ref": null,
+        "rendered": null,
+        "type": [Function],
       },
-      "_mountOrder": 1,
-      "_pendingCallbacks": null,
-      "_pendingElement": null,
-      "_pendingForceUpdate": false,
-      "_pendingReplaceState": false,
-      "_pendingStateQueue": null,
-      "_renderedComponent": NoopInternalComponent {
-        "_currentElement": <button
-          className="Action ant-btn-lg Action--primary"
-          disabled={false}
-          onClick={[Function]}
-          style={Object {}}
-        >
-          <Icon
-            type="loading"
-          />
-          Example text
-        </button>,
-        "_debugID": 2,
-        "_renderedOutput": <button
-          className="Action ant-btn-lg Action--primary"
-          disabled={false}
-          onClick={[Function]}
-          style={Object {}}
-        >
+      "Example text",
+    ],
+    "type": "button",
+  },
+  Symbol(enzyme.__nodes__): Array [
+    Object {
+      "instance": null,
+      "key": undefined,
+      "nodeType": "host",
+      "props": Object {
+        "children": Array [
           <Icon
             type="loading"
-          />
-          Example text
-        </button>,
+          />,
+          "Example text",
+        ],
+        "className": "Action ant-btn-lg Action--primary",
+        "disabled": false,
+        "onClick": [Function],
+        "style": Object {},
+      },
+      "ref": null,
+      "rendered": Array [
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "function",
+          "props": Object {
+            "type": "loading",
+          },
+          "ref": null,
+          "rendered": null,
+          "type": [Function],
+        },
+        "Example text",
+      ],
+      "type": "button",
+    },
+  ],
+  Symbol(enzyme.__options__): Object {
+    "adapter": ReactSixteenAdapter {
+      "options": Object {
+        "enableComponentDidUpdateOnSetState": true,
       },
-      "_renderedNodeType": 0,
-      "_rootNodeID": 0,
-      "_topLevelWrapper": null,
-      "_updateBatchNumber": null,
-      "_warnedAboutRefsInRender": false,
     },
-    "getRenderOutput": [Function],
-    "render": [Function],
   },
-  "root": [Circular],
-  "unrendered": <Action
-    disabled={false}
-    loading={true}
-    onClick={[Function]}
-    primary={true}
-    small={false}
-    style={Object {}}
-    text="Example text"
-  />,
 }
 `;