fix: modulepreload polyfill only during build (fix #4786) (#7816)

vitejs · Apr 20, 2022 · 709776f · 709776f
1 parent f414848
commit 709776f
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 1 deletion.
diff --git a/packages/playground/backend-integration/__tests__/backend-integration.spec.ts b/packages/playground/backend-integration/__tests__/backend-integration.spec.ts
@@ -32,6 +32,12 @@ if (isBuild) {
     expect(htmlEntry.assets.length).toEqual(1)
   })
 } else {
+  test('No ReferenceError', async () => {
+    browserErrors.forEach((error) => {
+      expect(error.name).not.toBe('ReferenceError')
+    })
+  })
+
   describe('CSS HMR', () => {
     test('preserve the base in CSS HMR', async () => {
       await untilUpdated(() => getColor('body'), 'black') // sanity check

diff --git a/packages/playground/backend-integration/frontend/entrypoints/main.ts b/packages/playground/backend-integration/frontend/entrypoints/main.ts
@@ -1,3 +1,5 @@
+import 'vite/modulepreload-polyfill'
+
 export const colorClass = 'text-black'
 
 export function colorHeading() {

diff --git a/packages/vite/src/node/plugins/modulePreloadPolyfill.ts b/packages/vite/src/node/plugins/modulePreloadPolyfill.ts
@@ -5,7 +5,8 @@ import { isModernFlag } from './importAnalysisBuild'
 export const modulePreloadPolyfillId = 'vite/modulepreload-polyfill'
 
 export function modulePreloadPolyfillPlugin(config: ResolvedConfig): Plugin {
-  const skip = config.build.ssr
+  // `isModernFlag` is only available during build since it is resolved by `vite:build-import-analysis`
+  const skip = config.command !== 'build' || config.build.ssr
   let polyfillString: string | undefined
 
   return {

diff --git a/scripts/jestPerTestSetup.ts b/scripts/jestPerTestSetup.ts
@@ -24,6 +24,7 @@ declare global {
   const page: Page | undefined
 
   const browserLogs: string[]
+  const browserErrors: Error[]
   const serverLogs: string[]
   const viteTestUrl: string | undefined
   const watcher: RollupWatcher | undefined
@@ -34,6 +35,7 @@ declare const global: {
   page?: Page
 
   browserLogs: string[]
+  browserErrors: Error[]
   serverLogs: string[]
   viteTestUrl?: string
   watcher?: RollupWatcher
@@ -56,13 +58,19 @@ const onConsole = (msg: ConsoleMessage) => {
   logs.push(msg.text())
 }
 
+const errors: Error[] = (global.browserErrors = [])
+const onPageError = (error: Error) => {
+  errors.push(error)
+}
+
 beforeAll(async () => {
   const page = global.page
   if (!page) {
     return
   }
   try {
     page.on('console', onConsole)
+    page.on('pageerror', onPageError)
 
     const testPath = expect.getState().testPath
     const testName = slash(testPath).match(/playground\/([\w-]+)\//)?.[1]