[change] React 16 support

Fix #364

Author: necolas

docs/guides/getting-started.md

@@ -127,6 +127,7 @@ import AppHeader from './src/AppHeader';
 import React from 'react';
 import ReactNative from 'react-native';
 
+// use .hydrate if hydrating a SSR app
 ReactNative.render(<AppHeader />, document.getElementById('react-app-header'))
 ```
 

jest-setup-framework.js

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

package.json

@@ -3,6 +3,7 @@
   "version": "0.0.130",
   "description": "React Native for Web",
   "main": "dist/index.js",
+  "module": "dist/module.js",
   "files": [
     "babel",
     "dist",
@@ -29,24 +30,17 @@
     "test": "flow && jest"
   },
   "babel": {
-    "presets": [
-      "react-native"
-    ],
+    "presets": [ "react-native" ],
     "plugins": [
-      [
-        "transform-react-remove-prop-types",
-        {
-          "mode": "wrap"
-        }
-      ]
+      [ "transform-react-remove-prop-types", { "mode": "wrap" } ]
     ]
   },
   "jest": {
     "testEnvironment": "jsdom",
     "timers": "fake",
-    "snapshotSerializers": [
-      "<rootDir>/node_modules/enzyme-to-json/serializer"
-    ]
+    "setupFiles": [ "raf/polyfill" ],
+    "setupTestFrameworkScriptFile": "<rootDir>/jest-setup-framework.js",
+    "snapshotSerializers": [ "enzyme-to-json/serializer" ]
   },
   "lint-staged": {
     "**/*.js": [
@@ -59,14 +53,14 @@
     "animated": "^0.2.0",
     "array-find-index": "^1.0.2",
     "babel-runtime": "^6.26.0",
-    "create-react-class": "^15.6.0",
+    "create-react-class": "^15.6.2",
     "debounce": "1.0.2",
     "deep-assign": "^2.0.0",
-    "fbjs": "^0.8.14",
+    "fbjs": "^0.8.16",
     "hyphenate-style-name": "^1.0.2",
     "inline-style-prefixer": "^3.0.8",
     "normalize-css-color": "^1.0.2",
-    "prop-types": "^15.5.10",
+    "prop-types": "^15.6.0",
     "react-timer-mixin": "^0.13.3"
   },
   "devDependencies": {
@@ -79,8 +73,9 @@
     "babel-preset-react-native": "^4.0.0",
     "caniuse-api": "^2.0.0",
     "del-cli": "^1.1.0",
-    "enzyme": "^2.9.1",
-    "enzyme-to-json": "^2.0.0",
+    "enzyme": "^3.0.0",
+    "enzyme-adapter-react-16": "^1.0.0",
+    "enzyme-to-json": "next",
     "eslint": "^4.6.1",
     "eslint-config-prettier": "^2.4.0",
     "eslint-plugin-promise": "^3.5.0",
@@ -90,16 +85,17 @@
     "jest": "^21.1.0",
     "lint-staged": "^4.1.3",
     "prettier": "^1.7.0",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "react-test-renderer": "^15.6.1",
+    "raf": "^3.3.2",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0",
+    "react-test-renderer": "^16.0.0",
     "url-loader": "^0.5.9",
     "webpack": "^3.6.0",
     "webpack-bundle-analyzer": "^2.9.0"
   },
   "peerDependencies": {
-    "react": "15.4.x || 15.5.x || 15.6.x",
-    "react-dom": "15.4.x || 15.5.x || 15.6.x"
+    "react": "16.x.x",
+    "react-dom": "16.x.x"
   },
   "author": "Nicolas Gallagher",
   "license": "BSD-3-Clause",

src/components/TextInput/__tests__/index-test.js

@@ -366,12 +366,12 @@ describe('components/TextInput', () => {
       );
 
       // default selection is 0
-      expect(inputDefaultSelection.node.selectionStart).toEqual(0);
-      expect(inputDefaultSelection.node.selectionEnd).toEqual(0);
+      expect(inputDefaultSelection.instance().selectionStart).toEqual(0);
+      expect(inputDefaultSelection.instance().selectionEnd).toEqual(0);
 
       // custom selection sets cursor at custom position
-      expect(inputCustomSelection.node.selectionStart).toEqual(cursorLocation.start);
-      expect(inputCustomSelection.node.selectionEnd).toEqual(cursorLocation.end);
+      expect(inputCustomSelection.instance().selectionStart).toEqual(cursorLocation.start);
+      expect(inputCustomSelection.instance().selectionEnd).toEqual(cursorLocation.end);
     });
   });
 });

src/index.js

@@ -1,6 +1,7 @@
 import {
   // top-level API
   findNodeHandle,
+  hydrate,
   render,
   unmountComponentAtNode,
 
@@ -67,6 +68,7 @@ import {
 const ReactNative = {
   // top-level API
   findNodeHandle,
+  hydrate,
   render,
   unmountComponentAtNode,
 

src/module.js

@@ -2,7 +2,7 @@ export { default as createElement } from './modules/createElement';
 export { default as findNodeHandle } from './modules/findNodeHandle';
 export { default as NativeModules } from './modules/NativeModules';
 export { default as processColor } from './modules/processColor';
-export { render, unmountComponentAtNode } from 'react-dom';
+export { hydrate, render, unmountComponentAtNode } from 'react-dom';
 
 // APIs
 export { default as Animated } from './apis/Animated';

src/modules/injectResponderEventPlugin/index.js

@@ -1,9 +1,11 @@
 // based on https://github.com/facebook/react/pull/4303/files
 
-import EventPluginHub from 'react-dom/lib/EventPluginHub';
 import normalizeNativeEvent from '../normalizeNativeEvent';
-import ResponderEventPlugin from 'react-dom/lib/ResponderEventPlugin';
-import ResponderTouchHistoryStore from 'react-dom/lib/ResponderTouchHistoryStore';
+import ReactDOM from 'react-dom';
+import ReactDOMUnstableNativeDependencies from 'react-dom/unstable-native-dependencies';
+
+const { EventPluginHub } = ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+const { ResponderEventPlugin, ResponderTouchHistoryStore } = ReactDOMUnstableNativeDependencies;
 
 const topMouseDown = 'topMouseDown';
 const topMouseMove = 'topMouseMove';