Skip to content

Commit

Permalink
Add react-dom-unstable-native-dependencies (#10138)
Browse files Browse the repository at this point in the history
* Add react-dom-unstable-native-dependencies

react-native-web and react-primitives currently access a few internals
for shimming DOM events into native ones.  Changes in react@16 packaging
hide these internals completely.  This change adds a submodule to react-dom,
unstable-native-dependencies that includes the necessary modules to
continue enabling that method of dom-native event injection.

* Update ResponderEventPlugin to use "public" interfaces for test

In order to get some sort of smoke testing on
react-dom-unstable-native-dependencies, update ResponderEventPlugin-test
to use the "public" interfaces provided by react-dom and the new
react-dom/unstable-native dependencies

Also adds the missing references in package.json as well as missing
files required for unittests to do imports correctrly

Also exports injectComponentTree() which is required for the unittests
to re-set the shared component state between runs.

* Tweak bundle comment

* Bundle content updates from exporting injectComponentTree

* Added FB_DEV, FB_PROD to bundle types

* Run yarn prettier for -unstable-native-dependencies updates
  • Loading branch information
fmoo authored and gaearon committed Jul 12, 2017
1 parent 2e2f503 commit cff012f
Show file tree
Hide file tree
Showing 7 changed files with 168 additions and 60 deletions.
1 change: 1 addition & 0 deletions packages/react-dom/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@
"server.js",
"node-stream.js",
"test-utils.js",
"unstable-native-dependencies.js",
"cjs/",
"umd/"
],
Expand Down
7 changes: 7 additions & 0 deletions packages/react-dom/unstable-native-dependencies.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
'use strict';

if (process.env.NODE_ENV === 'production') {
module.exports = require('./cjs/react-dom-unstable-native-dependencies.production.min.js');
} else {
module.exports = require('./cjs/react-dom-unstable-native-dependencies.development.js');
}
34 changes: 34 additions & 0 deletions scripts/rollup/bundles.js
Original file line number Diff line number Diff line change
Expand Up @@ -125,6 +125,40 @@ const bundles = [
'src/shared/**/*.js',
],
},
/* React DOM internals required for react-native-web (e.g., to shim native events from react-dom) */
{
babelOpts: babelOptsReact,
bundleTypes: [UMD_DEV, UMD_PROD, NODE_DEV, NODE_PROD, FB_DEV, FB_PROD],
config: {
destDir: 'build/',
globals: {
react: 'React',
'react-dom': 'ReactDOM',
},
moduleName: 'ReactDOMUnstableNativeDependencies',
sourceMap: false,
},
entry: 'src/renderers/dom/shared/ReactDOMUnstableNativeDependenciesEntry',
externals: [
'react-dom',
'ReactDOM',
'prop-types',
'prop-types/checkPropTypes',
],
fbEntry: 'src/renderers/dom/shared/ReactDOMUnstableNativeDependenciesEntry',
hasteName: 'ReactDOMUnstableNativeDependencies',
isRenderer: false,
label: 'dom-unstable-native-dependencies',
manglePropertiesOnProd: false,
name: 'react-dom/unstable-native-dependencies',
paths: [
'src/renderers/dom/**/*.js',
'src/renderers/shared/**/*.js',

'src/ReactVersion.js',
'src/shared/**/*.js',
],
},

