Skip to content

Commit

Permalink
[Flight] Rename react-transport-... packages to react-server-... (#20403
Browse files Browse the repository at this point in the history
)

* 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
  • Loading branch information
sebmarkbage authored Dec 8, 2020
1 parent ce40f1d commit 5fd9db7
Show file tree
Hide file tree
Showing 76 changed files with 154 additions and 147 deletions.
4 changes: 2 additions & 2 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down
10 changes: 5 additions & 5 deletions fixtures/flight-browser/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -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'},
});
Expand All @@ -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);
Expand Down
2 changes: 1 addition & 1 deletion fixtures/flight/config/webpack.config.js
Original file line number Diff line number Diff line change
@@ -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');
Expand Down
2 changes: 1 addition & 1 deletion fixtures/flight/loader/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -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};

Expand Down
2 changes: 1 addition & 1 deletion fixtures/flight/server/cli.server.js
Original file line number Diff line number Diff line change
@@ -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');
Expand Down
2 changes: 1 addition & 1 deletion fixtures/flight/server/handler.server.js
Original file line number Diff line number Diff line change
@@ -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');
Expand Down
6 changes: 2 additions & 4 deletions fixtures/flight/src/index.js
Original file line number Diff line number Diff line change
@@ -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();
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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';
Original file line number Diff line number Diff line change
Expand Up @@ -7,5 +7,5 @@
* @flow
*/

export * from 'react-transport-dom-relay/src/ReactFlightDOMRelayClientHostConfig';
export * from 'react-server-dom-relay/src/ReactFlightDOMRelayClientHostConfig';
export * from '../ReactFlightClientHostConfigNoStream';
Original file line number Diff line number Diff line change
Expand Up @@ -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';
Original file line number Diff line number Diff line change
Expand Up @@ -7,5 +7,5 @@
* @flow
*/

export * from 'react-transport-native-relay/src/ReactFlightNativeRelayClientHostConfig';
export * from 'react-server-native-relay/src/ReactFlightNativeRelayClientHostConfig';
export * from '../ReactFlightClientHostConfigNoStream';
File renamed without changes.
Original file line number Diff line number Diff line change
@@ -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",
Expand Down
File renamed without changes.
Original file line number Diff line number Diff line change
Expand Up @@ -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');
});

Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# react-transport-dom-webpack
# react-server-dom-webpack

Experimental React Flight bindings for DOM using Webpack.

Expand Down
File renamed without changes.
7 changes: 7 additions & 0 deletions packages/react-server-dom-webpack/npm/index.js
Original file line number Diff line number Diff line change
@@ -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');
}
3 changes: 3 additions & 0 deletions packages/react-server-dom-webpack/npm/node-register.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
'use strict';

module.exports = require('./cjs/react-server-dom-webpack-node-register.js');
3 changes: 3 additions & 0 deletions packages/react-server-dom-webpack/npm/plugin.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
'use strict';

module.exports = require('./cjs/react-server-dom-webpack-plugin.js');
Original file line number Diff line number Diff line change
@@ -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');
}
6 changes: 6 additions & 0 deletions packages/react-server-dom-webpack/npm/writer.js
Original file line number Diff line number Diff line change
@@ -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.'
);
7 changes: 7 additions & 0 deletions packages/react-server-dom-webpack/npm/writer.node.server.js
Original file line number Diff line number Diff line change
@@ -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');
}
Original file line number Diff line number Diff line change
@@ -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": [
Expand All @@ -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/",
Expand All @@ -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"
Expand Down
File renamed without changes.
Original file line number Diff line number Diff line change
Expand Up @@ -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>;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,8 @@ let act;
let Stream;
let React;
let ReactDOM;
let ReactTransportDOMServer;
let ReactTransportDOMClient;
let ReactServerDOMWriter;
let ReactServerDOMReader;

describe('ReactFlightDOM', () => {
beforeEach(() => {
Expand All @@ -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() {
Expand Down Expand Up @@ -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({
Expand Down Expand Up @@ -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);
Expand Down Expand Up @@ -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);
Expand Down Expand Up @@ -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);
Expand Down Expand Up @@ -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);
Expand Down Expand Up @@ -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 () => {
Expand All @@ -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 () => {
Expand Down
Loading

0 comments on commit 5fd9db7

Please sign in to comment.