alee/relicario
1
0
Fork 0
Code Issues Pull Requests 4 Actions Packages Projects Releases Wiki Activity

fix: use static import + initSync for WASM in service worker

Browse Source 
Chrome MV3 service workers do not support dynamic import().
Switch to static import of the wasm-pack JS glue and use
initSync() with fetch() to load the WASM binary at runtime.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken
2026-04-12 11:37:44 -04:00
parent 8236a18433
commit 336e90fc84
2 changed files with 23 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
extension/src/service-worker/index.ts
View File

@@ -21,27 +21,30 @@ const totpSecretCache: Map<string, string> = new Map();
// --- WASM initialization ---
// We use a dynamic import so webpack treats idfoto_wasm.js as a separate chunk.
// The WASM file (idfoto_wasm_bg.wasm) is loaded by the JS glue code.
type WasmModule = typeof import('idfoto-wasm');
// Chrome MV3 service workers do NOT support dynamic import().
// Instead we load the WASM binary via fetch() and use the synchronous
// initSync() function exported by wasm-pack's --target web output.
// The JS glue is imported statically so webpack bundles it into
// the service worker script.
// @ts-ignore TS2307 — resolved by webpack alias / copy
import initSync, * as wasmBindings from '../../wasm/idfoto_wasm.js';
type WasmModule = typeof wasmBindings;
let wasm: WasmModule | null = null;
async function initWasm(): Promise<WasmModule> {
if (wasm) return wasm;
// wasm-pack --target web produces an ES module with an `default` init function
// that loads the .wasm file. In a Chrome MV3 service worker we import the JS
// glue and call init() with the wasm URL.
const mod = await import(
// @ts-ignore TS2307 — resolved at runtime by the service worker, not by TS/webpack
/* webpackIgnore: true */ './idfoto_wasm.js'
) as WasmModule & { default: (input?: string | URL) => Promise<void> };
// Fetch the .wasm binary and instantiate synchronously
const wasmResponse = await fetch(chrome.runtime.getURL('idfoto_wasm_bg.wasm'));
const wasmBytes = await wasmResponse.arrayBuffer();
initSync({ module: new WebAssembly.Module(wasmBytes) });
await mod.default('./idfoto_wasm_bg.wasm');
vault.setWasm(mod);
wasm = mod;
vault.setWasm(wasmBindings);
wasm = wasmBindings;
wasmReady = true;
return mod;
return wasm;
}
// --- Storage helpers ---

10
extension/src/service-worker/vault.ts
View File

@@ -8,14 +8,16 @@ import type { GitHost } from './git-host';
import type { Entry, Manifest, ManifestEntry } from '../shared/types';
// WASM module reference — set once during init.
let wasm: typeof import('idfoto-wasm') | null = null;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
let wasm: any = null;
/// Store the WASM module reference after dynamic import.
export function setWasm(w: typeof import('idfoto-wasm')): void {
/// Store the WASM module reference after initialization.
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export function setWasm(w: any): void {
wasm = w;
}
function requireWasm(): NonNullable<typeof wasm> {
function requireWasm(): any {
if (!wasm) throw new Error('WASM module not initialized');
return wasm;
}