From 72196da82915bee400edb1599d4223926aa2a8a0 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Fri, 7 Apr 2017 22:07:10 +0100 Subject: [PATCH] Replace shims with explicit React access from the renderers for shared global state (#9366) * Remove non-existent /lib/ from souce files * Replace all shims with explicit access This deletes shims and changes to access require('react').__DO_NOT_USE__ from renderers for global shared state. I cloned flattenChildren() and traverseAllChildren() because they relied on CurrentOwner but were used both from Stack and Isomorphic. The stack implementations will die, and the isomorphic ones can be changed to be optimized for Children specifically in the future. I also deleted UMD shims because they are now unnecessary. I moved the internals assignment to main modules since they're now used in tests, and made them direct UMD entry points. --- scripts/rollup/bundles.js | 19 +- scripts/rollup/modules.js | 101 +-------- scripts/rollup/results.json | 106 ++++----- .../rollup/ReactCheckPropTypesRollupShim.js | 3 - .../ReactComponentTreeHookRollupShim.js | 3 - .../rollup/ReactCurrentOwnerRollupShim.js | 3 - src/fb/ReactDOMFBEntry.js | 11 +- src/fb/ReactDOMFiberFBEntry.js | 66 +++--- src/fb/ReactFBEntry.js | 31 +-- src/isomorphic/React.js | 12 ++ .../children}/flattenChildren.js | 4 +- .../children}/traverseAllChildren.js | 2 +- .../__tests__/ReactComponentTreeHook-test.js | 4 +- .../ReactComponentTreeHook-test.native.js | 2 +- .../__tests__/ReactCompositeComponent-test.js | 2 +- .../ReactHostOperationHistoryHook-test.js | 2 +- src/renderers/__tests__/ReactPerf-test.js | 2 +- src/renderers/__tests__/refs-test.js | 4 +- src/renderers/dom/ReactDOM.js | 5 + src/renderers/dom/fiber/ReactDOMFiber.js | 5 + src/renderers/dom/shared/findDOMNode.js | 2 +- .../shared/hooks/ReactDOMInvalidARIAHook.js | 3 +- .../hooks/ReactDOMNullInputValuePropHook.js | 5 +- .../hooks/ReactDOMUnknownPropertyHook.js | 2 +- src/renderers/dom/stack/client/ReactMount.js | 2 +- src/renderers/native/findNodeHandle.js | 2 +- src/renderers/shared/ReactDebugTool.js | 2 +- .../shared/ReactGlobalSharedState.js | 27 +++ src/renderers/shared/fiber/ReactChildFiber.js | 2 +- .../shared/fiber/ReactFiberBeginWork.js | 2 +- .../shared/fiber/ReactFiberContext.js | 2 +- .../shared/fiber/ReactFiberScheduler.js | 2 +- .../shared/fiber/ReactFiberTreeReflection.js | 2 +- .../stack/reconciler/ReactChildReconciler.js | 10 +- .../reconciler/ReactCompositeComponent.js | 4 +- .../stack/reconciler/ReactMultiChild.js | 11 +- .../shared/stack/reconciler/ReactRef.js | 2 +- .../stack/reconciler/ReactUpdateQueue.js | 2 +- .../stack/reconciler/flattenStackChildren.js | 103 +++++++++ .../stack/reconciler/traverseStackChildren.js | 201 ++++++++++++++++++ src/test/ReactComponentTreeTestUtils.js | 2 +- src/test/ReactTestUtils.js | 2 +- src/umd/ReactDOMServerUMDEntry.js | 16 -- src/umd/ReactDOMUMDEntry.js | 23 -- src/umd/ReactUMDEntry.js | 37 ---- .../shims/ReactComponentTreeHookUMDShim.js | 18 -- src/umd/shims/ReactCurrentOwnerUMDShim.js | 18 -- src/umd/shims/ReactUMDShim.js | 16 -- 48 files changed, 509 insertions(+), 398 deletions(-) delete mode 100644 scripts/rollup/shims/rollup/ReactCheckPropTypesRollupShim.js delete mode 100644 scripts/rollup/shims/rollup/ReactComponentTreeHookRollupShim.js delete mode 100644 scripts/rollup/shims/rollup/ReactCurrentOwnerRollupShim.js rename src/{shared/utils => isomorphic/children}/flattenChildren.js (94%) rename src/{shared/utils => isomorphic/children}/traverseAllChildren.js (98%) create mode 100644 src/renderers/shared/ReactGlobalSharedState.js create mode 100644 src/renderers/shared/stack/reconciler/flattenStackChildren.js create mode 100644 src/renderers/shared/stack/reconciler/traverseStackChildren.js delete mode 100644 src/umd/ReactDOMServerUMDEntry.js delete mode 100644 src/umd/ReactDOMUMDEntry.js delete mode 100644 src/umd/ReactUMDEntry.js delete mode 100644 src/umd/shims/ReactComponentTreeHookUMDShim.js delete mode 100644 src/umd/shims/ReactCurrentOwnerUMDShim.js delete mode 100644 src/umd/shims/ReactUMDShim.js diff --git a/scripts/rollup/bundles.js b/scripts/rollup/bundles.js index a9010f0d0d..fc221c5a58 100644 --- a/scripts/rollup/bundles.js +++ b/scripts/rollup/bundles.js @@ -44,7 +44,7 @@ const bundles = [ moduleName: 'React', sourceMap: false, }, - entry: 'src/umd/ReactUMDEntry.js', + entry: 'src/isomorphic/React.js', externals: [], fbEntry: 'src/fb/ReactFBEntry.js', hasteName: 'React', @@ -53,9 +53,6 @@ const bundles = [ manglePropertiesOnProd: false, name: 'react', paths: [ - 'src/umd/ReactUMDEntry.js', - 'src/umd/shims/**/*.js', - 'src/isomorphic/**/*.js', 'src/addons/**/*.js', @@ -76,7 +73,7 @@ const bundles = [ moduleName: 'ReactDOM', sourceMap: false, }, - entry: 'src/umd/ReactDOMUMDEntry.js', + entry: 'src/renderers/dom/ReactDOM.js', externals: [], fbEntry: 'src/fb/ReactDOMFBEntry.js', hasteName: 'ReactDOMStack', @@ -85,8 +82,6 @@ const bundles = [ manglePropertiesOnProd: false, name: 'react-dom-stack', paths: [ - 'src/umd/ReactDOMUMDEntry.js', - 'src/renderers/dom/**/*.js', 'src/renderers/shared/**/*.js', 'src/test/**/*.js', // ReactTestUtils is currently very coupled to DOM. @@ -106,7 +101,7 @@ const bundles = [ moduleName: 'ReactDOM', sourceMap: false, }, - entry: 'src/umd/ReactDOMUMDEntry.js', + entry: 'src/renderers/dom/fiber/ReactDOMFiber.js', externals: [], fbEntry: 'src/fb/ReactDOMFiberFBEntry.js', hasteName: 'ReactDOMFiber', @@ -115,8 +110,6 @@ const bundles = [ manglePropertiesOnProd: false, name: 'react-dom', paths: [ - 'src/umd/ReactDOMUMDEntry.js', - 'src/renderers/dom/**/*.js', 'src/renderers/shared/**/*.js', 'src/test/**/*.js', // ReactTestUtils is currently very coupled to DOM. @@ -139,17 +132,15 @@ const bundles = [ moduleName: 'ReactDOMServer', sourceMap: false, }, - entry: 'src/umd/ReactDOMServerUMDEntry.js', + entry: 'src/renderers/dom/ReactDOMServer.js', externals: [], - fbEntry: 'src/umd/ReactDOMServerUMDEntry.js', + fbEntry: 'src/renderers/dom/ReactDOMServer.js', hasteName: 'ReactDOMServerStack', isRenderer: true, label: 'dom-server', manglePropertiesOnProd: false, name: 'react-dom/server', paths: [ - 'src/umd/ReactDOMServerUMDEntry.js', - 'src/renderers/dom/**/*.js', 'src/renderers/shared/**/*.js', diff --git a/scripts/rollup/modules.js b/scripts/rollup/modules.js index 03f897a197..e6b1904a46 100644 --- a/scripts/rollup/modules.js +++ b/scripts/rollup/modules.js @@ -48,10 +48,8 @@ const fbjsModules = [ const devOnlyFilesToStubOut = [ "'ReactDebugCurrentFrame'", "'ReactComponentTreeHook'", - "'react/lib/ReactDebugCurrentFrame'", - "'react/lib/ReactComponentTreeHook'", - "'react-dom/lib/ReactPerf'", - "'react-dom/lib/ReactTestUtils'", + "'ReactPerf'", + "'ReactTestUtils'", ]; // this function builds up a very niave Haste-like moduleMap @@ -114,7 +112,6 @@ function ignoreFBModules() { 'ReactDOMFeatureFlags', // In FB bundles, we preserve an inline require to ReactCurrentOwner. // See the explanation in FB version of ReactCurrentOwner in www: - 'react/lib/ReactCurrentOwner', 'ReactCurrentOwner', ]; } @@ -157,7 +154,7 @@ function getExternalModules(externals, bundleType, isRenderer) { case FB_DEV: case FB_PROD: fbjsModules.forEach(module => externalModules.push(module)); - externalModules.push('react/lib/ReactCurrentOwner', 'ReactCurrentOwner'); + externalModules.push('ReactCurrentOwner'); if (isRenderer) { externalModules.push('React'); } @@ -177,9 +174,6 @@ function getInternalModules() { function replaceInternalModules() { // we inline these modules in the bundles rather than leave them as external return { - "'react-dom/lib/ReactPerf'": `'${resolve('./src/renderers/shared/ReactPerf.js')}'`, - "'react-dom/lib/ReactTestUtils'": `'${resolve('./src/test/ReactTestUtils.js')}'`, - "'react-dom/lib/ReactInstanceMap'": `'${resolve('./src/renderers/shared/shared/ReactInstanceMap.js')}'`, "'react-dom'": `'${resolve('./src/renderers/dom/ReactDOM.js')}'`, }; } @@ -209,92 +203,16 @@ function getFbjsModuleAliases(bundleType) { function replaceFbjsModuleAliases(bundleType) { switch (bundleType) { - case UMD_DEV: - case UMD_PROD: - case NODE_DEV: - case NODE_PROD: - case RN_DEV: - case RN_PROD: - return {}; case FB_DEV: case FB_PROD: - // additionally we add mappings for "react" - // so they work correctly on FB, this will change soon + // Haste at FB doesn't currently allow case sensitive names, + // and product code already uses "React". In the future, + // we will either allow both variants or migrate to lowercase. return { "'react'": "'React'", }; - } -} - -// for renderers, we want them to require the __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner -// on the React bundle itself rather than require module directly. -// For the React bundle, ReactCurrentOwner should be bundled as part of the bundle -// itself and exposed on __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED -const shimReactCurrentOwner = resolve( - './scripts/rollup/shims/rollup/ReactCurrentOwnerRollupShim.js' -); -const realReactCurrentOwner = resolve( - './src/isomorphic/classic/element/ReactCurrentOwner.js' -); - -function getReactCurrentOwnerModuleAlias(bundleType, isRenderer) { - if (bundleType === FB_DEV || bundleType === FB_DEV) { - return {}; - } - if (isRenderer) { - return { - ReactCurrentOwner: shimReactCurrentOwner, - 'react/lib/ReactCurrentOwner': shimReactCurrentOwner, - }; - } else { - return { - ReactCurrentOwner: realReactCurrentOwner, - 'react/lib/ReactCurrentOwner': realReactCurrentOwner, - }; - } -} - -// this works almost identically to the ReactCurrentOwner shim above -const shimReactComponentTreeHook = resolve( - './scripts/rollup/shims/rollup/ReactComponentTreeHookRollupShim.js' -); -const realReactComponentTreeHook = resolve( - './src/isomorphic/hooks/ReactComponentTreeHook.js' -); - -function getReactComponentTreeHookModuleAlias(bundleType, isRenderer) { - if (isRenderer) { - return { - ReactComponentTreeHook: shimReactComponentTreeHook, - 'react/lib/ReactComponentTreeHook': shimReactComponentTreeHook, - }; - } else { - return { - ReactComponentTreeHook: realReactComponentTreeHook, - 'react/lib/ReactComponentTreeHook': realReactComponentTreeHook, - }; - } -} - -// this works almost identically to the ReactCurrentOwner shim above -const shimReactDebugCurrentFrame = resolve( - './scripts/rollup/shims/rollup/ReactDebugCurrentFrameRollupShim.js' -); -const realReactDebugCurrentFrame = resolve( - './src/isomorphic/classic/element/ReactDebugCurrentFrame.js' -); - -function getReactDebugCurrentFrameModuleAlias(bundleType, isRenderer) { - if (isRenderer) { - return { - ReactDebugCurrentFrame: shimReactDebugCurrentFrame, - 'react/lib/ReactDebugCurrentFrame': shimReactDebugCurrentFrame, - }; - } else { - return { - ReactDebugCurrentFrame: realReactDebugCurrentFrame, - 'react/lib/ReactDebugCurrentFrame': realReactDebugCurrentFrame, - }; + default: + return {}; } } @@ -321,9 +239,6 @@ function replaceDevOnlyStubbedModules(bundleType) { function getAliases(paths, bundleType, isRenderer, extractErrors) { return Object.assign( - getReactCurrentOwnerModuleAlias(bundleType, isRenderer), - getReactComponentTreeHookModuleAlias(bundleType, isRenderer), - getReactDebugCurrentFrameModuleAlias(bundleType, isRenderer), createModuleMap( paths, extractErrors && extractErrorCodes(errorCodeOpts), diff --git a/scripts/rollup/results.json b/scripts/rollup/results.json index ea610c1fd6..9d4a85e8cc 100644 --- a/scripts/rollup/results.json +++ b/scripts/rollup/results.json @@ -1,29 +1,29 @@ { - "branch": "master", + "branch": "remove-lib-in-source", "bundleSizes": { "react.development.js (UMD_DEV)": { - "size": 116245, - "gzip": 29572 + "size": 116098, + "gzip": 29520 }, "react.production.min.js (UMD_PROD)": { - "size": 13719, - "gzip": 5080 + "size": 13707, + "gzip": 5073 }, "react-dom.development.js (UMD_DEV)": { - "size": 563524, - "gzip": 130148 + "size": 563844, + "gzip": 130190 }, "react-dom.production.min.js (UMD_PROD)": { - "size": 120123, - "gzip": 37844 + "size": 120191, + "gzip": 37860 }, "react-dom-server.development.js (UMD_DEV)": { - "size": 475780, - "gzip": 115177 + "size": 476049, + "gzip": 115267 }, "react-dom-server.production.min.js (UMD_PROD)": { - "size": 106349, - "gzip": 32997 + "size": 106489, + "gzip": 33035 }, "react-art.development.js (UMD_DEV)": { "size": 339599, @@ -34,68 +34,68 @@ "gzip": 28977 }, "react.development.js (NODE_DEV)": { - "size": 109259, - "gzip": 27527 + "size": 109110, + "gzip": 27479 }, "react.production.min.js (NODE_PROD)": { - "size": 12615, - "gzip": 4659 + "size": 12598, + "gzip": 4649 }, "React-dev.js (FB_DEV)": { - "size": 110742, - "gzip": 28082 + "size": 110875, + "gzip": 28140 }, "React-prod.js (FB_PROD)": { - "size": 56205, - "gzip": 14329 + "size": 56406, + "gzip": 14416 }, "ReactDOMStack-dev.js (FB_DEV)": { - "size": 521957, - "gzip": 124586 + "size": 522626, + "gzip": 124708 }, "ReactDOMStack-prod.js (FB_PROD)": { - "size": 351707, - "gzip": 84366 + "size": 352708, + "gzip": 84660 }, "react-dom.development.js (NODE_DEV)": { - "size": 541898, - "gzip": 125114 + "size": 542218, + "gzip": 125162 }, "react-dom.production.min.js (NODE_PROD)": { - "size": 116802, - "gzip": 36707 + "size": 116858, + "gzip": 36717 }, "ReactDOMFiber-dev.js (FB_DEV)": { - "size": 796380, - "gzip": 183920 + "size": 797268, + "gzip": 184134 }, "ReactDOMFiber-prod.js (FB_PROD)": { - "size": 407360, - "gzip": 93460 + "size": 407540, + "gzip": 93567 }, "react-dom-server.development.js (NODE_DEV)": { - "size": 445181, - "gzip": 107467 + "size": 445452, + "gzip": 107574 }, "react-dom-server.production.min.js (NODE_PROD)": { - "size": 101204, - "gzip": 31227 + "size": 101344, + "gzip": 31273 }, "ReactDOMServerStack-dev.js (FB_DEV)": { - "size": 443932, - "gzip": 107406 + "size": 444144, + "gzip": 107423 }, "ReactDOMServerStack-prod.js (FB_PROD)": { - "size": 332974, - "gzip": 80217 + "size": 333744, + "gzip": 80424 }, "ReactARTStack-dev.js (FB_DEV)": { - "size": 492711, - "gzip": 118489 + "size": 492651, + "gzip": 118470 }, "ReactARTStack-prod.js (FB_PROD)": { - "size": 365115, - "gzip": 87596 + "size": 365055, + "gzip": 87582 }, "react-art.development.js (NODE_DEV)": { "size": 264816, @@ -106,12 +106,12 @@ "gzip": 17109 }, "ReactARTFiber-dev.js (FB_DEV)": { - "size": 263991, - "gzip": 56709 + "size": 263951, + "gzip": 56683 }, "ReactARTFiber-prod.js (FB_PROD)": { - "size": 205194, - "gzip": 43039 + "size": 205154, + "gzip": 43017 }, "ReactNativeStack.js (RN)": { "size": 233993, @@ -122,12 +122,12 @@ "gzip": 84001 }, "ReactTestRendererFiber-dev.js (FB_DEV)": { - "size": 261900, - "gzip": 55671 + "size": 261860, + "gzip": 55645 }, "ReactTestRendererStack-dev.js (FB_DEV)": { - "size": 151142, - "gzip": 34709 + "size": 151102, + "gzip": 34699 }, "react-noop-renderer.development.js (NODE_DEV)": { "size": 253895, diff --git a/scripts/rollup/shims/rollup/ReactCheckPropTypesRollupShim.js b/scripts/rollup/shims/rollup/ReactCheckPropTypesRollupShim.js deleted file mode 100644 index f8866b76e6..0000000000 --- a/scripts/rollup/shims/rollup/ReactCheckPropTypesRollupShim.js +++ /dev/null @@ -1,3 +0,0 @@ -var React = require('react'); - -module.exports = React.checkPropTypes; diff --git a/scripts/rollup/shims/rollup/ReactComponentTreeHookRollupShim.js b/scripts/rollup/shims/rollup/ReactComponentTreeHookRollupShim.js deleted file mode 100644 index bcdc4d8787..0000000000 --- a/scripts/rollup/shims/rollup/ReactComponentTreeHookRollupShim.js +++ /dev/null @@ -1,3 +0,0 @@ -var ReactInternals = require('react').__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; - -module.exports = ReactInternals.ReactComponentTreeHook; diff --git a/scripts/rollup/shims/rollup/ReactCurrentOwnerRollupShim.js b/scripts/rollup/shims/rollup/ReactCurrentOwnerRollupShim.js deleted file mode 100644 index 3e5579b86c..0000000000 --- a/scripts/rollup/shims/rollup/ReactCurrentOwnerRollupShim.js +++ /dev/null @@ -1,3 +0,0 @@ -var ReactInternals = require('react').__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; - -module.exports = ReactInternals.ReactCurrentOwner; diff --git a/src/fb/ReactDOMFBEntry.js b/src/fb/ReactDOMFBEntry.js index 7545c5ce3f..754febaf36 100644 --- a/src/fb/ReactDOMFBEntry.js +++ b/src/fb/ReactDOMFBEntry.js @@ -11,7 +11,7 @@ var ReactDOM = require('ReactDOM'); -ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = { +Object.assign(ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, { // These should be easy to copy into react_contrib and remove from here: adler32: require('adler32'), getVendorPrefixedEventName: require('getVendorPrefixedEventName'), @@ -29,25 +29,24 @@ ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = { SyntheticKeyboardEvent: require('SyntheticKeyboardEvent'), SyntheticMouseEvent: require('SyntheticMouseEvent'), // These are real internal dependencies that are trickier to remove: - EventPluginHub: require('EventPluginHub'), ReactBrowserEventEmitter: require('ReactBrowserEventEmitter'), ReactErrorUtils: require('ReactErrorUtils'), ReactDOMComponentTree: require('ReactDOMComponentTree'), - ReactInstanceMap: require('react-dom/lib/ReactInstanceMap'), + ReactInstanceMap: require('ReactInstanceMap'), // This is used for ajaxify on www: DOMProperty: require('DOMProperty'), // These are dependencies of TapEventPlugin: EventPluginUtils: require('EventPluginUtils'), EventPropagators: require('EventPropagators'), SyntheticUIEvent: require('SyntheticUIEvent'), -}; +}); if (__DEV__) { Object.assign(ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, { // ReactPerf and ReactTestUtils currently only work with the DOM renderer // so we expose them from here, but only in DEV mode. - ReactPerf: require('react-dom/lib/ReactPerf'), - ReactTestUtils: require('react-dom/lib/ReactTestUtils'), + ReactPerf: require('ReactPerf'), + ReactTestUtils: require('ReactTestUtils'), }); } diff --git a/src/fb/ReactDOMFiberFBEntry.js b/src/fb/ReactDOMFiberFBEntry.js index c019d38c00..188b9c7124 100644 --- a/src/fb/ReactDOMFiberFBEntry.js +++ b/src/fb/ReactDOMFiberFBEntry.js @@ -11,37 +11,39 @@ var ReactDOMFiber = require('ReactDOMFiber'); -ReactDOMFiber.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = { - // These should be easy to copy into react_contrib and remove from here: - adler32: require('adler32'), - getVendorPrefixedEventName: require('getVendorPrefixedEventName'), - getEventCharCode: require('getEventCharCode'), - getEventKey: require('getEventKey'), - getEventTarget: require('getEventTarget'), - isEventSupported: require('isEventSupported'), - setInnerHTML: require('setInnerHTML'), - setTextContent: require('setTextContent'), - PooledClass: require('PooledClass'), - ReactDOMSelection: require('ReactDOMSelection'), - ReactInputSelection: require('ReactInputSelection'), - // These are mostly used in incorrect Flow typings and are codemoddable: - SyntheticEvent: require('SyntheticEvent'), - SyntheticKeyboardEvent: require('SyntheticKeyboardEvent'), - SyntheticMouseEvent: require('SyntheticMouseEvent'), - // These are real internal dependencies that are trickier to remove: - EventPluginHub: require('EventPluginHub'), - ReactBrowserEventEmitter: require('ReactBrowserEventEmitter'), - ReactErrorUtils: require('ReactErrorUtils'), - ReactFiberErrorLogger: require('ReactFiberErrorLogger'), - ReactDOMComponentTree: require('ReactDOMComponentTree'), - ReactInstanceMap: require('react-dom/lib/ReactInstanceMap'), - // This is used for ajaxify on www: - DOMProperty: require('DOMProperty'), - // These are dependencies of TapEventPlugin: - EventPluginUtils: require('EventPluginUtils'), - EventPropagators: require('EventPropagators'), - SyntheticUIEvent: require('SyntheticUIEvent'), -}; +Object.assign( + ReactDOMFiber.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, + { + // These should be easy to copy into react_contrib and remove from here: + adler32: require('adler32'), + getVendorPrefixedEventName: require('getVendorPrefixedEventName'), + getEventCharCode: require('getEventCharCode'), + getEventKey: require('getEventKey'), + getEventTarget: require('getEventTarget'), + isEventSupported: require('isEventSupported'), + setInnerHTML: require('setInnerHTML'), + setTextContent: require('setTextContent'), + PooledClass: require('PooledClass'), + ReactDOMSelection: require('ReactDOMSelection'), + ReactInputSelection: require('ReactInputSelection'), + // These are mostly used in incorrect Flow typings and are codemoddable: + SyntheticEvent: require('SyntheticEvent'), + SyntheticKeyboardEvent: require('SyntheticKeyboardEvent'), + SyntheticMouseEvent: require('SyntheticMouseEvent'), + // These are real internal dependencies that are trickier to remove: + ReactBrowserEventEmitter: require('ReactBrowserEventEmitter'), + ReactErrorUtils: require('ReactErrorUtils'), + ReactFiberErrorLogger: require('ReactFiberErrorLogger'), + ReactDOMComponentTree: require('ReactDOMComponentTree'), + ReactInstanceMap: require('ReactInstanceMap'), + // This is used for ajaxify on www: + DOMProperty: require('DOMProperty'), + // These are dependencies of TapEventPlugin: + EventPluginUtils: require('EventPluginUtils'), + EventPropagators: require('EventPropagators'), + SyntheticUIEvent: require('SyntheticUIEvent'), + }, +); if (__DEV__) { Object.assign( @@ -49,7 +51,7 @@ if (__DEV__) { { // ReactPerf and ReactTestUtils currently only work with the DOM renderer // so we expose them from here, but only in DEV mode. - ReactTestUtils: require('react-dom/lib/ReactTestUtils'), + ReactTestUtils: require('ReactTestUtils'), }, ); } diff --git a/src/fb/ReactFBEntry.js b/src/fb/ReactFBEntry.js index e4d70b5d59..ac3fe41e62 100644 --- a/src/fb/ReactFBEntry.js +++ b/src/fb/ReactFBEntry.js @@ -11,27 +11,12 @@ var React = require('React'); -// `version` will be added here by the React module. -var ReactFBEntry = Object.assign( - { - __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { - ReactChildren: require('ReactChildren'), - getComponentName: require('getComponentName'), - flattenChildren: require('flattenChildren'), - }, - }, - React, -); +// Add existing internal dependencies from www codebase. +// The goal is to get rid of these with time or turn them into public APIs. +Object.assign(React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, { + ReactChildren: require('ReactChildren'), + getComponentName: require('getComponentName'), + flattenChildren: require('flattenChildren'), +}); -if (__DEV__) { - Object.assign( - ReactFBEntry.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, - { - // These should not be included in production. - ReactComponentTreeHook: require('react/lib/ReactComponentTreeHook'), - ReactDebugCurrentFrame: require('react/lib/ReactDebugCurrentFrame'), - }, - ); -} - -module.exports = ReactFBEntry; +module.exports = React; diff --git a/src/isomorphic/React.js b/src/isomorphic/React.js index 4e03036be2..5e57605f1c 100644 --- a/src/isomorphic/React.js +++ b/src/isomorphic/React.js @@ -84,6 +84,18 @@ var React = { DOM: ReactDOMFactories, version: ReactVersion, + + __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { + ReactCurrentOwner: require('ReactCurrentOwner'), + }, }; +if (__DEV__) { + Object.assign(React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, { + // These should not be included in production. + ReactComponentTreeHook: require('ReactComponentTreeHook'), + ReactDebugCurrentFrame: require('ReactDebugCurrentFrame'), + }); +} + module.exports = React; diff --git a/src/shared/utils/flattenChildren.js b/src/isomorphic/children/flattenChildren.js similarity index 94% rename from src/shared/utils/flattenChildren.js rename to src/isomorphic/children/flattenChildren.js index 21a5da7140..c6caa802be 100644 --- a/src/shared/utils/flattenChildren.js +++ b/src/isomorphic/children/flattenChildren.js @@ -28,7 +28,7 @@ if ( // https://github.com/facebook/react/issues/7240 // Remove the inline requires when we don't need them anymore: // https://github.com/facebook/react/pull/7178 - ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); + ReactComponentTreeHook = require('ReactComponentTreeHook'); } /** @@ -49,7 +49,7 @@ function flattenSingleChildIntoContext( const keyUnique = result[name] === undefined; if (__DEV__) { if (!ReactComponentTreeHook) { - ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); + ReactComponentTreeHook = require('ReactComponentTreeHook'); } if (!keyUnique) { warning( diff --git a/src/shared/utils/traverseAllChildren.js b/src/isomorphic/children/traverseAllChildren.js similarity index 98% rename from src/shared/utils/traverseAllChildren.js rename to src/isomorphic/children/traverseAllChildren.js index dd8b49fb58..a68d1816d6 100644 --- a/src/shared/utils/traverseAllChildren.js +++ b/src/isomorphic/children/traverseAllChildren.js @@ -11,8 +11,8 @@ 'use strict'; -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var REACT_ELEMENT_TYPE = require('ReactElementSymbol'); +var ReactCurrentOwner = require('ReactCurrentOwner'); var getIteratorFn = require('getIteratorFn'); var invariant = require('fbjs/lib/invariant'); diff --git a/src/renderers/__tests__/ReactComponentTreeHook-test.js b/src/renderers/__tests__/ReactComponentTreeHook-test.js index 0decdcd72f..2182aabf38 100644 --- a/src/renderers/__tests__/ReactComponentTreeHook-test.js +++ b/src/renderers/__tests__/ReactComponentTreeHook-test.js @@ -29,7 +29,7 @@ describe('ReactComponentTreeHook', () => { ReactDOM = require('react-dom'); ReactDOMServer = require('react-dom/server'); ReactInstanceMap = require('ReactInstanceMap'); - ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); + ReactComponentTreeHook = require('ReactComponentTreeHook'); ReactComponentTreeTestUtils = require('ReactComponentTreeTestUtils'); }); @@ -2123,7 +2123,7 @@ describe('ReactComponentTreeHook', () => { ReactDOM = require('react-dom'); ReactDOMServer = require('react-dom/server'); ReactInstanceMap = require('ReactInstanceMap'); - ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); + ReactComponentTreeHook = require('ReactComponentTreeHook'); ReactComponentTreeTestUtils = require('ReactComponentTreeTestUtils'); }); diff --git a/src/renderers/__tests__/ReactComponentTreeHook-test.native.js b/src/renderers/__tests__/ReactComponentTreeHook-test.native.js index 2de9bff4ef..dd7be7d701 100644 --- a/src/renderers/__tests__/ReactComponentTreeHook-test.native.js +++ b/src/renderers/__tests__/ReactComponentTreeHook-test.native.js @@ -36,7 +36,7 @@ describeStack('ReactComponentTreeHook', () => { React = require('react'); ReactNative = require('ReactNative'); ReactInstanceMap = require('ReactInstanceMap'); - ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); + ReactComponentTreeHook = require('ReactComponentTreeHook'); ReactComponentTreeTestUtils = require('ReactComponentTreeTestUtils'); View = require('View'); createReactNativeComponentClass = require('createReactNativeComponentClass'); diff --git a/src/renderers/__tests__/ReactCompositeComponent-test.js b/src/renderers/__tests__/ReactCompositeComponent-test.js index 7259ec57b2..7a7be1a0d1 100644 --- a/src/renderers/__tests__/ReactCompositeComponent-test.js +++ b/src/renderers/__tests__/ReactCompositeComponent-test.js @@ -30,7 +30,7 @@ describe('ReactCompositeComponent', () => { ReactDOM = require('react-dom'); ReactDOMFeatureFlags = require('ReactDOMFeatureFlags'); ReactDOMServer = require('react-dom/server'); - ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); + ReactCurrentOwner = require('ReactCurrentOwner'); ReactPropTypes = require('ReactPropTypes'); ReactTestUtils = require('ReactTestUtils'); shallowEqual = require('fbjs/lib/shallowEqual'); diff --git a/src/renderers/__tests__/ReactHostOperationHistoryHook-test.js b/src/renderers/__tests__/ReactHostOperationHistoryHook-test.js index b787fa13f5..81fc2683eb 100644 --- a/src/renderers/__tests__/ReactHostOperationHistoryHook-test.js +++ b/src/renderers/__tests__/ReactHostOperationHistoryHook-test.js @@ -27,7 +27,7 @@ describeStack('ReactHostOperationHistoryHook', () => { jest.resetModules(); React = require('react'); - ReactPerf = require('react-dom/lib/ReactPerf'); + ReactPerf = require('ReactPerf'); ReactDOM = require('react-dom'); ReactDOMComponentTree = require('ReactDOMComponentTree'); ReactHostOperationHistoryHook = require('ReactHostOperationHistoryHook'); diff --git a/src/renderers/__tests__/ReactPerf-test.js b/src/renderers/__tests__/ReactPerf-test.js index 7957266e6d..f01b3193d0 100644 --- a/src/renderers/__tests__/ReactPerf-test.js +++ b/src/renderers/__tests__/ReactPerf-test.js @@ -41,7 +41,7 @@ describeStack('ReactPerf', () => { React = require('react'); ReactDOM = require('react-dom'); - ReactPerf = require('react-dom/lib/ReactPerf'); + ReactPerf = require('ReactPerf'); ReactTestUtils = require('ReactTestUtils'); emptyFunction = require('fbjs/lib/emptyFunction'); diff --git a/src/renderers/__tests__/refs-test.js b/src/renderers/__tests__/refs-test.js index 758fb51af0..202a101f1c 100644 --- a/src/renderers/__tests__/refs-test.js +++ b/src/renderers/__tests__/refs-test.js @@ -317,7 +317,7 @@ describe('string refs between fiber and stack', () => { it('attaches, detaches from fiber component with stack layer', () => { spyOn(console, 'error'); - const ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); + const ReactCurrentOwner = require('ReactCurrentOwner'); const ReactDOM = require('react-dom'); const ReactDOMFiber = require('ReactDOMFiber'); const ReactInstanceMap = require('ReactInstanceMap'); @@ -364,7 +364,7 @@ describe('string refs between fiber and stack', () => { it('attaches, detaches from stack component with fiber layer', () => { spyOn(console, 'error'); - const ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); + const ReactCurrentOwner = require('ReactCurrentOwner'); const ReactDOM = require('react-dom'); const ReactDOMFiber = require('ReactDOMFiber'); const ReactInstanceMap = require('ReactInstanceMap'); diff --git a/src/renderers/dom/ReactDOM.js b/src/renderers/dom/ReactDOM.js index 23a189f0c5..f5f976ea7d 100644 --- a/src/renderers/dom/ReactDOM.js +++ b/src/renderers/dom/ReactDOM.js @@ -38,6 +38,11 @@ var ReactDOM = { unstable_batchedUpdates: ReactGenericBatching.batchedUpdates, unstable_renderSubtreeIntoContainer: ReactMount.renderSubtreeIntoContainer, /* eslint-enable camelcase */ + + __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { + // For TapEventPlugin which is popular in open source + EventPluginHub: require('EventPluginHub'), + }, }; // Inject the runtime into a devtools global hook regardless of browser. diff --git a/src/renderers/dom/fiber/ReactDOMFiber.js b/src/renderers/dom/fiber/ReactDOMFiber.js index be4d800a7d..80598dfb69 100644 --- a/src/renderers/dom/fiber/ReactDOMFiber.js +++ b/src/renderers/dom/fiber/ReactDOMFiber.js @@ -539,6 +539,11 @@ var ReactDOM = { unstable_batchedUpdates: ReactGenericBatching.batchedUpdates, unstable_deferredUpdates: DOMRenderer.deferredUpdates, + + __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { + // For TapEventPlugin which is popular in open source + EventPluginHub: require('EventPluginHub'), + }, }; if (typeof injectInternals === 'function') { diff --git a/src/renderers/dom/shared/findDOMNode.js b/src/renderers/dom/shared/findDOMNode.js index ea1ef8d0f4..35aa38518d 100644 --- a/src/renderers/dom/shared/findDOMNode.js +++ b/src/renderers/dom/shared/findDOMNode.js @@ -10,8 +10,8 @@ * @flow */ -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var ReactInstanceMap = require('ReactInstanceMap'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); var getComponentName = require('getComponentName'); var invariant = require('fbjs/lib/invariant'); diff --git a/src/renderers/dom/shared/hooks/ReactDOMInvalidARIAHook.js b/src/renderers/dom/shared/hooks/ReactDOMInvalidARIAHook.js index fb89d76220..6ada3db767 100644 --- a/src/renderers/dom/shared/hooks/ReactDOMInvalidARIAHook.js +++ b/src/renderers/dom/shared/hooks/ReactDOMInvalidARIAHook.js @@ -20,9 +20,10 @@ var warnedProperties = {}; var rARIA = new RegExp('^(aria)-[' + DOMProperty.ATTRIBUTE_NAME_CHAR + ']*$'); if (__DEV__) { + var {ReactComponentTreeHook} = require('ReactGlobalSharedState'); var { getStackAddendumByID, - } = require('react/lib/ReactComponentTreeHook'); + } = ReactComponentTreeHook; } function getStackAddendum(debugID) { diff --git a/src/renderers/dom/shared/hooks/ReactDOMNullInputValuePropHook.js b/src/renderers/dom/shared/hooks/ReactDOMNullInputValuePropHook.js index 92e2cf2c19..6b722b4864 100644 --- a/src/renderers/dom/shared/hooks/ReactDOMNullInputValuePropHook.js +++ b/src/renderers/dom/shared/hooks/ReactDOMNullInputValuePropHook.js @@ -15,9 +15,8 @@ var ReactDebugCurrentFiber = require('ReactDebugCurrentFiber'); var warning = require('fbjs/lib/warning'); if (__DEV__) { - var { - getStackAddendumByID, - } = require('react/lib/ReactComponentTreeHook'); + var {ReactComponentTreeHook} = require('ReactGlobalSharedState'); + var {getStackAddendumByID} = ReactComponentTreeHook; } var didWarnValueNull = false; diff --git a/src/renderers/dom/shared/hooks/ReactDOMUnknownPropertyHook.js b/src/renderers/dom/shared/hooks/ReactDOMUnknownPropertyHook.js index c603e4ca76..86b28f92e2 100644 --- a/src/renderers/dom/shared/hooks/ReactDOMUnknownPropertyHook.js +++ b/src/renderers/dom/shared/hooks/ReactDOMUnknownPropertyHook.js @@ -13,8 +13,8 @@ var DOMProperty = require('DOMProperty'); var EventPluginRegistry = require('EventPluginRegistry'); -var ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); var ReactDebugCurrentFiber = require('ReactDebugCurrentFiber'); +var {ReactComponentTreeHook} = require('ReactGlobalSharedState'); var warning = require('fbjs/lib/warning'); diff --git a/src/renderers/dom/stack/client/ReactMount.js b/src/renderers/dom/stack/client/ReactMount.js index 93c21c84a2..9cbc2c91e4 100644 --- a/src/renderers/dom/stack/client/ReactMount.js +++ b/src/renderers/dom/stack/client/ReactMount.js @@ -14,7 +14,6 @@ var DOMLazyTree = require('DOMLazyTree'); var DOMProperty = require('DOMProperty'); var React = require('react'); -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var ReactDOMComponentTree = require('ReactDOMComponentTree'); var ReactDOMContainerInfo = require('ReactDOMContainerInfo'); var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags'); @@ -25,6 +24,7 @@ var ReactMarkupChecksum = require('ReactMarkupChecksum'); var ReactReconciler = require('ReactReconciler'); var ReactUpdateQueue = require('ReactUpdateQueue'); var ReactUpdates = require('ReactUpdates'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); var getContextForSubtree = require('getContextForSubtree'); var instantiateReactComponent = require('instantiateReactComponent'); diff --git a/src/renderers/native/findNodeHandle.js b/src/renderers/native/findNodeHandle.js index 68ec7e503d..10008836ff 100644 --- a/src/renderers/native/findNodeHandle.js +++ b/src/renderers/native/findNodeHandle.js @@ -12,8 +12,8 @@ 'use strict'; -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var ReactInstanceMap = require('ReactInstanceMap'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); var invariant = require('fbjs/lib/invariant'); var warning = require('fbjs/lib/warning'); diff --git a/src/renderers/shared/ReactDebugTool.js b/src/renderers/shared/ReactDebugTool.js index b5ad9efeb9..7be3d38fe7 100644 --- a/src/renderers/shared/ReactDebugTool.js +++ b/src/renderers/shared/ReactDebugTool.js @@ -14,8 +14,8 @@ var ReactInvalidSetStateWarningHook = require('ReactInvalidSetStateWarningHook'); var ReactHostOperationHistoryHook = require('ReactHostOperationHistoryHook'); -var ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); var ExecutionEnvironment = require('fbjs/lib/ExecutionEnvironment'); +var {ReactComponentTreeHook} = require('ReactGlobalSharedState'); var performanceNow = require('fbjs/lib/performanceNow'); var warning = require('fbjs/lib/warning'); diff --git a/src/renderers/shared/ReactGlobalSharedState.js b/src/renderers/shared/ReactGlobalSharedState.js new file mode 100644 index 0000000000..b9107b4358 --- /dev/null +++ b/src/renderers/shared/ReactGlobalSharedState.js @@ -0,0 +1,27 @@ +/** + * 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 ReactGlobalSharedState + */ + +'use strict'; + +var ReactInternals = require('react').__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; + +var ReactGlobalSharedState = { + ReactCurrentOwner: ReactInternals.ReactCurrentOwner, +}; + +if (__DEV__) { + Object.assign(ReactGlobalSharedState, { + ReactComponentTreeHook: ReactInternals.ReactComponentTreeHook, + ReactDebugCurrentFrame: ReactInternals.ReactDebugCurrentFrame, + }); +} + +module.exports = ReactGlobalSharedState; diff --git a/src/renderers/shared/fiber/ReactChildFiber.js b/src/renderers/shared/fiber/ReactChildFiber.js index f56c80e1b9..ac6eab0138 100644 --- a/src/renderers/shared/fiber/ReactChildFiber.js +++ b/src/renderers/shared/fiber/ReactChildFiber.js @@ -36,7 +36,7 @@ var emptyObject = require('fbjs/lib/emptyObject'); var getIteratorFn = require('getIteratorFn'); var invariant = require('fbjs/lib/invariant'); var ReactFeatureFlags = require('ReactFeatureFlags'); -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); if (__DEV__) { var {getCurrentFiberStackAddendum} = require('ReactDebugCurrentFiber'); diff --git a/src/renderers/shared/fiber/ReactFiberBeginWork.js b/src/renderers/shared/fiber/ReactFiberBeginWork.js index ad58d04461..3787e98be0 100644 --- a/src/renderers/shared/fiber/ReactFiberBeginWork.js +++ b/src/renderers/shared/fiber/ReactFiberBeginWork.js @@ -60,8 +60,8 @@ var { Err, Ref, } = require('ReactTypeOfSideEffect'); -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var ReactFiberClassComponent = require('ReactFiberClassComponent'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); var invariant = require('fbjs/lib/invariant'); if (__DEV__) { diff --git a/src/renderers/shared/fiber/ReactFiberContext.js b/src/renderers/shared/fiber/ReactFiberContext.js index 67f37d1776..e60fdd850e 100644 --- a/src/renderers/shared/fiber/ReactFiberContext.js +++ b/src/renderers/shared/fiber/ReactFiberContext.js @@ -34,8 +34,8 @@ const { } = require('ReactFiberStack'); if (__DEV__) { - var ReactDebugCurrentFrame = require('react/lib/ReactDebugCurrentFrame'); var ReactDebugCurrentFiber = require('ReactDebugCurrentFiber'); + var {ReactDebugCurrentFrame} = require('ReactGlobalSharedState'); var { startPhaseTimer, stopPhaseTimer, diff --git a/src/renderers/shared/fiber/ReactFiberScheduler.js b/src/renderers/shared/fiber/ReactFiberScheduler.js index 520b1c8954..80ff10825e 100644 --- a/src/renderers/shared/fiber/ReactFiberScheduler.js +++ b/src/renderers/shared/fiber/ReactFiberScheduler.js @@ -45,8 +45,8 @@ var ReactFiberBeginWork = require('ReactFiberBeginWork'); var ReactFiberCompleteWork = require('ReactFiberCompleteWork'); var ReactFiberCommitWork = require('ReactFiberCommitWork'); var ReactFiberHostContext = require('ReactFiberHostContext'); -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var ReactFeatureFlags = require('ReactFeatureFlags'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); var getComponentName = require('getComponentName'); var {cloneFiber} = require('ReactFiber'); diff --git a/src/renderers/shared/fiber/ReactFiberTreeReflection.js b/src/renderers/shared/fiber/ReactFiberTreeReflection.js index 1cd0dea6ed..b527587c45 100644 --- a/src/renderers/shared/fiber/ReactFiberTreeReflection.js +++ b/src/renderers/shared/fiber/ReactFiberTreeReflection.js @@ -15,7 +15,7 @@ import type {Fiber} from 'ReactFiber'; var ReactInstanceMap = require('ReactInstanceMap'); -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); var getComponentName = require('getComponentName'); var invariant = require('fbjs/lib/invariant'); diff --git a/src/renderers/shared/stack/reconciler/ReactChildReconciler.js b/src/renderers/shared/stack/reconciler/ReactChildReconciler.js index 7c9a13bfd0..b0eedb0af9 100644 --- a/src/renderers/shared/stack/reconciler/ReactChildReconciler.js +++ b/src/renderers/shared/stack/reconciler/ReactChildReconciler.js @@ -17,7 +17,7 @@ var ReactReconciler = require('ReactReconciler'); var instantiateReactComponent = require('instantiateReactComponent'); var shouldUpdateReactComponent = require('shouldUpdateReactComponent'); -var traverseAllChildren = require('traverseAllChildren'); +var traverseStackChildren = require('traverseStackChildren'); var warning = require('fbjs/lib/warning'); var ReactComponentTreeHook; @@ -32,7 +32,7 @@ if ( // https://github.com/facebook/react/issues/7240 // Remove the inline requires when we don't need them anymore: // https://github.com/facebook/react/pull/7178 - ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); + ReactComponentTreeHook = require('ReactGlobalSharedState').ReactComponentTreeHook; } function instantiateChild(childInstances, child, name, selfDebugID) { @@ -40,7 +40,7 @@ function instantiateChild(childInstances, child, name, selfDebugID) { var keyUnique = childInstances[name] === undefined; if (__DEV__) { if (!ReactComponentTreeHook) { - ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); + ReactComponentTreeHook = require('ReactGlobalSharedState').ReactComponentTreeHook; } if (!keyUnique) { warning( @@ -84,14 +84,14 @@ var ReactChildReconciler = { var childInstances = {}; if (__DEV__) { - traverseAllChildren( + traverseStackChildren( nestedChildNodes, (childInsts, child, name) => instantiateChild(childInsts, child, name, selfDebugID), childInstances, ); } else { - traverseAllChildren(nestedChildNodes, instantiateChild, childInstances); + traverseStackChildren(nestedChildNodes, instantiateChild, childInstances); } return childInstances; }, diff --git a/src/renderers/shared/stack/reconciler/ReactCompositeComponent.js b/src/renderers/shared/stack/reconciler/ReactCompositeComponent.js index d2217db557..6649dffaf6 100644 --- a/src/renderers/shared/stack/reconciler/ReactCompositeComponent.js +++ b/src/renderers/shared/stack/reconciler/ReactCompositeComponent.js @@ -14,16 +14,16 @@ var React = require('react'); var ReactComponentEnvironment = require('ReactComponentEnvironment'); var ReactCompositeComponentTypes = require('ReactCompositeComponentTypes'); -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var ReactErrorUtils = require('ReactErrorUtils'); var ReactFeatureFlags = require('ReactFeatureFlags'); var ReactInstanceMap = require('ReactInstanceMap'); var ReactInstrumentation = require('ReactInstrumentation'); var ReactNodeTypes = require('ReactNodeTypes'); var ReactReconciler = require('ReactReconciler'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); if (__DEV__) { - var ReactDebugCurrentFrame = require('react/lib/ReactDebugCurrentFrame'); + var {ReactDebugCurrentFrame} = require('ReactGlobalSharedState'); var warningAboutMissingGetChildContext = {}; } diff --git a/src/renderers/shared/stack/reconciler/ReactMultiChild.js b/src/renderers/shared/stack/reconciler/ReactMultiChild.js index 19fd366a38..8bde4e26ff 100644 --- a/src/renderers/shared/stack/reconciler/ReactMultiChild.js +++ b/src/renderers/shared/stack/reconciler/ReactMultiChild.js @@ -15,12 +15,12 @@ var ReactComponentEnvironment = require('ReactComponentEnvironment'); var ReactInstanceMap = require('ReactInstanceMap'); var ReactInstrumentation = require('ReactInstrumentation'); -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var ReactReconciler = require('ReactReconciler'); var ReactChildReconciler = require('ReactChildReconciler'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); var emptyFunction = require('fbjs/lib/emptyFunction'); -var flattenChildren = require('flattenChildren'); +var flattenStackChildren = require('flattenStackChildren'); var invariant = require('fbjs/lib/invariant'); /** @@ -212,7 +212,7 @@ var ReactMultiChild = { if (this._currentElement) { try { ReactCurrentOwner.current = this._currentElement._owner; - nextChildren = flattenChildren( + nextChildren = flattenStackChildren( nextNestedChildrenElements, selfDebugID, ); @@ -233,7 +233,10 @@ var ReactMultiChild = { return nextChildren; } } - nextChildren = flattenChildren(nextNestedChildrenElements, selfDebugID); + nextChildren = flattenStackChildren( + nextNestedChildrenElements, + selfDebugID, + ); ReactChildReconciler.updateChildren( prevChildren, nextChildren, diff --git a/src/renderers/shared/stack/reconciler/ReactRef.js b/src/renderers/shared/stack/reconciler/ReactRef.js index cae62c717b..89abe98df7 100644 --- a/src/renderers/shared/stack/reconciler/ReactRef.js +++ b/src/renderers/shared/stack/reconciler/ReactRef.js @@ -21,7 +21,7 @@ var ReactRef = {}; if (__DEV__) { var ReactCompositeComponentTypes = require('ReactCompositeComponentTypes'); - var ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); + var {ReactComponentTreeHook} = require('ReactGlobalSharedState'); var warning = require('fbjs/lib/warning'); var warnedAboutStatelessRefs = {}; diff --git a/src/renderers/shared/stack/reconciler/ReactUpdateQueue.js b/src/renderers/shared/stack/reconciler/ReactUpdateQueue.js index 20cbb87fbb..e34cfee15b 100644 --- a/src/renderers/shared/stack/reconciler/ReactUpdateQueue.js +++ b/src/renderers/shared/stack/reconciler/ReactUpdateQueue.js @@ -11,10 +11,10 @@ 'use strict'; -var ReactCurrentOwner = require('react/lib/ReactCurrentOwner'); var ReactInstanceMap = require('ReactInstanceMap'); var ReactInstrumentation = require('ReactInstrumentation'); var ReactUpdates = require('ReactUpdates'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); if (__DEV__) { var warning = require('fbjs/lib/warning'); diff --git a/src/renderers/shared/stack/reconciler/flattenStackChildren.js b/src/renderers/shared/stack/reconciler/flattenStackChildren.js new file mode 100644 index 0000000000..4abb79e78f --- /dev/null +++ b/src/renderers/shared/stack/reconciler/flattenStackChildren.js @@ -0,0 +1,103 @@ +/** + * 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 flattenStackChildren + * @flow + */ + +'use strict'; + +var KeyEscapeUtils = require('KeyEscapeUtils'); +var traverseStackChildren = require('traverseStackChildren'); +var warning = require('fbjs/lib/warning'); + +var ReactComponentTreeHook; + +if ( + typeof process !== 'undefined' && + process.env && + process.env.NODE_ENV === 'test' +) { + // Temporary hack. + // Inline requires don't work well with Jest: + // https://github.com/facebook/react/issues/7240 + // Remove the inline requires when we don't need them anymore: + // https://github.com/facebook/react/pull/7178 + ReactComponentTreeHook = require('ReactGlobalSharedState').ReactComponentTreeHook; +} + +/** + * @param {function} traverseContext Context passed through traversal. + * @param {?ReactComponent} child React child component. + * @param {!string} name String name of key path to child. + * @param {number=} selfDebugID Optional debugID of the current internal instance. + */ +function flattenSingleChildIntoContext( + traverseContext: mixed, + child: ReactElement, + name: string, + selfDebugID?: number, +): void { + // We found a component instance. + if (traverseContext && typeof traverseContext === 'object') { + const result = traverseContext; + const keyUnique = result[name] === undefined; + if (__DEV__) { + if (!ReactComponentTreeHook) { + ReactComponentTreeHook = require('ReactGlobalSharedState').ReactComponentTreeHook; + } + if (!keyUnique) { + warning( + false, + 'flattenChildren(...): Encountered two children with the same key, ' + + '`%s`. Child keys must be unique; when two children share a key, only ' + + 'the first child will be used.%s', + KeyEscapeUtils.unescape(name), + ReactComponentTreeHook.getStackAddendumByID(selfDebugID), + ); + } + } + if (keyUnique && child != null) { + result[name] = child; + } + } +} + +/** + * Flattens children that are typically specified as `props.children`. Any null + * children will not be included in the resulting object. + * @return {!object} flattened children keyed by name. + */ +function flattenStackChildren( + children: ReactElement, + selfDebugID?: number, +): ?{[name: string]: ReactElement} { + if (children == null) { + return children; + } + var result = {}; + + if (__DEV__) { + traverseStackChildren( + children, + (traverseContext, child, name) => + flattenSingleChildIntoContext( + traverseContext, + child, + name, + selfDebugID, + ), + result, + ); + } else { + traverseStackChildren(children, flattenSingleChildIntoContext, result); + } + return result; +} + +module.exports = flattenStackChildren; diff --git a/src/renderers/shared/stack/reconciler/traverseStackChildren.js b/src/renderers/shared/stack/reconciler/traverseStackChildren.js new file mode 100644 index 0000000000..b717ea28fb --- /dev/null +++ b/src/renderers/shared/stack/reconciler/traverseStackChildren.js @@ -0,0 +1,201 @@ +/** + * 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 traverseStackChildren + */ + +'use strict'; + +var REACT_ELEMENT_TYPE = require('ReactElementSymbol'); +var {ReactCurrentOwner} = require('ReactGlobalSharedState'); + +var getIteratorFn = require('getIteratorFn'); +var invariant = require('fbjs/lib/invariant'); +var KeyEscapeUtils = require('KeyEscapeUtils'); +var warning = require('fbjs/lib/warning'); + +var SEPARATOR = '.'; +var SUBSEPARATOR = ':'; + +/** + * This is inlined from ReactElement since this file is shared between + * isomorphic and renderers. We could extract this to a + * + */ + +/** + * TODO: Test that a single child and an array with one item have the same key + * pattern. + */ + +var didWarnAboutMaps = false; + +/** + * Generate a key string that identifies a component within a set. + * + * @param {*} component A component that could contain a manual key. + * @param {number} index Index that is used if a manual key is not provided. + * @return {string} + */ +function getComponentKey(component, index) { + // Do some typechecking here since we call this blindly. We want to ensure + // that we don't block potential future ES APIs. + if (component && typeof component === 'object' && component.key != null) { + // Explicit key + return KeyEscapeUtils.escape(component.key); + } + // Implicit key determined by the index in the set + return index.toString(36); +} + +/** + * @param {?*} children Children tree container. + * @param {!string} nameSoFar Name of the key path so far. + * @param {!function} callback Callback to invoke with each child found. + * @param {?*} traverseContext Used to pass information throughout the traversal + * process. + * @return {!number} The number of children in this subtree. + */ +function traverseStackChildrenImpl( + children, + nameSoFar, + callback, + traverseContext, +) { + var type = typeof children; + + if (type === 'undefined' || type === 'boolean') { + // All of the above are perceived as null. + children = null; + } + + if ( + children === null || + type === 'string' || + type === 'number' || + // The following is inlined from ReactElement. This means we can optimize + // some checks. React Fiber also inlines this logic for similar purposes. + (type === 'object' && children.$$typeof === REACT_ELEMENT_TYPE) + ) { + callback( + traverseContext, + children, + // If it's the only child, treat the name as if it was wrapped in an array + // so that it's consistent if the number of children grows. + nameSoFar === '' ? SEPARATOR + getComponentKey(children, 0) : nameSoFar, + ); + return 1; + } + + var child; + var nextName; + var subtreeCount = 0; // Count of children found in the current subtree. + var nextNamePrefix = nameSoFar === '' ? SEPARATOR : nameSoFar + SUBSEPARATOR; + + if (Array.isArray(children)) { + for (var i = 0; i < children.length; i++) { + child = children[i]; + nextName = nextNamePrefix + getComponentKey(child, i); + subtreeCount += traverseStackChildrenImpl( + child, + nextName, + callback, + traverseContext, + ); + } + } else { + var iteratorFn = getIteratorFn(children); + if (iteratorFn) { + if (__DEV__) { + // Warn about using Maps as children + if (iteratorFn === children.entries) { + let mapsAsChildrenAddendum = ''; + if (ReactCurrentOwner.current) { + var mapsAsChildrenOwnerName = ReactCurrentOwner.current.getName(); + if (mapsAsChildrenOwnerName) { + mapsAsChildrenAddendum = '\n\nCheck the render method of `' + + mapsAsChildrenOwnerName + + '`.'; + } + } + warning( + didWarnAboutMaps, + 'Using Maps as children is unsupported and will likely yield ' + + 'unexpected results. Convert it to a sequence/iterable of keyed ' + + 'ReactElements instead.%s', + mapsAsChildrenAddendum, + ); + didWarnAboutMaps = true; + } + } + + var iterator = iteratorFn.call(children); + var step; + var ii = 0; + while (!(step = iterator.next()).done) { + child = step.value; + nextName = nextNamePrefix + getComponentKey(child, ii++); + subtreeCount += traverseStackChildrenImpl( + child, + nextName, + callback, + traverseContext, + ); + } + } else if (type === 'object') { + var addendum = ''; + if (__DEV__) { + addendum = ' If you meant to render a collection of children, use an array ' + + 'instead.'; + if (ReactCurrentOwner.current) { + var name = ReactCurrentOwner.current.getName(); + if (name) { + addendum += '\n\nCheck the render method of `' + name + '`.'; + } + } + } + var childrenString = '' + children; + invariant( + false, + 'Objects are not valid as a React child (found: %s).%s', + childrenString === '[object Object]' + ? 'object with keys {' + Object.keys(children).join(', ') + '}' + : childrenString, + addendum, + ); + } + } + + return subtreeCount; +} + +/** + * Traverses children that are typically specified as `props.children`, but + * might also be specified through attributes: + * + * - `traverseStackChildren(this.props.children, ...)` + * - `traverseStackChildren(this.props.leftPanelChildren, ...)` + * + * The `traverseContext` is an optional argument that is passed through the + * entire traversal. It can be used to store accumulations or anything else that + * the callback might find relevant. + * + * @param {?*} children Children tree object. + * @param {!function} callback To invoke upon traversing each child. + * @param {?*} traverseContext Context for traversal. + * @return {!number} The number of children in this subtree. + */ +function traverseStackChildren(children, callback, traverseContext) { + if (children == null) { + return 0; + } + + return traverseStackChildrenImpl(children, '', callback, traverseContext); +} + +module.exports = traverseStackChildren; diff --git a/src/test/ReactComponentTreeTestUtils.js b/src/test/ReactComponentTreeTestUtils.js index 91f4e36b8a..10dca25e19 100644 --- a/src/test/ReactComponentTreeTestUtils.js +++ b/src/test/ReactComponentTreeTestUtils.js @@ -11,7 +11,7 @@ 'use strict'; -var ReactComponentTreeHook = require('react/lib/ReactComponentTreeHook'); +var ReactComponentTreeHook = require('ReactComponentTreeHook'); function getRootDisplayNames() { return ReactComponentTreeHook.getRootIDs().map( diff --git a/src/test/ReactTestUtils.js b/src/test/ReactTestUtils.js index d3190de877..d0ca2fe406 100644 --- a/src/test/ReactTestUtils.js +++ b/src/test/ReactTestUtils.js @@ -21,7 +21,7 @@ var ReactDOM = require('react-dom'); var ReactDOMComponentTree = require('ReactDOMComponentTree'); var ReactBrowserEventEmitter = require('ReactBrowserEventEmitter'); var ReactFiberTreeReflection = require('ReactFiberTreeReflection'); -var ReactInstanceMap = require('react-dom/lib/ReactInstanceMap'); +var ReactInstanceMap = require('ReactInstanceMap'); var ReactTypeOfWork = require('ReactTypeOfWork'); var ReactGenericBatching = require('ReactGenericBatching'); var SyntheticEvent = require('SyntheticEvent'); diff --git a/src/umd/ReactDOMServerUMDEntry.js b/src/umd/ReactDOMServerUMDEntry.js deleted file mode 100644 index 7a55540e2b..0000000000 --- a/src/umd/ReactDOMServerUMDEntry.js +++ /dev/null @@ -1,16 +0,0 @@ -/** - * 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 ReactDOMServerUMDEntry - */ - -'use strict'; - -var ReactDOMServer = require('ReactDOMServer'); - -module.exports = ReactDOMServer; diff --git a/src/umd/ReactDOMUMDEntry.js b/src/umd/ReactDOMUMDEntry.js deleted file mode 100644 index 1749f30acc..0000000000 --- a/src/umd/ReactDOMUMDEntry.js +++ /dev/null @@ -1,23 +0,0 @@ -/** - * 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 ReactDOMUMDEntry - */ - -'use strict'; - -var ReactDOM = require('ReactDOMFiber'); - -var ReactDOMUMDEntry = Object.assign(ReactDOM, { - __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { - // For TapEventPlugin which is popular in open source - EventPluginHub: require('EventPluginHub'), - }, -}); - -module.exports = ReactDOMUMDEntry; diff --git a/src/umd/ReactUMDEntry.js b/src/umd/ReactUMDEntry.js deleted file mode 100644 index 1ab1076c80..0000000000 --- a/src/umd/ReactUMDEntry.js +++ /dev/null @@ -1,37 +0,0 @@ -/** - * 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 ReactUMDEntry - */ - -'use strict'; - -var React = require('React'); - -// `version` will be added here by the React module. -var ReactUMDEntry = Object.assign( - { - __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: { - ReactCurrentOwner: require('react/lib/ReactCurrentOwner'), - }, - }, - React, -); - -if (__DEV__) { - Object.assign( - ReactUMDEntry.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, - { - // These should not be included in production. - ReactComponentTreeHook: require('react/lib/ReactComponentTreeHook'), - ReactDebugCurrentFrame: require('react/lib/ReactDebugCurrentFrame'), - }, - ); -} - -module.exports = ReactUMDEntry; diff --git a/src/umd/shims/ReactComponentTreeHookUMDShim.js b/src/umd/shims/ReactComponentTreeHookUMDShim.js deleted file mode 100644 index 82a5cf6e15..0000000000 --- a/src/umd/shims/ReactComponentTreeHookUMDShim.js +++ /dev/null @@ -1,18 +0,0 @@ -/** - * 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 ReactComponentTreeHookUMDShim - */ - -/* globals React */ - -'use strict'; - -var ReactInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; - -module.exports = ReactInternals.ReactComponentTreeHook; diff --git a/src/umd/shims/ReactCurrentOwnerUMDShim.js b/src/umd/shims/ReactCurrentOwnerUMDShim.js deleted file mode 100644 index 79ef232b54..0000000000 --- a/src/umd/shims/ReactCurrentOwnerUMDShim.js +++ /dev/null @@ -1,18 +0,0 @@ -/** - * 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 ReactCurrentOwnerUMDShim - */ - -/* globals React */ - -'use strict'; - -var ReactInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; - -module.exports = ReactInternals.ReactCurrentOwner; diff --git a/src/umd/shims/ReactUMDShim.js b/src/umd/shims/ReactUMDShim.js deleted file mode 100644 index 84ae35c475..0000000000 --- a/src/umd/shims/ReactUMDShim.js +++ /dev/null @@ -1,16 +0,0 @@ -/** - * 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 ReactUMDShim - */ - -/* globals React */ - -'use strict'; - -module.exports = React;