/******* React DOM Server *******/
{
Expand Down
132 changes: 78 additions & 54 deletions scripts/rollup/results.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,36 +25,36 @@
"gzip": 7214
},
"react-dom.development.js (UMD_DEV)": {
"size": 613141,
"gzip": 140395
"size": 623004,
"gzip": 142505
},
"react-dom.production.min.js (UMD_PROD)": {
"size": 126584,
"gzip": 39853
"size": 126045,
"gzip": 39908
},
"react-dom.development.js (NODE_DEV)": {
"size": 570841,
"gzip": 130520
"size": 581665,
"gzip": 132841
},
"react-dom.production.min.js (NODE_PROD)": {
"size": 122880,
"gzip": 38546
"size": 122410,
"gzip": 38579
},
"ReactDOMFiber-dev.js (FB_DEV)": {
"size": 570125,
"gzip": 130563
"size": 580949,
"gzip": 132865
},
"ReactDOMFiber-prod.js (FB_PROD)": {
"size": 428502,
"gzip": 96996
"size": 426819,
"gzip": 96885
},
"react-dom-test-utils.development.js (NODE_DEV)": {
"size": 53025,
"gzip": 13685
"size": 52996,
"gzip": 13677
},
"ReactTestUtils-dev.js (FB_DEV)": {
"size": 52904,
"gzip": 13646
"size": 52875,
"gzip": 13637
},
"ReactDOMServerStack-dev.js (FB_DEV)": {
"size": 460810,
Expand All @@ -65,20 +65,20 @@
"gzip": 81957
},
"react-dom-server.development.js (UMD_DEV)": {
"size": 308329,
"gzip": 77617
"size": 308414,
"gzip": 77283
},
"react-dom-server.production.min.js (UMD_PROD)": {
"size": 66111,
"gzip": 22613
"size": 65498,
"gzip": 22267
},
"react-dom-server.development.js (NODE_DEV)": {
"size": 266194,
"gzip": 67866
"size": 267260,
"gzip": 67829
},
"react-dom-server.production.min.js (NODE_PROD)": {
"size": 62380,
"gzip": 21260
"size": 61836,
"gzip": 20968
},
"ReactDOMServerStream-dev.js (FB_DEV)": {
"size": 264750,
Expand All @@ -89,28 +89,28 @@
"gzip": 51047
},
"react-art.development.js (UMD_DEV)": {
"size": 362062,
"gzip": 80236
"size": 359303,
"gzip": 79940
},
"react-art.production.min.js (UMD_PROD)": {
"size": 99126,
"gzip": 30132
"size": 97521,
"gzip": 29904
},
"react-art.development.js (NODE_DEV)": {
"size": 283458,
"gzip": 60201
"size": 280721,
"gzip": 59867
},
"react-art.production.min.js (NODE_PROD)": {
"size": 60504,
"gzip": 18189
"size": 58905,
"gzip": 17961
},
"ReactARTFiber-dev.js (FB_DEV)": {
"size": 282891,
"gzip": 60125
"size": 280154,
"gzip": 59786
},
"ReactARTFiber-prod.js (FB_PROD)": {
"size": 220185,
"gzip": 45704
"size": 215532,
"gzip": 44949
},
"ReactNativeStack-dev.js (RN_DEV)": {
"size": 197039,
Expand All @@ -121,20 +121,20 @@
"gzip": 25990
},
"ReactNativeFiber-dev.js (RN_DEV)": {
"size": 301278,
"gzip": 51431
"size": 298654,
"gzip": 51338
},
"ReactNativeFiber-prod.js (RN_PROD)": {
"size": 221863,
"gzip": 38015
"size": 218380,
"gzip": 37833
},
"react-test-renderer.development.js (NODE_DEV)": {
"size": 280651,
"gzip": 59110
"size": 277864,
"gzip": 58787
},
"ReactTestRendererFiber-dev.js (FB_DEV)": {
"size": 280075,
"gzip": 59030
"size": 277288,
"gzip": 58707
},
"react-test-renderer-shallow.development.js (NODE_DEV)": {
"size": 8179,
Expand All @@ -145,8 +145,8 @@
"gzip": 2237
},
"react-noop-renderer.development.js (NODE_DEV)": {
"size": 274713,
"gzip": 57491
"size": 272012,
"gzip": 57213
},
"ReactHTMLString-dev.js (FB_DEV)": {
"size": 265654,
Expand Down Expand Up @@ -181,20 +181,20 @@
"gzip": 50920
},
"ReactDOMServer-dev.js (FB_DEV)": {
"size": 265645,
"gzip": 67788
"size": 266711,
"gzip": 67754
},
"ReactDOMServer-prod.js (FB_PROD)": {
"size": 197859,
"gzip": 51191
"size": 196897,
"gzip": 50775
},
"react-dom-node-stream.development.js (NODE_DEV)": {
"size": 265427,
"gzip": 67670
"size": 268954,
"gzip": 68326
},
"react-dom-node-stream.production.min.js (NODE_PROD)": {
"size": 62695,
"gzip": 21279
"size": 62773,
"gzip": 21284
},
"ReactDOMNodeStream-dev.js (FB_DEV)": {
"size": 264918,
Expand All @@ -203,6 +203,30 @@
"ReactDOMNodeStream-prod.js (FB_PROD)": {
"size": 197610,
"gzip": 50956
},
"react-dom-unstable-native-dependencies.development.js (UMD_DEV)": {
"size": 83733,
"gzip": 20936
},
"react-dom-unstable-native-dependencies.production.min.js (UMD_PROD)": {
"size": 18318,
"gzip": 5971
},
"react-dom-unstable-native-dependencies.development.js (NODE_DEV)": {
"size": 77146,
"gzip": 18982
},
"react-dom-unstable-native-dependencies.production.min.js (NODE_PROD)": {
"size": 16620,
"gzip": 5340
},
"ReactDOMUnstableNativeDependencies-dev.js (FB_DEV)": {
"size": 76860,
"gzip": 18942
},
"ReactDOMUnstableNativeDependencies-prod.js (FB_PROD)": {
"size": 65759,
"gzip": 15615
}
}
}
9 changes: 9 additions & 0 deletions src/node_modules/react-dom/unstable-native-dependencies.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule ReactDOMUnstableNativeDependenciesEntry
*/

