[Flight] Rename react-transport-... packages to react-server-... (#20403

) * Move files * Update paths * Rename import variables * Rename /server to /writer This is mainly because "React Server Server" is weird so we need another dimension. * Use "react-server" convention to enforce that writer is only loaded in a server
facebook · Dec 8, 2020 · 5fd9db7 · 5fd9db7
1 parent ce40f1d
commit 5fd9db7
Show file tree

Hide file tree

Showing 76 changed files with 154 additions and 147 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -185,14 +185,14 @@ module.exports = {
     {
       files: [
         'packages/react-native-renderer/**/*.js',
-        'packages/react-transport-native-relay/**/*.js',
+        'packages/react-server-native-relay/**/*.js',
       ],
       globals: {
         nativeFabricUIManager: true,
       },
     },
     {
-      files: ['packages/react-transport-dom-webpack/**/*.js'],
+      files: ['packages/react-server-dom-webpack/**/*.js'],
       globals: {
         __webpack_chunk_load__: true,
         __webpack_require__: true,

diff --git a/fixtures/flight-browser/index.html b/fixtures/flight-browser/index.html
@@ -19,8 +19,8 @@ <h1>Flight Example</h1>
     <script src="../../build/node_modules/react/umd/react.development.js"></script>
     <script src="../../build/node_modules/react-dom/umd/react-dom.development.js"></script>
     <script src="../../build/node_modules/react-dom/umd/react-dom-server.browser.development.js"></script>
-    <script src="../../build/node_modules/react-transport-dom-webpack/umd/react-transport-dom-webpack-server.browser.development.js"></script>
-    <script src="../../build/node_modules/react-transport-dom-webpack/umd/react-transport-dom-webpack.development.js"></script>
+    <script src="../../build/node_modules/react-server-dom-webpack/umd/react-server-dom-webpack-writer.browser.server.development.js"></script>
+    <script src="../../build/node_modules/react-server-dom-webpack/umd/react-server-dom-webpack.development.js"></script>
     <script src="https://unpkg.com/babel-standalone@6/babel.js"></script>
     <script type="text/babel">
       let Suspense = React.Suspense;
@@ -60,7 +60,7 @@ <h1>Flight Example</h1>
         content: <HTML />,
       };
 
-      let stream = ReactTransportDOMServer.renderToReadableStream(model);
+      let stream = ReactServerDOMWriter.renderToReadableStream(model);
       let response = new Response(stream, {
         headers: {'Content-Type': 'text/html'},
       });
@@ -70,13 +70,13 @@ <h1>Flight Example</h1>
         let blob = await responseToDisplay.blob();
         let url = URL.createObjectURL(blob);
 
-        let data = ReactTransportDOMClient.createFromFetch(
+        let data = ReactServerDOMReader.createFromFetch(
           fetch(url)
         );
         // The client also supports XHR streaming.
         // var xhr = new XMLHttpRequest();
         // xhr.open('GET', url);
-        // let data = ReactTransportDOMClient.createFromXHR(xhr);
+        // let data = ReactServerDOMReader.createFromXHR(xhr);
         // xhr.send();
 
         renderResult(data);

diff --git a/fixtures/flight/config/webpack.config.js b/fixtures/flight/config/webpack.config.js
@@ -1,7 +1,7 @@
 'use strict';
 
 // Fork Start
-const ReactFlightWebpackPlugin = require('react-transport-dom-webpack/plugin');
+const ReactFlightWebpackPlugin = require('react-server-dom-webpack/plugin');
 // Fork End
 
 const fs = require('fs');

diff --git a/fixtures/flight/loader/index.js b/fixtures/flight/loader/index.js
@@ -2,7 +2,7 @@ import {
   resolve,
   getSource,
   transformSource as reactTransformSource,
-} from 'react-transport-dom-webpack/node-loader';
+} from 'react-server-dom-webpack/node-loader';
 
 export {resolve, getSource};
 

diff --git a/fixtures/flight/server/cli.server.js b/fixtures/flight/server/cli.server.js
@@ -1,6 +1,6 @@
 'use strict';
 
-const register = require('react-transport-dom-webpack/node-register');
+const register = require('react-server-dom-webpack/node-register');
 register();
 
 const babelRegister = require('@babel/register');

diff --git a/fixtures/flight/server/handler.server.js b/fixtures/flight/server/handler.server.js
@@ -1,6 +1,6 @@
 'use strict';
 
-const {pipeToNodeWritable} = require('react-transport-dom-webpack/server');
+const {pipeToNodeWritable} = require('react-server-dom-webpack/writer');
 const {readFile} = require('fs');
 const {resolve} = require('path');
 const React = require('react');

diff --git a/fixtures/flight/src/index.js b/fixtures/flight/src/index.js
@@ -1,11 +1,9 @@
 import * as React from 'react';
 import {Suspense} from 'react';
 import ReactDOM from 'react-dom';
-import ReactTransportDOMClient from 'react-transport-dom-webpack';
+import ReactServerDOMReader from 'react-server-dom-webpack';
 
-let data = ReactTransportDOMClient.createFromFetch(
-  fetch('http://localhost:3001')
-);
+let data = ReactServerDOMReader.createFromFetch(fetch('http://localhost:3001'));
 
 function Content() {
   return data.readRoot();

diff --git a/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-browser.js b/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-browser.js
@@ -9,4 +9,4 @@
 
 export * from 'react-client/src/ReactFlightClientHostConfigBrowser';
 export * from 'react-client/src/ReactFlightClientHostConfigStream';
-export * from 'react-transport-dom-webpack/src/ReactFlightClientWebpackBundlerConfig';
+export * from 'react-server-dom-webpack/src/ReactFlightClientWebpackBundlerConfig';
diff --git a/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-relay.js b/packages/react-client/src/forks/ReactFlightClientHostConfig.dom-relay.js
@@ -7,5 +7,5 @@
  * @flow
  */
 
-export * from 'react-transport-dom-relay/src/ReactFlightDOMRelayClientHostConfig';
+export * from 'react-server-dom-relay/src/ReactFlightDOMRelayClientHostConfig';
 export * from '../ReactFlightClientHostConfigNoStream';
diff --git a/packages/react-client/src/forks/ReactFlightClientHostConfig.dom.js b/packages/react-client/src/forks/ReactFlightClientHostConfig.dom.js
@@ -9,4 +9,4 @@
 
 export * from 'react-client/src/ReactFlightClientHostConfigBrowser';
 export * from 'react-client/src/ReactFlightClientHostConfigStream';
-export * from 'react-transport-dom-webpack/src/ReactFlightClientWebpackBundlerConfig';
+export * from 'react-server-dom-webpack/src/ReactFlightClientWebpackBundlerConfig';
diff --git a/packages/react-client/src/forks/ReactFlightClientHostConfig.native-relay.js b/packages/react-client/src/forks/ReactFlightClientHostConfig.native-relay.js
@@ -7,5 +7,5 @@
  * @flow
  */
 
-export * from 'react-transport-native-relay/src/ReactFlightNativeRelayClientHostConfig';
+export * from 'react-server-native-relay/src/ReactFlightNativeRelayClientHostConfig';
 export * from '../ReactFlightClientHostConfigNoStream';
diff --git a/packages/react-transport-dom-relay/index.js → packages/react-server-dom-relay/index.js b/packages/react-transport-dom-relay/index.js → packages/react-server-dom-relay/index.js
diff --git a/...es/react-transport-dom-relay/package.json → packages/react-server-dom-relay/package.json b/...es/react-transport-dom-relay/package.json → packages/react-server-dom-relay/package.json
@@ -1,11 +1,11 @@
 {
-  "name": "react-transport-dom-relay",
+  "name": "react-server-dom-relay",
   "version": "0.1.0",
   "private": true,
   "repository": {
     "type" : "git",
     "url" : "https://github.com/facebook/react.git",
-    "directory": "packages/react-transport-dom-relay"
+    "directory": "packages/react-server-dom-relay"
   },
   "dependencies": {
     "object-assign": "^4.1.1",

diff --git a/packages/react-transport-dom-relay/server.js → packages/react-server-dom-relay/server.js b/packages/react-transport-dom-relay/server.js → packages/react-server-dom-relay/server.js
diff --git a/...om-relay/src/ReactFlightDOMRelayClient.js → ...om-relay/src/ReactFlightDOMRelayClient.js b/...om-relay/src/ReactFlightDOMRelayClient.js → ...om-relay/src/ReactFlightDOMRelayClient.js
diff --git a/...rc/ReactFlightDOMRelayClientHostConfig.js → ...rc/ReactFlightDOMRelayClientHostConfig.js b/...rc/ReactFlightDOMRelayClientHostConfig.js → ...rc/ReactFlightDOMRelayClientHostConfig.js
diff --git a/...-relay/src/ReactFlightDOMRelayProtocol.js → ...-relay/src/ReactFlightDOMRelayProtocol.js b/...-relay/src/ReactFlightDOMRelayProtocol.js → ...-relay/src/ReactFlightDOMRelayProtocol.js
diff --git a/...om-relay/src/ReactFlightDOMRelayServer.js → ...om-relay/src/ReactFlightDOMRelayServer.js b/...om-relay/src/ReactFlightDOMRelayServer.js → ...om-relay/src/ReactFlightDOMRelayServer.js
diff --git a/...rc/ReactFlightDOMRelayServerHostConfig.js → ...rc/ReactFlightDOMRelayServerHostConfig.js b/...rc/ReactFlightDOMRelayServerHostConfig.js → ...rc/ReactFlightDOMRelayServerHostConfig.js
diff --git a/...elay/src/__mocks__/JSResourceReference.js → ...elay/src/__mocks__/JSResourceReference.js b/...elay/src/__mocks__/JSResourceReference.js → ...elay/src/__mocks__/JSResourceReference.js
diff --git a/..._/ReactFlightDOMRelayClientIntegration.js → ..._/ReactFlightDOMRelayClientIntegration.js b/..._/ReactFlightDOMRelayClientIntegration.js → ..._/ReactFlightDOMRelayClientIntegration.js
diff --git a/..._/ReactFlightDOMRelayServerIntegration.js → ..._/ReactFlightDOMRelayServerIntegration.js b/..._/ReactFlightDOMRelayServerIntegration.js → ..._/ReactFlightDOMRelayServerIntegration.js
diff --git a/...ts__/ReactFlightDOMRelay-test.internal.js → ...ts__/ReactFlightDOMRelay-test.internal.js b/...ts__/ReactFlightDOMRelay-test.internal.js → ...ts__/ReactFlightDOMRelay-test.internal.js
@@ -21,8 +21,8 @@ describe('ReactFlightDOMRelay', () => {
     act = require('react-dom/test-utils').unstable_concurrentAct;
     React = require('react');
     ReactDOM = require('react-dom');
-    ReactDOMFlightRelayServer = require('react-transport-dom-relay/server');
-    ReactDOMFlightRelayClient = require('react-transport-dom-relay');
+    ReactDOMFlightRelayServer = require('react-server-dom-relay/server');
+    ReactDOMFlightRelayClient = require('react-server-dom-relay');
     JSResourceReference = require('JSResourceReference');
   });
 

diff --git a/...ges/react-transport-dom-webpack/README.md → packages/react-server-dom-webpack/README.md b/...ges/react-transport-dom-webpack/README.md → packages/react-server-dom-webpack/README.md
@@ -1,4 +1,4 @@
-# react-transport-dom-webpack
+# react-server-dom-webpack
 
 Experimental React Flight bindings for DOM using Webpack.
 

diff --git a/...ct-transport-dom-webpack/esm/package.json → ...react-server-dom-webpack/esm/package.json b/...ct-transport-dom-webpack/esm/package.json → ...react-server-dom-webpack/esm/package.json
diff --git a/...eact-transport-dom-webpack-node-loader.js → ...m/react-server-dom-webpack-node-loader.js b/...eact-transport-dom-webpack-node-loader.js → ...m/react-server-dom-webpack-node-loader.js
diff --git a/...ages/react-transport-dom-webpack/index.js → packages/react-server-dom-webpack/index.js b/...ages/react-transport-dom-webpack/index.js → packages/react-server-dom-webpack/index.js
diff --git a/...ct-transport-dom-webpack/node-register.js → ...react-server-dom-webpack/node-register.js b/...ct-transport-dom-webpack/node-register.js → ...react-server-dom-webpack/node-register.js
diff --git a/...ransport-dom-webpack/npm/esm/package.json → ...t-server-dom-webpack/npm/esm/package.json b/...ransport-dom-webpack/npm/esm/package.json → ...t-server-dom-webpack/npm/esm/package.json
diff --git a/packages/react-server-dom-webpack/npm/index.js b/packages/react-server-dom-webpack/npm/index.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-server-dom-webpack.production.min.js');
+} else {
+  module.exports = require('./cjs/react-server-dom-webpack.development.js');
+}
diff --git a/packages/react-server-dom-webpack/npm/node-register.js b/packages/react-server-dom-webpack/npm/node-register.js
@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = require('./cjs/react-server-dom-webpack-node-register.js');
diff --git a/packages/react-server-dom-webpack/npm/plugin.js b/packages/react-server-dom-webpack/npm/plugin.js
@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = require('./cjs/react-server-dom-webpack-plugin.js');
diff --git a/packages/react-server-dom-webpack/npm/writer.browser.server.js b/packages/react-server-dom-webpack/npm/writer.browser.server.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-server-dom-webpack-writer.browser.server.production.min.js');
+} else {
+  module.exports = require('./cjs/react-server-dom-webpack-writer.browser.server.development.js');
+}
diff --git a/packages/react-server-dom-webpack/npm/writer.js b/packages/react-server-dom-webpack/npm/writer.js
@@ -0,0 +1,6 @@
+'use strict';
+
+throw new Error(
+  'The React Server Writer cannot be used outside a react-server environment. ' +
+    'You must configure Node.js using the `--conditions react-server` flag.'
+);
diff --git a/packages/react-server-dom-webpack/npm/writer.node.server.js b/packages/react-server-dom-webpack/npm/writer.node.server.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-server-dom-webpack-writer.node.server.production.min.js');
+} else {
+  module.exports = require('./cjs/react-server-dom-webpack-writer.node.server.development.js');
+}
diff --git a/.../react-transport-dom-webpack/package.json → ...ges/react-server-dom-webpack/package.json b/.../react-transport-dom-webpack/package.json → ...ges/react-server-dom-webpack/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "react-transport-dom-webpack",
-  "description": "React Transport bindings for DOM using Webpack. This is intended to be integrated into meta-frameworks. It is not intended to be imported directly.",
+  "name": "react-server-dom-webpack",
+  "description": "React Server Components bindings for DOM using Webpack. This is intended to be integrated into meta-frameworks. It is not intended to be imported directly.",
   "version": "0.1.0",
   "private": true,
   "keywords": [
@@ -14,9 +14,9 @@
     "README.md",
     "index.js",
     "plugin.js",
-    "server.js",
-    "server.browser.js",
-    "server.node.js",
+    "writer.js",
+    "writer.browser.server.js",
+    "writer.node.server.js",
     "node-register.js",
     "cjs/",
     "umd/",
@@ -25,21 +25,27 @@
   "exports": {
     ".": "./index.js",
     "./plugin": "./plugin.js",
-    "./server": "./server.js",
-    "./server.browser": "./server.browser.js",
-    "./server.node": "./server.node.js",
-    "./node-loader": "./esm/react-transport-dom-webpack-node-loader.js",
+    "./writer": {
+      "react-server": {
+        "node": "./writer.node.server.js",
+        "browser": "./writer.browser.server.js"
+      },
+      "default": "./writer.js"
+    },
+    "./writer.node.server": "./writer.node.server.js",
+    "./writer.browser.server": "./writer.browser.server.js",
+    "./node-loader": "./esm/react-server-dom-webpack-node-loader.js",
     "./node-register": "./node-register.js",
     "./package.json": "./package.json"
   },
   "browser": {
-    "./server.js": "./server.browser.js"
+    "./writer.js": "./writer.browser.server.js"
   },
   "main": "index.js",
   "repository": {
     "type" : "git",
     "url" : "https://github.com/facebook/react.git",
-    "directory": "packages/react-transport-dom-webpack"
+    "directory": "packages/react-server-dom-webpack"
   },
   "engines": {
     "node": ">=0.10.0"

diff --git a/...ges/react-transport-dom-webpack/plugin.js → packages/react-server-dom-webpack/plugin.js b/...ges/react-transport-dom-webpack/plugin.js → packages/react-server-dom-webpack/plugin.js
diff --git a/.../ReactFlightClientWebpackBundlerConfig.js → .../ReactFlightClientWebpackBundlerConfig.js b/.../ReactFlightClientWebpackBundlerConfig.js → .../ReactFlightClientWebpackBundlerConfig.js
diff --git a/...t-dom-webpack/src/ReactFlightDOMClient.js → ...r-dom-webpack/src/ReactFlightDOMClient.js b/...t-dom-webpack/src/ReactFlightDOMClient.js → ...r-dom-webpack/src/ReactFlightDOMClient.js
diff --git a/...ebpack/src/ReactFlightDOMServerBrowser.js → ...ebpack/src/ReactFlightDOMServerBrowser.js b/...ebpack/src/ReactFlightDOMServerBrowser.js → ...ebpack/src/ReactFlightDOMServerBrowser.js
diff --git a/...m-webpack/src/ReactFlightDOMServerNode.js → ...m-webpack/src/ReactFlightDOMServerNode.js b/...m-webpack/src/ReactFlightDOMServerNode.js → ...m-webpack/src/ReactFlightDOMServerNode.js
diff --git a/.../ReactFlightServerWebpackBundlerConfig.js → .../ReactFlightServerWebpackBundlerConfig.js b/.../ReactFlightServerWebpackBundlerConfig.js → .../ReactFlightServerWebpackBundlerConfig.js
diff --git a/...bpack/src/ReactFlightWebpackNodeLoader.js → ...bpack/src/ReactFlightWebpackNodeLoader.js b/...bpack/src/ReactFlightWebpackNodeLoader.js → ...bpack/src/ReactFlightWebpackNodeLoader.js
diff --git a/...ack/src/ReactFlightWebpackNodeRegister.js → ...ack/src/ReactFlightWebpackNodeRegister.js b/...ack/src/ReactFlightWebpackNodeRegister.js → ...ack/src/ReactFlightWebpackNodeRegister.js
diff --git a/...m-webpack/src/ReactFlightWebpackPlugin.js → ...m-webpack/src/ReactFlightWebpackPlugin.js b/...m-webpack/src/ReactFlightWebpackPlugin.js → ...m-webpack/src/ReactFlightWebpackPlugin.js
@@ -50,7 +50,7 @@ type Options = {
   manifestFilename?: string,
 };
 
-const PLUGIN_NAME = 'React Transport Plugin';
+const PLUGIN_NAME = 'React Server Plugin';
 
 export default class ReactFlightWebpackPlugin {
   clientReferences: $ReadOnlyArray<ClientReferencePath>;

diff --git a/...pack/src/__tests__/ReactFlightDOM-test.js → ...pack/src/__tests__/ReactFlightDOM-test.js b/...pack/src/__tests__/ReactFlightDOM-test.js → ...pack/src/__tests__/ReactFlightDOM-test.js
@@ -28,8 +28,8 @@ let act;
 let Stream;
 let React;
 let ReactDOM;
-let ReactTransportDOMServer;
-let ReactTransportDOMClient;
+let ReactServerDOMWriter;
+let ReactServerDOMReader;
 
 describe('ReactFlightDOM', () => {
   beforeEach(() => {
@@ -40,8 +40,8 @@ describe('ReactFlightDOM', () => {
     Stream = require('stream');
     React = require('react');
     ReactDOM = require('react-dom');
-    ReactTransportDOMServer = require('react-transport-dom-webpack/server');
-    ReactTransportDOMClient = require('react-transport-dom-webpack');
+    ReactServerDOMWriter = require('react-server-dom-webpack/writer.node.server');
+    ReactServerDOMReader = require('react-server-dom-webpack');
   });
 
   function getTestStream() {
@@ -113,8 +113,8 @@ describe('ReactFlightDOM', () => {
     }
 
     const {writable, readable} = getTestStream();
-    ReactTransportDOMServer.pipeToNodeWritable(<App />, writable, webpackMap);
-    const response = ReactTransportDOMClient.createFromReadableStream(readable);
+    ReactServerDOMWriter.pipeToNodeWritable(<App />, writable, webpackMap);
+    const response = ReactServerDOMReader.createFromReadableStream(readable);
     await waitForSuspense(() => {
       const model = response.readRoot();
       expect(model).toEqual({
@@ -163,12 +163,12 @@ describe('ReactFlightDOM', () => {
     }
 
     const {writable, readable} = getTestStream();
-    ReactTransportDOMServer.pipeToNodeWritable(
+    ReactServerDOMWriter.pipeToNodeWritable(
       <RootModel />,
       writable,
       webpackMap,
     );
-    const response = ReactTransportDOMClient.createFromReadableStream(readable);
+    const response = ReactServerDOMReader.createFromReadableStream(readable);
 
     const container = document.createElement('div');
     const root = ReactDOM.unstable_createRoot(container);
@@ -202,12 +202,12 @@ describe('ReactFlightDOM', () => {
     }
 
     const {writable, readable} = getTestStream();
-    ReactTransportDOMServer.pipeToNodeWritable(
+    ReactServerDOMWriter.pipeToNodeWritable(
       <RootModel />,
       writable,
       webpackMap,
     );
-    const response = ReactTransportDOMClient.createFromReadableStream(readable);
+    const response = ReactServerDOMReader.createFromReadableStream(readable);
 
     const container = document.createElement('div');
     const root = ReactDOM.unstable_createRoot(container);
@@ -239,12 +239,12 @@ describe('ReactFlightDOM', () => {
     }
 
     const {writable, readable} = getTestStream();
-    ReactTransportDOMServer.pipeToNodeWritable(
+    ReactServerDOMWriter.pipeToNodeWritable(
       <RootModel />,
       writable,
       webpackMap,
     );
-    const response = ReactTransportDOMClient.createFromReadableStream(readable);
+    const response = ReactServerDOMReader.createFromReadableStream(readable);
 
     const container = document.createElement('div');
     const root = ReactDOM.unstable_createRoot(container);
@@ -374,8 +374,8 @@ describe('ReactFlightDOM', () => {
     }
 
     const {writable, readable} = getTestStream();
-    ReactTransportDOMServer.pipeToNodeWritable(model, writable, webpackMap);
-    const response = ReactTransportDOMClient.createFromReadableStream(readable);
+    ReactServerDOMWriter.pipeToNodeWritable(model, writable, webpackMap);
+    const response = ReactServerDOMReader.createFromReadableStream(readable);
 
     const container = document.createElement('div');
     const root = ReactDOM.unstable_createRoot(container);
@@ -473,12 +473,12 @@ describe('ReactFlightDOM', () => {
     const root = ReactDOM.unstable_createRoot(container);
 
     const stream1 = getTestStream();
-    ReactTransportDOMServer.pipeToNodeWritable(
+    ReactServerDOMWriter.pipeToNodeWritable(
       <App color="red" />,
       stream1.writable,
       webpackMap,
     );
-    const response1 = ReactTransportDOMClient.createFromReadableStream(
+    const response1 = ReactServerDOMReader.createFromReadableStream(
       stream1.readable,
     );
     await act(async () => {
@@ -501,12 +501,12 @@ describe('ReactFlightDOM', () => {
     inputB.value = 'goodbye';
 
     const stream2 = getTestStream();
-    ReactTransportDOMServer.pipeToNodeWritable(
+    ReactServerDOMWriter.pipeToNodeWritable(
       <App color="blue" />,
       stream2.writable,
       webpackMap,
     );
-    const response2 = ReactTransportDOMClient.createFromReadableStream(
+    const response2 = ReactServerDOMReader.createFromReadableStream(
       stream2.readable,
     );
     await act(async () => {