@samitouri / QOS-React / commits / c771016e19

Rename The Secret Export of Server Internals (#28786)

We have a different set of dispatchers that Flight uses. This also includes the `jsx-runtime` which must also be aliased to use the right version. To ensure the right versions are used together we rename the export of the SharedInternals from 'react' and alias it in relevant bundles.

Sebastian Markbåge committed Apr 8, 2024 at 22:34 UTC c771016e19384e4b6e42e1c275bdf03fe51c2907

8 files changed +62 -5

packages/react-client/src/__tests__/ReactFlight-test.js

+4 -2

@@ -57,8 +57,8 @@ describe('ReactFlight', () => {

57 ReactNoopFlightServer = require('react-noop-renderer/flight-server');

58 // This stores the state so we need to preserve it

59 const flightModules = require('react-noop-renderer/flight-modules');

60 - __unmockReact();

60 jest.resetModules();

61 + __unmockReact();

62 jest.mock('react-noop-renderer/flight-modules', () => flightModules);

63 React = require('react');

64 startTransition = React.startTransition;

@@ -2161,7 +2161,9 @@ describe('ReactFlight', () => {

2161 jest.mock('react', () => require('react/react.react-server'));

2162 ReactServer = require('react');

2163 ReactNoopFlightServer = require('react-noop-renderer/flight-server');

2164 - transport = ReactNoopFlightServer.render({root: <ServerComponent />});

2164 + transport = ReactNoopFlightServer.render({

2165 + root: ReactServer.createElement(ServerComponent),

2166 + });

2167 }).toErrorDev('err');

2168

2169 expect(mockConsoleLog).toHaveBeenCalledTimes(1);

packages/react-reconciler/src/__tests__/ReactCache-test.js

@@ -25,6 +25,9 @@ describe('ReactCache', () => {

25 ReactNoopFlightClient = require('react-noop-renderer/flight-client');

27 cache = React.cache;

28 +

29 + jest.resetModules();

30 + __unmockReact();

31 });

33 // @gate enableCache

packages/react-server-dom-webpack/src/__tests__/ReactFlightDOMReply-test.js

@@ -35,6 +35,7 @@ describe('ReactFlightDOMReply', () => {

35 React = require('react');

36 ReactServerDOMServer = require('react-server-dom-webpack/server.browser');

37 jest.resetModules();

38 + __unmockReact();

39 ReactServerDOMClient = require('react-server-dom-webpack/client');

40 });

packages/react-server/src/ReactSharedInternalsServer.js new

+24

@@ -0,0 +1,24 @@

1 +/**

2 + * Copyright (c) Meta Platforms, Inc. and affiliates.

3 + *

4 + * This source code is licensed under the MIT license found in the

5 + * LICENSE file in the root directory of this source tree.

6 + *

7 + * @flow

8 + */

9 +

10 +import * as React from 'react';

11 +

12 +const ReactSharedInternalsServer =

13 + // $FlowFixMe: It's defined in the one we resolve to.

14 + React.__SECRET_SERVER_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;

15 +

16 +if (!ReactSharedInternalsServer) {

17 + throw new Error(

18 + 'The "react" package in this environment is not configured correctly. ' +

19 + 'The "react-server" condition must be enabled in any environment that ' +

20 + 'runs React Server Components.',

21 + );

22 +}

23 +

24 +export default ReactSharedInternalsServer;

packages/react/src/ReactServer.experimental.js

+1 -1

@@ -10,7 +10,7 @@

10 // Patch fetch

11 import './ReactFetch';

13 -export {default as __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED} from './ReactSharedInternalsServer';

13 +export {default as __SECRET_SERVER_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED} from './ReactSharedInternalsServer';

15 import {forEach, map, count, toArray, only} from './ReactChildren';

16 import {

packages/react/src/ReactServer.js

+1 -1

@@ -10,7 +10,7 @@

10 // Patch fetch

11 import './ReactFetch';

13 -export {default as __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED} from './ReactSharedInternalsServer';

13 +export {default as __SECRET_SERVER_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED} from './ReactSharedInternalsServer';

15 import {forEach, map, count, toArray, only} from './ReactChildren';

16 import {

scripts/rollup/bundles.js

+22

@@ -98,6 +98,7 @@ const bundles = [

98 moduleType: ISOMORPHIC,

99 entry: 'react/src/ReactServer.js',

100 name: 'react.react-server',

101 + condition: 'react-server',

102 global: 'React',

103 minifyWithProdErrorCodes: true,

104 wrapWithModuleBoundaries: false,

@@ -109,6 +110,7 @@ const bundles = [

110 bundleTypes: __EXPERIMENTAL__ ? [FB_WWW_DEV, FB_WWW_PROD] : [],

111 moduleType: ISOMORPHIC,

112 entry: 'react/src/ReactServerFB.js',

113 + condition: 'react-server',

114 global: 'ReactServer',

115 minifyWithProdErrorCodes: true,

116 wrapWithModuleBoundaries: false,

@@ -140,6 +142,7 @@ const bundles = [

142 moduleType: ISOMORPHIC,

143 entry: 'react/src/jsx/ReactJSXServer.js',

144 name: 'react-jsx-runtime.react-server',

145 + condition: 'react-server',

146 global: 'JSXRuntime',

147 minifyWithProdErrorCodes: false,

148 wrapWithModuleBoundaries: false,

@@ -194,6 +197,7 @@ const bundles = [

197 moduleType: RENDERER,

198 entry: 'react-dom/src/ReactDOMServer.js',

199 name: 'react-dom.react-server',

200 + condition: 'react-server',

201 global: 'ReactDOM',

202 minifyWithProdErrorCodes: false,

203 wrapWithModuleBoundaries: false,

@@ -289,6 +293,7 @@ const bundles = [

293 bundleTypes: __EXPERIMENTAL__ ? [FB_WWW_DEV, FB_WWW_PROD] : [],

294 moduleType: RENDERER,

295 entry: 'react-server-dom-fb/src/ReactDOMServerFB.js',

296 + condition: 'react-server',

297 global: 'ReactDOMServerStreaming',

298 minifyWithProdErrorCodes: false,

299 wrapWithModuleBoundaries: false,

@@ -350,6 +355,7 @@ const bundles = [

355 bundleTypes: [NODE_DEV, NODE_PROD, UMD_DEV, UMD_PROD],

356 moduleType: RENDERER,

357 entry: 'react-server-dom-webpack/server.browser',

358 + condition: 'react-server',

359 global: 'ReactServerDOMServer',

360 minifyWithProdErrorCodes: false,

361 wrapWithModuleBoundaries: false,

@@ -359,6 +365,7 @@ const bundles = [

365 bundleTypes: [NODE_DEV, NODE_PROD],

366 moduleType: RENDERER,

367 entry: 'react-server-dom-webpack/server.node',

368 + condition: 'react-server',

369 global: 'ReactServerDOMServer',

370 minifyWithProdErrorCodes: false,

371 wrapWithModuleBoundaries: false,

@@ -368,6 +375,7 @@ const bundles = [

375 bundleTypes: [NODE_DEV, NODE_PROD],

376 moduleType: RENDERER,

377 entry: 'react-server-dom-webpack/server.node.unbundled',

378 + condition: 'react-server',

379 global: 'ReactServerDOMServer',

380 minifyWithProdErrorCodes: false,

381 wrapWithModuleBoundaries: false,

@@ -377,6 +385,7 @@ const bundles = [

385 bundleTypes: [NODE_DEV, NODE_PROD],

386 moduleType: RENDERER,

387 entry: 'react-server-dom-webpack/server.edge',

388 + condition: 'react-server',

389 global: 'ReactServerDOMServer',

390 minifyWithProdErrorCodes: false,

391 wrapWithModuleBoundaries: false,

@@ -437,6 +446,7 @@ const bundles = [

446 bundleTypes: [ESM_PROD],

447 moduleType: RENDERER_UTILS,

448 entry: 'react-server-dom-webpack/node-loader',

449 + condition: 'react-server',

450 global: 'ReactServerWebpackNodeLoader',

451 minifyWithProdErrorCodes: false,

452 wrapWithModuleBoundaries: false,

@@ -449,6 +459,7 @@ const bundles = [

459 moduleType: RENDERER_UTILS,

460 entry: 'react-server-dom-webpack/src/ReactFlightWebpackNodeRegister',

461 name: 'react-server-dom-webpack-node-register',

462 + condition: 'react-server',

463 global: 'ReactFlightWebpackNodeRegister',

464 minifyWithProdErrorCodes: false,

465 wrapWithModuleBoundaries: false,

@@ -460,6 +471,7 @@ const bundles = [

471 bundleTypes: [NODE_DEV, NODE_PROD, UMD_DEV, UMD_PROD],

472 moduleType: RENDERER,

473 entry: 'react-server-dom-turbopack/server.browser',

474 + condition: 'react-server',

475 global: 'ReactServerDOMServer',

476 minifyWithProdErrorCodes: false,

477 wrapWithModuleBoundaries: false,

@@ -469,6 +481,7 @@ const bundles = [

481 bundleTypes: [NODE_DEV, NODE_PROD],

482 moduleType: RENDERER,

483 entry: 'react-server-dom-turbopack/server.node',

484 + condition: 'react-server',

485 global: 'ReactServerDOMServer',

486 minifyWithProdErrorCodes: false,

487 wrapWithModuleBoundaries: false,

@@ -478,6 +491,7 @@ const bundles = [

491 bundleTypes: [NODE_DEV, NODE_PROD],

492 moduleType: RENDERER,

493 entry: 'react-server-dom-turbopack/server.node.unbundled',

494 + condition: 'react-server',

495 global: 'ReactServerDOMServer',

496 minifyWithProdErrorCodes: false,

497 wrapWithModuleBoundaries: false,

@@ -487,6 +501,7 @@ const bundles = [

501 bundleTypes: [NODE_DEV, NODE_PROD],

502 moduleType: RENDERER,

503 entry: 'react-server-dom-turbopack/server.edge',

504 + condition: 'react-server',

505 global: 'ReactServerDOMServer',

506 minifyWithProdErrorCodes: false,

507 wrapWithModuleBoundaries: false,

@@ -540,6 +555,7 @@ const bundles = [

555 bundleTypes: [ESM_PROD],

556 moduleType: RENDERER_UTILS,

557 entry: 'react-server-dom-turbopack/node-loader',

558 + condition: 'react-server',

559 global: 'ReactServerTurbopackNodeLoader',

560 minifyWithProdErrorCodes: false,

561 wrapWithModuleBoundaries: false,

@@ -552,6 +568,7 @@ const bundles = [

568 moduleType: RENDERER_UTILS,

569 entry: 'react-server-dom-turbopack/src/ReactFlightTurbopackNodeRegister',

570 name: 'react-server-dom-turbopack-node-register',

571 + condition: 'react-server',

572 global: 'ReactFlightWebpackNodeRegister',

573 minifyWithProdErrorCodes: false,

574 wrapWithModuleBoundaries: false,

@@ -563,6 +580,7 @@ const bundles = [

580 bundleTypes: [NODE_DEV, NODE_PROD],

581 moduleType: RENDERER,

582 entry: 'react-server-dom-esm/server.node',

583 + condition: 'react-server',

584 minifyWithProdErrorCodes: false,

585 wrapWithModuleBoundaries: false,

586 externals: ['react', 'util', 'crypto', 'async_hooks', 'react-dom'],

@@ -591,6 +609,7 @@ const bundles = [

609 bundleTypes: [ESM_PROD],

610 moduleType: RENDERER_UTILS,

611 entry: 'react-server-dom-esm/node-loader',

612 + condition: 'react-server',

613 global: 'ReactServerESMNodeLoader',

614 minifyWithProdErrorCodes: false,

615 wrapWithModuleBoundaries: false,

@@ -602,6 +621,7 @@ const bundles = [

621 bundleTypes: __EXPERIMENTAL__ ? [FB_WWW_DEV, FB_WWW_PROD] : [],

622 moduleType: RENDERER,

623 entry: 'react-server-dom-fb/src/ReactFlightDOMServerFB.js',

624 + condition: 'react-server',

625 global: 'ReactFlightDOMServer',

626 minifyWithProdErrorCodes: false,

627 wrapWithModuleBoundaries: false,

@@ -796,6 +816,7 @@ const bundles = [

816 bundleTypes: [NODE_DEV, NODE_PROD],

817 moduleType: RENDERER,

818 entry: 'react-noop-renderer/flight-server',

819 + condition: 'react-server',

820 global: 'ReactNoopFlightServer',

821 minifyWithProdErrorCodes: false,

822 wrapWithModuleBoundaries: false,

@@ -850,6 +871,7 @@ const bundles = [

871 bundleTypes: [NODE_DEV, NODE_PROD],

872 moduleType: RECONCILER,

873 entry: 'react-server/flight',

874 + condition: 'react-server',

875 global: 'ReactFlightServer',

876 minifyWithProdErrorCodes: false,

877 wrapWithModuleBoundaries: false,

scripts/rollup/forks.js

+6 -1

@@ -58,7 +58,9 @@ const forks = Object.freeze({

58 './packages/shared/ReactSharedInternals.js': (

59 bundleType,

60 entry,

61 - dependencies

61 + dependencies,

62 + _moduleType,

63 + bundle

64 ) => {

65 if (entry === 'react') {

66 return './packages/react/src/ReactSharedInternalsClient.js';

@@ -69,6 +71,9 @@ const forks = Object.freeze({

71 ) {

72 return './packages/react/src/ReactSharedInternalsServer.js';

73 }

74 + if (bundle.condition === 'react-server') {

75 + return './packages/react-server/src/ReactSharedInternalsServer.js';

76 + }

77 if (!entry.startsWith('react/') && dependencies.indexOf('react') === -1) {

78 // React internals are unavailable if we can't reference the package.

79 // We return an error because we only want to throw if this module gets used.