const EventPluginUtils = require('EventPluginUtils');
const ResponderEventPlugin = require('ResponderEventPlugin');
const ResponderTouchHistoryStore = require('ResponderTouchHistoryStore');

const ReactDOMUnstableNativeDependencies = {
injectComponentTree: EventPluginUtils.injection.injectComponentTree,
ResponderEventPlugin,
ResponderTouchHistoryStore,
};

// Inject react-dom's ComponentTree into this module.
const ReactDOM = require('react-dom');
const {
ReactDOMComponentTree,
} = ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
ReactDOMUnstableNativeDependencies.injectComponentTree(ReactDOMComponentTree);

module.exports = ReactDOMUnstableNativeDependencies;
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@

var EventPluginHub;
var ResponderEventPlugin;
var EventPluginUtils;

var touch = function(nodeHandle, i) {
return {target: nodeHandle, identifier: i};
Expand Down Expand Up @@ -383,17 +382,22 @@ describe('ResponderEventPlugin', () => {
beforeEach(() => {
jest.resetModules();

// TODO: can we express this test with only public API?
EventPluginHub = require('EventPluginHub');
EventPluginUtils = require('EventPluginUtils');
ResponderEventPlugin = require('ResponderEventPlugin');
const ReactDOM = require('react-dom');
const ReactDOMUnstableNativeDependencies = require('react-dom/unstable-native-dependencies');
EventPluginHub =
ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED
.EventPluginHub;
const injectComponentTree =
ReactDOMUnstableNativeDependencies.injectComponentTree;
ResponderEventPlugin =
ReactDOMUnstableNativeDependencies.ResponderEventPlugin;

deleteAllListeners(GRANDPARENT_INST);
deleteAllListeners(PARENT_INST);
deleteAllListeners(CHILD_INST);
deleteAllListeners(CHILD_INST2);

EventPluginUtils.injection.injectComponentTree({
injectComponentTree({
getInstanceFromNode,
getNodeFromInstance,
});
Expand Down

0 comments on commit cff012f

Please sign in to comment.