From 5ff5700625e8a1b340a0d01ff9c88afb07e00bf6 Mon Sep 17 00:00:00 2001 From: Brandon Dail Date: Sun, 13 Aug 2017 13:16:13 -0500 Subject: [PATCH] Add explicit invariant when ReactDOM is loaded w/o React (#10449) --- scripts/rollup/results.json | 92 +++++++++---------- src/renderers/dom/ReactDOMStackEntry.js | 1 + src/renderers/dom/fiber/ReactDOMFiberEntry.js | 1 + .../dom/fiber/__tests__/ReactDOMFiber-test.js | 9 ++ src/renderers/dom/shared/checkReact.js | 20 ++++ 5 files changed, 77 insertions(+), 46 deletions(-) create mode 100644 src/renderers/dom/shared/checkReact.js diff --git a/scripts/rollup/results.json b/scripts/rollup/results.json index a58eb9c30dcc0..5351fb4aab535 100644 --- a/scripts/rollup/results.json +++ b/scripts/rollup/results.json @@ -1,8 +1,8 @@ { "bundleSizes": { "react.development.js (UMD_DEV)": { - "size": 65905, - "gzip": 16729 + "size": 65990, + "gzip": 16792 }, "react.production.min.js (UMD_PROD)": { "size": 6359, @@ -25,40 +25,40 @@ "gzip": 6703 }, "react-dom.development.js (UMD_DEV)": { - "size": 635283, - "gzip": 144613 + "size": 635358, + "gzip": 144868 }, "react-dom.production.min.js (UMD_PROD)": { - "size": 108379, - "gzip": 33966 + "size": 108806, + "gzip": 34152 }, "react-dom.development.js (NODE_DEV)": { - "size": 594095, - "gzip": 135122 + "size": 594767, + "gzip": 135242 }, "react-dom.production.min.js (NODE_PROD)": { - "size": 112397, - "gzip": 35476 + "size": 112503, + "gzip": 35538 }, "ReactDOMFiber-dev.js (FB_DEV)": { - "size": 590915, - "gzip": 134583 + "size": 591587, + "gzip": 134688 }, "ReactDOMFiber-prod.js (FB_PROD)": { - "size": 424931, - "gzip": 95294 + "size": 425507, + "gzip": 95372 }, "react-dom-test-utils.development.js (NODE_DEV)": { - "size": 53359, - "gzip": 13402 + "size": 53332, + "gzip": 13396 }, "ReactTestUtils-dev.js (FB_DEV)": { - "size": 53151, - "gzip": 13364 + "size": 53124, + "gzip": 13357 }, "react-dom-unstable-native-dependencies.development.js (UMD_DEV)": { - "size": 88196, - "gzip": 22328 + "size": 88285, + "gzip": 22345 }, "react-dom-unstable-native-dependencies.production.min.js (UMD_PROD)": { "size": 15149, @@ -81,84 +81,84 @@ "gzip": 15736 }, "react-dom-server.browser.development.js (UMD_DEV)": { - "size": 124076, - "gzip": 31288 + "size": 123203, + "gzip": 31145 }, "react-dom-server.browser.production.min.js (UMD_PROD)": { "size": 19874, "gzip": 7592 }, "react-dom-server.browser.development.js (NODE_DEV)": { - "size": 92358, - "gzip": 23695 + "size": 92379, + "gzip": 23736 }, "react-dom-server.browser.production.min.js (NODE_PROD)": { "size": 18930, "gzip": 7264 }, "ReactDOMServer-dev.js (FB_DEV)": { - "size": 91551, - "gzip": 23617 + "size": 91572, + "gzip": 23660 }, "ReactDOMServer-prod.js (FB_PROD)": { "size": 49652, "gzip": 13866 }, "react-dom-server.node.development.js (NODE_DEV)": { - "size": 95135, - "gzip": 24258 + "size": 95156, + "gzip": 24301 }, "react-dom-server.node.production.min.js (NODE_PROD)": { "size": 19986, "gzip": 7613 }, "react-art.development.js (UMD_DEV)": { - "size": 307891, - "gzip": 66652 + "size": 373742, + "gzip": 82778 }, "react-art.production.min.js (UMD_PROD)": { - "size": 47498, - "gzip": 14839 + "size": 83498, + "gzip": 25838 }, "react-art.development.js (NODE_DEV)": { - "size": 295222, - "gzip": 62807 + "size": 295131, + "gzip": 62776 }, "react-art.production.min.js (NODE_PROD)": { "size": 52520, "gzip": 16419 }, "ReactARTFiber-dev.js (FB_DEV)": { - "size": 294163, - "gzip": 62866 + "size": 294072, + "gzip": 62835 }, "ReactARTFiber-prod.js (FB_PROD)": { "size": 220269, "gzip": 45845 }, "ReactNativeStack-dev.js (RN_DEV)": { - "size": 201067, - "gzip": 37391 + "size": 201077, + "gzip": 37401 }, "ReactNativeStack-prod.js (RN_PROD)": { "size": 136715, "gzip": 26222 }, "ReactNativeFiber-dev.js (RN_DEV)": { - "size": 305992, - "gzip": 52996 + "size": 306002, + "gzip": 52993 }, "ReactNativeFiber-prod.js (RN_PROD)": { "size": 221418, "gzip": 38321 }, "react-test-renderer.development.js (NODE_DEV)": { - "size": 299690, - "gzip": 63255 + "size": 299567, + "gzip": 63217 }, "ReactTestRendererFiber-dev.js (FB_DEV)": { - "size": 298616, - "gzip": 63330 + "size": 298493, + "gzip": 63294 }, "react-test-renderer-shallow.development.js (NODE_DEV)": { "size": 9556, @@ -169,8 +169,8 @@ "gzip": 2338 }, "react-noop-renderer.development.js (NODE_DEV)": { - "size": 286933, - "gzip": 60117 + "size": 286842, + "gzip": 60085 }, "react-dom-server.development.js (UMD_DEV)": { "size": 120897, diff --git a/src/renderers/dom/ReactDOMStackEntry.js b/src/renderers/dom/ReactDOMStackEntry.js index 78d25d075598a..cd4b2540bf733 100644 --- a/src/renderers/dom/ReactDOMStackEntry.js +++ b/src/renderers/dom/ReactDOMStackEntry.js @@ -13,6 +13,7 @@ 'use strict'; +require('checkReact'); var ReactDOMComponentTree = require('ReactDOMComponentTree'); var ReactGenericBatching = require('ReactGenericBatching'); var ReactMount = require('ReactMount'); diff --git a/src/renderers/dom/fiber/ReactDOMFiberEntry.js b/src/renderers/dom/fiber/ReactDOMFiberEntry.js index b9af1b9ea4e99..faa1271136abb 100644 --- a/src/renderers/dom/fiber/ReactDOMFiberEntry.js +++ b/src/renderers/dom/fiber/ReactDOMFiberEntry.js @@ -15,6 +15,7 @@ import type {Fiber} from 'ReactFiber'; import type {ReactNodeList} from 'ReactTypes'; +require('checkReact'); var ExecutionEnvironment = require('fbjs/lib/ExecutionEnvironment'); var ReactBrowserEventEmitter = require('ReactBrowserEventEmitter'); var ReactControlledComponent = require('ReactControlledComponent'); diff --git a/src/renderers/dom/fiber/__tests__/ReactDOMFiber-test.js b/src/renderers/dom/fiber/__tests__/ReactDOMFiber-test.js index 4a4fdbe808ffb..bde7371836adc 100644 --- a/src/renderers/dom/fiber/__tests__/ReactDOMFiber-test.js +++ b/src/renderers/dom/fiber/__tests__/ReactDOMFiber-test.js @@ -1136,4 +1136,13 @@ describe('disableNewFiberFeatures', () => { ReactDOM.render(, container); expect(container.textContent).toEqual(''); }); + + it('throws if the React package cannot be loaded', () => { + jest.resetModules(); + jest.mock('react', () => undefined); + expect(() => require('react-dom')).toThrow( + 'ReactDOM was loaded before React.', + ); + jest.resetModules(); + }); }); diff --git a/src/renderers/dom/shared/checkReact.js b/src/renderers/dom/shared/checkReact.js new file mode 100644 index 0000000000000..a8d73cd5bc86f --- /dev/null +++ b/src/renderers/dom/shared/checkReact.js @@ -0,0 +1,20 @@ +/** + * 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 checkReact + * @flow + */ + +var React = require('react'); +var invariant = require('fbjs/lib/invariant'); + +invariant( + React, + 'ReactDOM was loaded before React. Make sure you load ' + + 'the React package before loading ReactDOM.', +);