fix(core): simplify cloudflare wasm loading (#670)

Author: hi-ogawa

packages/core/src/oniguruma/index.ts

@@ -426,6 +426,14 @@ export function loadWasm(options: LoadWasmOptions): Promise<void> {
         else if (isArrayBuffer(instance)) {
           instance = await _makeArrayBufferLoader(instance)(info)
         }
+        // import("shiki/onig.wasm") returns `{ default: WebAssembly.Module }` on cloudflare workers
+        // https://developers.cloudflare.com/workers/wrangler/bundling/
+        else if (instance instanceof WebAssembly.Module) {
+          instance = await _makeArrayBufferLoader(instance)(info)
+        }
+        else if ('default' in instance && instance.default instanceof WebAssembly.Module) {
+          instance = await _makeArrayBufferLoader(instance.default)(info)
+        }
       }
 
       if ('instance' in instance)
@@ -440,7 +448,7 @@ export function loadWasm(options: LoadWasmOptions): Promise<void> {
   return initPromise
 }
 
-function _makeArrayBufferLoader(data: ArrayBufferView | ArrayBuffer): WebAssemblyInstantiator {
+function _makeArrayBufferLoader(data: ArrayBufferView | ArrayBuffer | WebAssembly.Module): WebAssemblyInstantiator {
   return importObject => WebAssembly.instantiate(data, importObject)
 }
 function _makeResponseStreamingLoader(data: Response): WebAssemblyInstantiator {

packages/shiki/test/cf.ts

@@ -8,7 +8,10 @@ import js from 'shiki/langs/javascript.mjs'
 // eslint-disable-next-line antfu/no-import-dist
 import wasm from '../dist/onig.wasm'
 
-await loadWasm(obj => WebAssembly.instantiate(wasm, obj))
+await loadWasm(wasm)
+
+// cloudflare also supports dynamic import
+// await loadWasm(import('../dist/onig.wasm'))
 
 export default {
   async fetch() {

packages/shiki/test/wasm5.test.ts

@@ -0,0 +1,19 @@
+import { expect, it } from 'vitest'
+import { getHighlighterCore } from '../src/core'
+
+import js from '../src/assets/langs/javascript'
+import nord from '../src/assets/themes/nord'
+
+// eslint-disable-next-line antfu/no-import-dist
+import { wasmBinary } from '../../core/dist/wasm-inlined.mjs'
+
+it('loadWasm: WebAssembly.Module', async () => {
+  const shiki = await getHighlighterCore({
+    themes: [nord],
+    langs: [js as any],
+    loadWasm: WebAssembly.compile(wasmBinary) as any,
+  })
+
+  expect(shiki.codeToHtml('1 + 1', { lang: 'javascript', theme: 'nord' }))
+    .toMatchInlineSnapshot(`"<pre class="shiki nord" style="background-color:#2e3440ff;color:#d8dee9ff" tabindex="0"><code><span class="line"><span style="color:#B48EAD">1</span><span style="color:#81A1C1"> +</span><span style="color:#B48EAD"> 1</span></span></code></pre>"`)
+})

packages/shiki/test/wasm6.test.ts

@@ -0,0 +1,19 @@
+import { expect, it } from 'vitest'
+import { getHighlighterCore } from '../src/core'
+
+import js from '../src/assets/langs/javascript'
+import nord from '../src/assets/themes/nord'
+
+// eslint-disable-next-line antfu/no-import-dist
+import { wasmBinary } from '../../core/dist/wasm-inlined.mjs'
+
+it('loadWasm: { default: WebAssembly.Module }', async () => {
+  const shiki = await getHighlighterCore({
+    themes: [nord],
+    langs: [js as any],
+    loadWasm: Promise.resolve({ default: await WebAssembly.compile(wasmBinary) }) as any,
+  })
+
+  expect(shiki.codeToHtml('1 + 1', { lang: 'javascript', theme: 'nord' }))
+    .toMatchInlineSnapshot(`"<pre class="shiki nord" style="background-color:#2e3440ff;color:#d8dee9ff" tabindex="0"><code><span class="line"><span style="color:#B48EAD">1</span><span style="color:#81A1C1"> +</span><span style="color:#B48EAD"> 1</span></span></code></pre>"`)
+})