Fixes beforeInteractive scripts failing in custom document (#37000)

- Fixes #36997 - Fixes #31275 @janicklas-ralph Any idea why tests were passing while this check was failing? Can we add a stronger test for this?
vercel · May 18, 2022 · 81e69e8 · 81e69e8
1 parent b2045c7
commit 81e69e8
Show file tree

Hide file tree

Showing 2 changed files with 64 additions and 1 deletion.
diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts
@@ -816,7 +816,7 @@ export default async function getBaseWebpackConfig(
       }
 
       const notExternalModules =
-        /^(?:private-next-pages\/|next\/(?:dist\/pages\/|(?:app|document|link|image|constants|dynamic)$)|string-hash$)/
+        /^(?:private-next-pages\/|next\/(?:dist\/pages\/|(?:app|document|link|image|constants|dynamic|script)$)|string-hash$)/
       if (notExternalModules.test(request)) {
         return
       }

diff --git a/...next-script-worker-strategy/index.test.ts → test/e2e/next-script/index.test.ts b/...next-script-worker-strategy/index.test.ts → test/e2e/next-script/index.test.ts
@@ -4,6 +4,69 @@ import { NextInstance } from 'test/lib/next-modes/base'
 import { BrowserInterface } from 'test/lib/browsers/base'
 import { waitFor } from 'next-test-utils'
 
+describe('beforeInteractive', () => {
+  let next: NextInstance
+
+  beforeAll(async () => {
+    next = await createNext({
+      files: {
+        'pages/_document.js': `
+          import { Html, Head, Main, NextScript } from 'next/document'
+          import Script from 'next/script'
+          
+          export default function Document() {
+            return (
+              <Html>
+                <Head>
+                  <Script
+                    src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js"
+                    strategy="beforeInteractive"
+                  ></Script>
+                </Head>
+                <body>
+                  <Main />
+                  <NextScript />
+                </body>
+              </Html>
+            )
+          }
+        `,
+        'pages/index.js': `
+          import Script from 'next/script'
+        
+          export default function Home() {
+            return (
+              <>
+                <p>Home page</p>
+              </>
+            )
+          }
+        `,
+      },
+      dependencies: {
+        react: '17.0.2',
+        'react-dom': '17.0.2',
+      },
+    })
+  })
+  afterAll(() => next.destroy())
+
+  it('Script is injected server-side', async () => {
+    let browser: BrowserInterface
+
+    try {
+      browser = await webdriver(next.url, '/')
+
+      const script = await browser.eval(
+        `document.querySelector('script[data-nscript="beforeInteractive"]')`
+      )
+      expect(script).not.toBeNull()
+    } finally {
+      if (browser) await browser.close()
+    }
+  })
+})
+
 describe('experimental.nextScriptWorkers: false with no Partytown dependency', () => {
   let next: NextInstance