fix(worker): support UTF-8 encoding in inline workers (fixes #12117) (#…

…15866) Signed-off-by: Jay Wang <jay@zijie.wang> Co-authored-by: 翠 / green <green@sapphi.red>
vitejs · Feb 12, 2024 · 570e0f1 · 570e0f1
1 parent 76f30ae
commit 570e0f1
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 2 deletions.
diff --git a/packages/vite/src/node/plugins/worker.ts b/packages/vite/src/node/plugins/worker.ts
@@ -289,12 +289,13 @@ export function webWorkerPlugin(config: ResolvedConfig): Plugin {
             // Using blob URL for SharedWorker results in multiple instances of a same worker
             workerConstructor === 'Worker'
               ? `${encodedJs}
+          const decodeBase64 = (base64) => Uint8Array.from(atob(base64), c => c.charCodeAt(0));
           const blob = typeof window !== "undefined" && window.Blob && new Blob([${
             workerType === 'classic'
               ? ''
               : // `URL` is always available, in `Worker[type="module"]`
-                `'URL.revokeObjectURL(import.meta.url);'+`
-          }atob(encodedJs)], { type: "text/javascript;charset=utf-8" });
+                `'URL.revokeObjectURL(import.meta.url);',`
+          }decodeBase64(encodedJs)], { type: "text/javascript;charset=utf-8" });
           export default function WorkerWrapper(options) {
             let objURL;
             try {

diff --git a/playground/worker/__tests__/es/worker-es.spec.ts b/playground/worker/__tests__/es/worker-es.spec.ts
@@ -50,6 +50,14 @@ test('import meta url', async () => {
   )
 })
 
+test('unicode inlined', async () => {
+  await untilUpdated(
+    () => page.textContent('.pong-inline-unicode'),
+    '•pong•',
+    true,
+  )
+})
+
 test('shared worker', async () => {
   await untilUpdated(() => page.textContent('.tick-count'), 'pong', true)
 })

diff --git a/playground/worker/index.html b/playground/worker/index.html
@@ -50,6 +50,12 @@ <h2 class="format-iife">format iife:</h2>
 </p>
 <code class="pong-inline-url"></code>
 
+<p>
+  import InlineWorker from '../my-worker?worker&inline'
+  <span class="classname">.pong-inline-unicode</span>
+</p>
+<code class="pong-inline-unicode"></code>
+
 <p>
   import TSOutputWorker from '../possible-ts-output-worker?worker'
   <span class="classname">.pong-ts-output</span>

diff --git a/playground/worker/my-worker.ts b/playground/worker/my-worker.ts
@@ -8,6 +8,16 @@ self.onmessage = (e) => {
   if (e.data === 'ping') {
     self.postMessage({ msg, mode, bundleWithPlugin, viteSvg, metaUrl, name })
   }
+  if (e.data === 'ping-unicode') {
+    self.postMessage({
+      msg: '•pong•',
+      mode,
+      bundleWithPlugin,
+      viteSvg,
+      metaUrl,
+      name,
+    })
+  }
 }
 self.postMessage({
   msg,

diff --git a/playground/worker/worker/main-module.js b/playground/worker/worker/main-module.js
@@ -45,6 +45,12 @@ inlineWorkerUrl.addEventListener('message', (e) => {
   text('.pong-inline-url', e.data.metaUrl)
 })
 
+const unicodeInlineWorker = new InlineWorker()
+unicodeInlineWorker.postMessage('ping-unicode')
+unicodeInlineWorker.addEventListener('message', (e) => {
+  text('.pong-inline-unicode', e.data.msg)
+})
+
 const startSharedWorker = () => {
   const sharedWorker = new mySharedWorker()
   sharedWorker.port.addEventListener('message', (event) => {