fix(worker): handle self reference url worker in dependency for build (#17846)

Author: hi-ogawa

packages/vite/src/node/plugins/worker.ts

@@ -292,7 +292,7 @@ export function webWorkerPlugin(config: ResolvedConfig): Plugin {
 
       let urlCode: string
       if (isBuild) {
-        if (isWorker && this.getModuleInfo(cleanUrl(id))?.isEntry) {
+        if (isWorker && config.bundleChain.at(-1) === cleanUrl(id)) {
           urlCode = 'self.location.href'
         } else if (inlineRE.test(id)) {
           const chunk = await bundleWorkerEntry(config, id)

packages/vite/src/node/plugins/workerImportMetaUrl.ts

@@ -171,7 +171,7 @@ export function workerImportMetaUrlPlugin(config: ResolvedConfig): Plugin {
           if (
             isBuild &&
             config.isWorker &&
-            this.getModuleInfo(cleanUrl(file))?.isEntry
+            config.bundleChain.at(-1) === cleanUrl(file)
           ) {
             s.update(expStart, expEnd, 'self.location.href')
           } else {

playground/worker/__tests__/es/worker-es.spec.ts

@@ -111,7 +111,7 @@ describe.runIf(isBuild)('build', () => {
   test('inlined code generation', async () => {
     const assetsDir = path.resolve(testDir, 'dist/es/assets')
     const files = fs.readdirSync(assetsDir)
-    expect(files.length).toBe(34)
+    expect(files.length).toBe(35)
     const index = files.find((f) => f.includes('main-module'))
     const content = fs.readFileSync(path.resolve(assetsDir, index), 'utf-8')
     const worker = files.find((f) => f.includes('my-worker'))

playground/worker/__tests__/iife/worker-iife.spec.ts

@@ -75,7 +75,7 @@ describe.runIf(isBuild)('build', () => {
   test('inlined code generation', async () => {
     const assetsDir = path.resolve(testDir, 'dist/iife/assets')
     const files = fs.readdirSync(assetsDir)
-    expect(files.length).toBe(22)
+    expect(files.length).toBe(23)
     const index = files.find((f) => f.includes('main-module'))
     const content = fs.readFileSync(path.resolve(assetsDir, index), 'utf-8')
     const worker = files.find((f) => f.includes('worker_entry-my-worker'))
@@ -173,6 +173,12 @@ test('self reference url worker', async () => {
   ).toBe('pong: main\npong: nested\n')
 })
 
+test('self reference url worker in dependency', async () => {
+  await expectWithRetry(() =>
+    page.textContent('.self-reference-url-worker-dep'),
+  ).toBe('pong: main\npong: nested\n')
+})
+
 test.runIf(isServe)('sourcemap boundary', async () => {
   const response = page.waitForResponse(/my-worker.ts\?worker_file&type=module/)
   await page.goto(viteTestUrl)

playground/worker/__tests__/sourcemap-hidden/worker-sourcemap-hidden.spec.ts

@@ -10,7 +10,7 @@ describe.runIf(isBuild)('build', () => {
 
     const files = fs.readdirSync(assetsDir)
     // should have 2 worker chunk
-    expect(files.length).toBe(44)
+    expect(files.length).toBe(46)
     const index = files.find((f) => f.includes('main-module'))
     const content = fs.readFileSync(path.resolve(assetsDir, index), 'utf-8')
     const indexSourcemap = getSourceMapUrl(content)

playground/worker/__tests__/sourcemap-inline/worker-sourcemap-inline.spec.ts

@@ -10,7 +10,7 @@ describe.runIf(isBuild)('build', () => {
 
     const files = fs.readdirSync(assetsDir)
     // should have 2 worker chunk
-    expect(files.length).toBe(22)
+    expect(files.length).toBe(23)
     const index = files.find((f) => f.includes('main-module'))
     const content = fs.readFileSync(path.resolve(assetsDir, index), 'utf-8')
     const indexSourcemap = getSourceMapUrl(content)

playground/worker/__tests__/sourcemap/worker-sourcemap.spec.ts

@@ -9,7 +9,7 @@ describe.runIf(isBuild)('build', () => {
     const assetsDir = path.resolve(testDir, 'dist/iife-sourcemap/assets')
     const files = fs.readdirSync(assetsDir)
     // should have 2 worker chunk
-    expect(files.length).toBe(44)
+    expect(files.length).toBe(46)
     const index = files.find((f) => f.includes('main-module'))
     const content = fs.readFileSync(path.resolve(assetsDir, index), 'utf-8')
     const indexSourcemap = getSourceMapUrl(content)

playground/worker/dep-self-reference-url-worker/index.js

@@ -0,0 +1,9 @@
+export function startWorker(handler) {
+  const worker = new Worker(new URL('./worker.js', import.meta.url), {
+    type: 'module',
+  })
+  worker.postMessage('main')
+  worker.addEventListener('message', (e) => {
+    handler(e)
+  })
+}

playground/worker/dep-self-reference-url-worker/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@vitejs/test-dep-self-reference-url-worker",
+  "private": true,
+  "version": "1.0.0",
+  "type": "module",
+  "main": "index.js"
+}

playground/worker/dep-self-reference-url-worker/worker.js

@@ -0,0 +1,14 @@
+// copy of playground/worker/self-reference-url-worker.js
+self.addEventListener('message', (e) => {
+  if (e.data === 'main') {
+    const selfWorker = new Worker(new URL('./worker.js', import.meta.url), {
+      type: 'module',
+    })
+    selfWorker.postMessage('nested')
+    selfWorker.addEventListener('message', (e) => {
+      self.postMessage(e.data)
+    })
+  }
+
+  self.postMessage(`pong: ${e.data}`)
+})

playground/worker/index.html

@@ -164,6 +164,11 @@ <h2 class="format-iife">format iife:</h2>
 </p>
 <code class="self-reference-url-worker"></code>
 
+<p>
+  <span class="classname">.self-reference-url-worker-dep</span>
+</p>
+<code class="self-reference-url-worker-dep"></code>
+
 <p>
   new Worker(new URL('../deeply-nested-worker.js', import.meta.url), { type:
   'module' })

playground/worker/package.json

@@ -28,6 +28,7 @@
     "debug": "node --inspect-brk ../../packages/vite/bin/vite"
   },
   "dependencies": {
+    "@vitejs/test-dep-self-reference-url-worker": "file:./dep-self-reference-url-worker",
     "@vitejs/test-dep-to-optimize": "file:./dep-to-optimize"
   }
 }

playground/worker/vite.config-iife.js

@@ -51,4 +51,7 @@ export default defineConfig({
     },
   ],
   cacheDir: 'node_modules/.vite-iife',
+  optimizeDeps: {
+    exclude: ['@vitejs/test-dep-self-reference-url-worker'],
+  },
 })

playground/worker/worker/main-module.js

@@ -1,3 +1,4 @@
+import * as depSelfReferenceUrlWorker from '@vitejs/test-dep-self-reference-url-worker'
 import myWorker from '../my-worker.ts?worker'
 import InlineWorker from '../my-worker.ts?worker&inline'
 import InlineSharedWorker from '../my-inline-shared-worker?sharedworker&inline'
@@ -177,3 +178,8 @@ selfReferenceUrlWorker.addEventListener('message', (e) => {
   document.querySelector('.self-reference-url-worker').textContent +=
     `${e.data}\n`
 })
+
+depSelfReferenceUrlWorker.startWorker((e) => {
+  document.querySelector('.self-reference-url-worker-dep').textContent +=
+    `${e.data}\n`
+})