{"body":"This will be used to add optimizations for static server rendering.","files":[{"status":"A","path":"packages\/react-dom\/npm\/static.browser.js"},{"status":"A","path":"packages\/react-dom\/npm\/static.js"},{"status":"A","path":"packages\/react-dom\/npm\/static.node.js"},{"status":"M","path":"packages\/react-dom\/package.json"},{"status":"A","path":"packages\/react-dom\/src\/__tests__\/ReactDOMFizzStatic-test.js"},{"status":"A","path":"packages\/react-dom\/src\/__tests__\/ReactDOMFizzStaticBrowser-test.js"},{"status":"A","path":"packages\/react-dom\/src\/__tests__\/ReactDOMFizzStaticNode-test.js"},{"status":"A","path":"packages\/react-dom\/src\/server\/ReactDOMFizzStaticBrowser.js"},{"status":"A","path":"packages\/react-dom\/src\/server\/ReactDOMFizzStaticNode.js"},{"status":"A","path":"packages\/react-dom\/static.browser.js"},{"status":"A","path":"packages\/react-dom\/static.js"},{"status":"A","path":"packages\/react-dom\/static.node.js"},{"status":"M","path":"scripts\/rollup\/bundles.js"},{"status":"M","path":"scripts\/rollup\/modules.js"},{"status":"M","path":"scripts\/rollup\/packaging.js"},{"status":"M","path":"scripts\/shared\/inlinedHostConfigs.js"}],"parents":["f796fa13ad13ee9939cb7847bfa90ada860068b2"],"patch":"diff --git a\/packages\/react-dom\/npm\/static.browser.js b\/packages\/react-dom\/npm\/static.browser.js\nnew file mode 100644\nindex 0000000000..7212cd1f6a\n--- \/dev\/null\n+++ b\/packages\/react-dom\/npm\/static.browser.js\n@@ -0,0 +1,7 @@\n+'use strict';\n+\n+if (process.env.NODE_ENV === 'production') {\n+ module.exports = require('.\/cjs\/react-dom-static.browser.production.min.js');\n+} else {\n+ module.exports = require('.\/cjs\/react-dom-static.browser.development.js');\n+}\ndiff --git a\/packages\/react-dom\/npm\/static.js b\/packages\/react-dom\/npm\/static.js\nnew file mode 100644\nindex 0000000000..2e39a9b183\n--- \/dev\/null\n+++ b\/packages\/react-dom\/npm\/static.js\n@@ -0,0 +1,3 @@\n+'use strict';\n+\n+module.exports = require('.\/static.node');\ndiff --git a\/packages\/react-dom\/npm\/static.node.js b\/packages\/react-dom\/npm\/static.node.js\nnew file mode 100644\nindex 0000000000..266e8c9116\n--- \/dev\/null\n+++ b\/packages\/react-dom\/npm\/static.node.js\n@@ -0,0 +1,7 @@\n+'use strict';\n+\n+if (process.env.NODE_ENV === 'production') {\n+ module.exports = require('.\/cjs\/react-dom-static.node.production.min.js');\n+} else {\n+ module.exports = require('.\/cjs\/react-dom-static.node.development.js');\n+}\ndiff --git a\/packages\/react-dom\/package.json b\/packages\/react-dom\/package.json\nindex 86993240c7..ca84673501 100644\n--- a\/packages\/react-dom\/package.json\n+++ b\/packages\/react-dom\/package.json\n@@ -32,6 +32,9 @@\n \"server.js\",\n \"server.browser.js\",\n \"server.node.js\",\n+ \"static.js\",\n+ \"static.browser.js\",\n+ \"static.node.js\",\n \"test-utils.js\",\n \"unstable_testing.js\",\n \"cjs\/\",\n@@ -48,6 +51,14 @@\n },\n \".\/server.browser\": \".\/server.browser.js\",\n \".\/server.node\": \".\/server.node.js\",\n+ \".\/static\": {\n+ \"deno\": \".\/static.browser.js\",\n+ \"worker\": \".\/static.browser.js\",\n+ \"browser\": \".\/static.browser.js\",\n+ \"default\": \".\/static.node.js\"\n+ },\n+ \".\/static.browser\": \".\/static.browser.js\",\n+ \".\/static.node\": \".\/static.node.js\",\n \".\/profiling\": \".\/profiling.js\",\n \".\/test-utils\": \".\/test-utils.js\",\n \".\/unstable_testing\": \".\/unstable_testing.js\",\n@@ -55,7 +66,8 @@\n \".\/package.json\": \".\/package.json\"\n },\n \"browser\": {\n- \".\/server.js\": \".\/server.browser.js\"\n+ \".\/server.js\": \".\/server.browser.js\",\n+ \".\/static.js\": \".\/static.browser.js\"\n },\n \"browserify\": {\n \"transform\": [\ndiff --git a\/packages\/react-dom\/src\/__tests__\/ReactDOMFizzStatic-test.js b\/packages\/react-dom\/src\/__tests__\/ReactDOMFizzStatic-test.js\nnew file mode 100644\nindex 0000000000..b4d0158f9a\n--- \/dev\/null\n+++ b\/packages\/react-dom\/src\/__tests__\/ReactDOMFizzStatic-test.js\n@@ -0,0 +1,237 @@\n+\/**\n+ * Copyright (c) Facebook, Inc. and its affiliates.\n+ *\n+ * This source code is licensed under the MIT license found in the\n+ * LICENSE file in the root directory of this source tree.\n+ *\n+ * @emails react-core\n+ *\/\n+\n+'use strict';\n+\n+let JSDOM;\n+let Stream;\n+let React;\n+let ReactDOMClient;\n+let ReactDOMFizzStatic;\n+let Suspense;\n+let textCache;\n+let document;\n+let writable;\n+let container;\n+let buffer = '';\n+let hasErrored = false;\n+let fatalError = undefined;\n+\n+describe('ReactDOMFizzStatic', () => {\n+ beforeEach(() => {\n+ jest.resetModules();\n+ JSDOM = require('jsdom').JSDOM;\n+ React = require('react');\n+ ReactDOMClient = require('react-dom\/client');\n+ if (__EXPERIMENTAL__) {\n+ ReactDOMFizzStatic = require('react-dom\/static');\n+ }\n+ Stream = require('stream');\n+ Suspense = React.Suspense;\n+\n+ textCache = new Map();\n+\n+ \/\/ Test Environment\n+ const jsdom = new JSDOM(\n+ '<\/head>

',\n+ {\n+ runScripts: 'dangerously',\n+ },\n+ );\n+ document = jsdom.window.document;\n+ container = document.getElementById('container');\n+\n+ buffer = '';\n+ hasErrored = false;\n+\n+ writable = new Stream.PassThrough();\n+ writable.setEncoding('utf8');\n+ writable.on('data', chunk => {\n+ buffer += chunk;\n+ });\n+ writable.on('error', error => {\n+ hasErrored = true;\n+ fatalError = error;\n+ });\n+ });\n+\n+ async function act(callback) {\n+ await callback();\n+ \/\/ Await one turn around the event loop.\n+ \/\/ This assumes that we'll flush everything we have so far.\n+ await new Promise(resolve => {\n+ setImmediate(resolve);\n+ });\n+ if (hasErrored) {\n+ throw fatalError;\n+ }\n+ \/\/ JSDOM doesn't support stream HTML parser so we need to give it a proper fragment.\n+ \/\/ We also want to execute any scripts that are embedded.\n+ \/\/ We assume that we have now received a proper fragment of HTML.\n+ const bufferedContent = buffer;\n+ buffer = '';\n+ const fakeBody = document.createElement('body');\n+ fakeBody.innerHTML = bufferedContent;\n+ while (fakeBody.firstChild) {\n+ const node = fakeBody.firstChild;\n+ if (node.nodeName === 'SCRIPT') {\n+ const script = document.createElement('script');\n+ script.textContent = node.textContent;\n+ fakeBody.removeChild(node);\n+ container.appendChild(script);\n+ } else {\n+ container.appendChild(node);\n+ }\n+ }\n+ }\n+\n+ function getVisibleChildren(element) {\n+ const children = [];\n+ let node = element.firstChild;\n+ while (node) {\n+ if (node.nodeType === 1) {\n+ if (\n+ node.tagName !== 'SCRIPT' &&\n+ node.tagName !== 'TEMPLATE' &&\n+ node.tagName !== 'template' &&\n+ !node.hasAttribute('hidden') &&\n+ !node.hasAttribute('aria-hidden')\n+ ) {\n+ const props = {};\n+ const attributes = node.attributes;\n+ for (let i = 0; i < attributes.length; i++) {\n+ if (\n+ attributes[i].name === 'id' &&\n+ attributes[i].value.includes(':')\n+ ) {\n+ \/\/ We assume this is a React added ID that's a non-visual implementation detail.\n+ continue;\n+ }\n+ props[attributes[i].name] = attributes[i].value;\n+ }\n+ props.children = getVisibleChildren(node);\n+ children.push(React.createElement(node.tagName.toLowerCase(), props));\n+ }\n+ } else if (node.nodeType === 3) {\n+ children.push(node.data);\n+ }\n+ node = node.nextSibling;\n+ }\n+ return children.length === 0\n+ ? undefined\n+ : children.length === 1\n+ ? children[0]\n+ : children;\n+ }\n+\n+ function resolveText(text) {\n+ const record = textCache.get(text);\n+ if (record === undefined) {\n+ const newRecord = {\n+ status: 'resolved',\n+ value: text,\n+ };\n+ textCache.set(text, newRecord);\n+ } else if (record.status === 'pending') {\n+ const thenable = record.value;\n+ record.status = 'resolved';\n+ record.value = text;\n+ thenable.pings.forEach(t => t());\n+ }\n+ }\n+\n+ \/*\n+ function rejectText(text, error) {\n+ const record = textCache.get(text);\n+ if (record === undefined) {\n+ const newRecord = {\n+ status: 'rejected',\n+ value: error,\n+ };\n+ textCache.set(text, newRecord);\n+ } else if (record.status === 'pending') {\n+ const thenable = record.value;\n+ record.status = 'rejected';\n+ record.value = error;\n+ thenable.pings.forEach(t => t());\n+ }\n+ }\n+ *\/\n+\n+ function readText(text) {\n+ const record = textCache.get(text);\n+ if (record !== undefined) {\n+ switch (record.status) {\n+ case 'pending':\n+ throw record.value;\n+ case 'rejected':\n+ throw record.value;\n+ case 'resolved':\n+ return record.value;\n+ }\n+ } else {\n+ const thenable = {\n+ pings: [],\n+ then(resolve) {\n+ if (newRecord.status === 'pending') {\n+ thenable.pings.push(resolve);\n+ } else {\n+ Promise.resolve().then(() => resolve(newRecord.value));\n+ }\n+ },\n+ };\n+\n+ const newRecord = {\n+ status: 'pending',\n+ value: thenable,\n+ };\n+ textCache.set(text, newRecord);\n+\n+ throw thenable;\n+ }\n+ }\n+\n+ function Text({text}) {\n+ return text;\n+ }\n+\n+ function AsyncText({text}) {\n+ return readText(text);\n+ }\n+\n+ \/\/ @gate experimental\n+ it('should render a fully static document, send it and then hydrate it', async () => {\n+ function App() {\n+ return (\n+

\n+ }>\n+ \n+ <\/Suspense>\n+ <\/div>\n+ );\n+ }\n+\n+ const promise = ReactDOMFizzStatic.prerenderToNodeStreams();\n+\n+ resolveText('Hello');\n+\n+ const result = await promise;\n+\n+ await act(async () => {\n+ result.prelude.pipe(writable);\n+ });\n+ expect(getVisibleChildren(container)).toEqual(

Hello<\/div>);\n+\n+ await act(async () => {\n+ ReactDOMClient.hydrateRoot(container, );\n+ });\n+\n+ expect(getVisibleChildren(container)).toEqual(

Hello<\/div>);\n+ });\n+});\ndiff --git a\/packages\/react-dom\/src\/__tests__\/ReactDOMFizzStaticBrowser-test.js b\/packages\/react-dom\/src\/__tests__\/ReactDOMFizzStaticBrowser-test.js\nnew file mode 100644\nindex 0000000000..bd180ae7ce\n--- \/dev\/null\n+++ b\/packages\/react-dom\/src\/__tests__\/ReactDOMFizzStaticBrowser-test.js\n@@ -0,0 +1,412 @@\n+\/**\n+ * Copyright (c) Facebook, Inc. and its affiliates.\n+ *\n+ * This source code is licensed under the MIT license found in the\n+ * LICENSE file in the root directory of this source tree.\n+ *\n+ * @emails react-core\n+ *\/\n+\n+'use strict';\n+\n+\/\/ Polyfills for test environment\n+global.ReadableStream = require('web-streams-polyfill\/ponyfill\/es6').ReadableStream;\n+global.TextEncoder = require('util').TextEncoder;\n+\n+let React;\n+let ReactDOMFizzStatic;\n+let Suspense;\n+\n+describe('ReactDOMFizzStaticBrowser', () => {\n+ beforeEach(() => {\n+ jest.resetModules();\n+ React = require('react');\n+ if (__EXPERIMENTAL__) {\n+ ReactDOMFizzStatic = require('react-dom\/static.browser');\n+ }\n+ Suspense = React.Suspense;\n+ });\n+\n+ const theError = new Error('This is an error');\n+ function Throw() {\n+ throw theError;\n+ }\n+ const theInfinitePromise = new Promise(() => {});\n+ function InfiniteSuspend() {\n+ throw theInfinitePromise;\n+ }\n+\n+ async function readContent(stream) {\n+ const reader = stream.getReader();\n+ let content = '';\n+ while (true) {\n+ const {done, value} = await reader.read();\n+ if (done) {\n+ return content;\n+ }\n+ content += Buffer.from(value).toString('utf8');\n+ }\n+ }\n+\n+ \/\/ @gate experimental\n+ it('should call prerender', async () => {\n+ const result = await ReactDOMFizzStatic.prerender(

hello world<\/div>);\n+ const prelude = await readContent(result.prelude);\n+ expect(prelude).toMatchInlineSnapshot(`\"

hello world<\/div>\"`);\n+ });\n+\n+ \/\/ @gate experimental\n+ it('should emit DOCTYPE at the root of the document', async () => {\n+ const result = await ReactDOMFizzStatic.prerender(\n+ \n+ hello world<\/body>\n+ <\/html>,\n+ );\n+ const prelude = await readContent(result.prelude);\n+ expect(prelude).toMatchInlineSnapshot(\n+ `\"hello world<\/body><\/html>\"`,\n+ );\n+ });\n+\n+ \/\/ @gate experimental\n+ it('should emit bootstrap script src at the end', async () => {\n+ const result = await ReactDOMFizzStatic.prerender(

hello world<\/div>, {\n+ bootstrapScriptContent: 'INIT();',\n+ bootstrapScripts: ['init.js'],\n+ bootstrapModules: ['init.mjs'],\n+ });\n+ const prelude = await readContent(result.prelude);\n+ expect(prelude).toMatchInlineSnapshot(\n+ `\"

hello world<\/div>

dillon1000/react

Files changed