Merge branch 'canary' into shu/19dc

vercel · Mar 30, 2022 · 5bf5da7 · 5bf5da7
2 parents 0c40739 + 2269f03
commit 5bf5da7
Show file tree

Hide file tree

Showing 24 changed files with 223 additions and 111 deletions.
diff --git a/docs/basic-features/script.md b/docs/basic-features/script.md
@@ -154,7 +154,7 @@ npm run dev
 # ...
 ```
 
-Once setup is complete, defining `strategy="worker` will automatically instantiate Partytown in your application and off-load the script to a web worker.
+Once setup is complete, defining `strategy="worker"` will automatically instantiate Partytown in your application and off-load the script to a web worker.
 
 ```jsx
 <Script src="https://example.com/analytics.js" strategy="worker" />

diff --git a/lerna.json b/lerna.json
@@ -16,5 +16,5 @@
       "registry": "https://registry.npmjs.org/"
     }
   },
-  "version": "12.1.3-canary.2"
+  "version": "12.1.3-canary.3"
 }
diff --git a/packages/create-next-app/package.json b/packages/create-next-app/package.json
@@ -1,6 +1,6 @@
 {
   "name": "create-next-app",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "keywords": [
     "react",
     "next",

diff --git a/packages/eslint-config-next/package.json b/packages/eslint-config-next/package.json
@@ -1,6 +1,6 @@
 {
   "name": "eslint-config-next",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "description": "ESLint configuration used by NextJS.",
   "main": "index.js",
   "license": "MIT",
@@ -9,7 +9,7 @@
     "directory": "packages/eslint-config-next"
   },
   "dependencies": {
-    "@next/eslint-plugin-next": "12.1.3-canary.2",
+    "@next/eslint-plugin-next": "12.1.3-canary.3",
     "@rushstack/eslint-patch": "1.0.8",
     "@typescript-eslint/parser": "5.10.1",
     "eslint-import-resolver-node": "0.3.4",

diff --git a/packages/eslint-plugin-next/package.json b/packages/eslint-plugin-next/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/eslint-plugin-next",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "description": "ESLint plugin for NextJS.",
   "main": "lib/index.js",
   "license": "MIT",

diff --git a/packages/next-bundle-analyzer/package.json b/packages/next-bundle-analyzer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/bundle-analyzer",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "main": "index.js",
   "license": "MIT",
   "repository": {

diff --git a/packages/next-codemod/package.json b/packages/next-codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/codemod",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "license": "MIT",
   "dependencies": {
     "chalk": "4.1.0",

diff --git a/packages/next-env/package.json b/packages/next-env/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/env",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "keywords": [
     "react",
     "next",

diff --git a/packages/next-mdx/package.json b/packages/next-mdx/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/mdx",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "main": "index.js",
   "license": "MIT",
   "repository": {

diff --git a/packages/next-plugin-storybook/package.json b/packages/next-plugin-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-storybook",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/next-plugin-storybook"

diff --git a/packages/next-polyfill-module/package.json b/packages/next-polyfill-module/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/polyfill-module",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "description": "A standard library polyfill for ES Modules supporting browsers (Edge 16+, Firefox 60+, Chrome 61+, Safari 10.1+)",
   "main": "dist/polyfill-module.js",
   "license": "MIT",

diff --git a/packages/next-polyfill-nomodule/package.json b/packages/next-polyfill-nomodule/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/polyfill-nomodule",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "description": "A polyfill for non-dead, nomodule browsers.",
   "main": "dist/polyfill-nomodule.js",
   "license": "MIT",

diff --git a/packages/next-swc/package.json b/packages/next-swc/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/swc",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "private": true,
   "scripts": {
     "build-native": "napi build --platform --cargo-name next_swc_napi native",

diff --git a/packages/next/client/next-dev.js b/packages/next/client/next-dev.js
@@ -87,7 +87,8 @@ initialize({ webpackHMR })
                       new URLSearchParams(location.search)
                     )
                   ),
-                router.asPath
+                router.asPath,
+                { scroll: false }
               )
               .finally(clearIndicator)
           }

diff --git a/packages/next/package.json b/packages/next/package.json
@@ -1,6 +1,6 @@
 {
   "name": "next",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "description": "The React Framework",
   "main": "./dist/server/next.js",
   "license": "MIT",
@@ -69,7 +69,7 @@
     ]
   },
   "dependencies": {
-    "@next/env": "12.1.3-canary.2",
+    "@next/env": "12.1.3-canary.3",
     "caniuse-lite": "^1.0.30001283",
     "postcss": "8.4.5",
     "styled-jsx": "5.0.1",
@@ -118,11 +118,11 @@
     "@hapi/accept": "5.0.2",
     "@napi-rs/cli": "2.4.4",
     "@napi-rs/triples": "1.1.0",
-    "@next/polyfill-module": "12.1.3-canary.2",
-    "@next/polyfill-nomodule": "12.1.3-canary.2",
-    "@next/react-dev-overlay": "12.1.3-canary.2",
-    "@next/react-refresh-utils": "12.1.3-canary.2",
-    "@next/swc": "12.1.3-canary.2",
+    "@next/polyfill-module": "12.1.3-canary.3",
+    "@next/polyfill-nomodule": "12.1.3-canary.3",
+    "@next/react-dev-overlay": "12.1.3-canary.3",
+    "@next/react-refresh-utils": "12.1.3-canary.3",
+    "@next/swc": "12.1.3-canary.3",
     "@peculiar/webcrypto": "1.3.1",
     "@taskr/clear": "1.1.0",
     "@taskr/esnext": "1.1.0",

diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx
@@ -1268,12 +1268,17 @@ export async function renderToHTML(
       }
     }
 
-    // We make it a function component to enable streaming.
-    if (hasConcurrentFeatures && builtinDocument) {
-      Document = builtinDocument
+    if ((isServerComponent || process.browser) && Document.getInitialProps) {
+      if (builtinDocument) {
+        Document = builtinDocument
+      } else {
+        throw new Error(
+          '`getInitialProps` in Document component is not supported with React Server Components.'
+        )
+      }
     }
 
-    if (!hasConcurrentFeatures && Document.getInitialProps) {
+    async function documentInitialProps() {
       const renderPage: RenderPage = (
         options: ComponentsEnhancer = {}
       ): RenderPageResult | Promise<RenderPageResult> => {
@@ -1323,96 +1328,130 @@ export async function renderToHTML(
         throw new Error(message)
       }
 
-      return {
-        bodyResult: (suffix: string) =>
-          streamFromArray([docProps.html, suffix]),
-        documentElement: (htmlProps: HtmlProps) => (
-          <Document {...htmlProps} {...docProps} />
-        ),
-        head: docProps.head,
-        headTags: await headTags(documentCtx),
-        styles: docProps.styles,
-      }
-    } else {
-      let bodyResult
-
-      const renderContent = () => {
-        return ctx.err && ErrorDebug ? (
-          <Body>
-            <ErrorDebug error={ctx.err} />
-          </Body>
-        ) : (
-          <Body>
-            <AppContainerWithIsomorphicFiberStructure>
-              {isServerComponent && AppMod.__next_rsc__ ? (
-                // _app.server.js is used.
-                <Component {...props.pageProps} router={router} />
-              ) : (
-                <App {...props} Component={Component} router={router} />
-              )}
-            </AppContainerWithIsomorphicFiberStructure>
-          </Body>
-        )
-      }
-
-      if (hasConcurrentFeatures) {
-        let renderStream: any
-
-        // We start rendering the shell earlier, before returning the head tags
-        // to `documentResult`.
-        const content = renderContent()
-        renderStream = await renderToInitialStream({
-          ReactDOMServer,
-          element: content,
-        })
+      return { docProps, documentCtx }
+    }
 
-        bodyResult = async (suffix: string) => {
-          // this must be called inside bodyResult so appWrappers is
-          // up to date when getWrappedApp is called
-
-          const flushEffectHandler = async () => {
-            const allFlushEffects = [
-              styledJsxFlushEffect,
-              ...(flushEffects || []),
-            ]
-            const flushEffectStream = await renderToStream({
-              ReactDOMServer,
-              element: (
-                <>
-                  {allFlushEffects.map((flushEffect, i) => (
-                    <React.Fragment key={i}>{flushEffect()}</React.Fragment>
-                  ))}
-                </>
-              ),
-              generateStaticHTML: true,
-            })
-            const flushed = await streamToString(flushEffectStream)
-            return flushed
-          }
+    const renderContent = () => {
+      return ctx.err && ErrorDebug ? (
+        <Body>
+          <ErrorDebug error={ctx.err} />
+        </Body>
+      ) : (
+        <Body>
+          <AppContainerWithIsomorphicFiberStructure>
+            {isServerComponent && AppMod.__next_rsc__ ? (
+              // _app.server.js is used.
+              <Component {...props.pageProps} router={router} />
+            ) : (
+              <App {...props} Component={Component} router={router} />
+            )}
+          </AppContainerWithIsomorphicFiberStructure>
+        </Body>
+      )
+    }
 
-          return await continueFromInitialStream({
-            renderStream,
-            suffix,
-            dataStream: serverComponentsInlinedTransformStream?.readable,
-            generateStaticHTML: generateStaticHTML || !hasConcurrentFeatures,
-            flushEffectHandler,
-          })
+    if (!hasConcurrentFeatures) {
+      if (Document.getInitialProps) {
+        const documentInitialPropsRes = await documentInitialProps()
+        if (documentInitialPropsRes === null) return null
+        const { docProps, documentCtx } = documentInitialPropsRes
+
+        return {
+          bodyResult: (suffix: string) =>
+            streamFromArray([docProps.html, suffix]),
+          documentElement: (htmlProps: HtmlProps) => (
+            <Document {...htmlProps} {...docProps} />
+          ),
+          head: docProps.head,
+          headTags: await headTags(documentCtx),
+          styles: docProps.styles,
         }
       } else {
         const content = renderContent()
         // for non-concurrent rendering we need to ensure App is rendered
         // before _document so that updateHead is called/collected before
         // rendering _document's head
         const result = ReactDOMServer.renderToString(content)
-        bodyResult = (suffix: string) => streamFromArray([result, suffix])
+        const bodyResult = (suffix: string) => streamFromArray([result, suffix])
+
+        const styles = jsxStyleRegistry.styles()
+        jsxStyleRegistry.flush()
+
+        return {
+          bodyResult,
+          documentElement: () => (Document as any)(),
+          head,
+          headTags: [],
+          styles,
+        }
+      }
+    } else {
+      let bodyResult
+
+      let renderStream: any
+
+      // We start rendering the shell earlier, before returning the head tags
+      // to `documentResult`.
+      const content = renderContent()
+      renderStream = await renderToInitialStream({
+        ReactDOMServer,
+        element: content,
+      })
+
+      bodyResult = async (suffix: string) => {
+        // this must be called inside bodyResult so appWrappers is
+        // up to date when getWrappedApp is called
+
+        const flushEffectHandler = async () => {
+          const allFlushEffects = [
+            styledJsxFlushEffect,
+            ...(flushEffects || []),
+          ]
+          const flushEffectStream = await renderToStream({
+            ReactDOMServer,
+            element: (
+              <>
+                {allFlushEffects.map((flushEffect, i) => (
+                  <React.Fragment key={i}>{flushEffect()}</React.Fragment>
+                ))}
+              </>
+            ),
+            generateStaticHTML: true,
+          })
+          const flushed = await streamToString(flushEffectStream)
+          return flushed
+        }
+
+        return await continueFromInitialStream({
+          renderStream,
+          suffix,
+          dataStream: serverComponentsInlinedTransformStream?.readable,
+          generateStaticHTML: generateStaticHTML || !hasConcurrentFeatures,
+          flushEffectHandler,
+        })
       }
 
       const styles = jsxStyleRegistry.styles()
       jsxStyleRegistry.flush()
 
+      const documentInitialPropsRes =
+        isServerComponent || process.browser || !Document.getInitialProps
+          ? {}
+          : await documentInitialProps()
+      if (documentInitialPropsRes === null) return null
+
+      const documentElement = () => {
+        if (isServerComponent || process.browser) {
+          return (Document as any)()
+        }
+
+        const { docProps } = (documentInitialPropsRes as any) || {}
+        return <Document {...htmlProps} {...docProps} />
+      }
+
       return {
         bodyResult,
-        documentElement: () => (Document as any)(),
+        documentElement,
         head,
         headTags: [],
         styles,

diff --git a/packages/react-dev-overlay/package.json b/packages/react-dev-overlay/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/react-dev-overlay",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "description": "A development-only overlay for developing React applications.",
   "repository": {
     "url": "vercel/next.js",

diff --git a/packages/react-refresh-utils/package.json b/packages/react-refresh-utils/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/react-refresh-utils",
-  "version": "12.1.3-canary.2",
+  "version": "12.1.3-canary.3",
   "description": "An experimental package providing utilities for React Refresh.",
   "repository": {
     "url": "vercel/next.js",