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 a9010f0d0db35..fc221c5a5809c 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 03f897a1972e4..e6b1904a468d0 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 ea610c1fd6d44..9d4a85e8cc540 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 f8866b76e6f1d..0000000000000 --- 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 bcdc4d8787409..0000000000000 --- 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 3e5579b86c5af..0000000000000 --- 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 7545c5ce3feec..754febaf3637a 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 c019d38c00424..188b9c71248ca 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 e4d70b5d5994a..ac3fe41e622d9 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 4e03036be26e8..5e57605f1c0fc 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 21a5da7140abb..c6caa802bea29 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 dd8b49fb58006..a68d1816d68ab 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 0decdcd72fa88..2182aabf38c95 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 2de9bff4eff77..dd7be7d7014ce 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 7259ec57b2a6b..7a7be1a0d1926 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 b787fa13f575d..81fc2683eb0c8 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 7957266e6d70c..f01b3193d0fdb 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 758fb51af04bf..202a101f1c8dc 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 23a189f0c5c43..f5f976ea7d4aa 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 be4d800a7dfaa..80598dfb69079 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 ea1ef8d0f423d..35aa38518dd29 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 fb89d76220a66..6ada3db767a02 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 92e2cf2c197d4..6b722b48641af 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 c603e4ca76865..86b28f92e24c0 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 93c21c84a2d91..9cbc2c91e44ed 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 68ec7e503da84..10008836ff70c 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 b5ad9efeb9e1b..7be3d38fe73fb 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 0000000000000..b9107b435857e --- /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 f56c80e1b9e7b..ac6eab0138dfe 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 ad58d044613f2..3787e98be02d9 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 67f37d1776162..e60fdd850eb16 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 520b1c895435b..80ff10825e531 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 1cd0dea6ed743..b527587c45ee9 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 7c9a13bfd064a..b0eedb0af9544 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 d2217db557af9..6649dffaf64b5 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 19fd366a38e61..8bde4e26ffffa 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 cae62c717b26f..89abe98df736f 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 20cbb87fbbe40..e34cfee15b960 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 0000000000000..4abb79e78f054 --- /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 0000000000000..b717ea28fbc02 --- /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 91f4e36b8a2e2..10dca25e19b6b 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 d3190de877359..d0ca2fe4063e0 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 7a55540e2b729..0000000000000 --- 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 1749f30acc484..0000000000000 --- 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 1ab1076c8069b..0000000000000 --- 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 82a5cf6e15215..0000000000000 --- 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 79ef232b54b07..0000000000000 --- 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 84ae35c47505b..0000000000000 --- 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;