document is not defined without format: "es"

[valterkraemer]

I am at least getting document is not defined error if I'm not setting this is vite.config.ts.

worker: {
  format: "es",
  ...
}

I am importing wasm into a Web Worker where document isn't defined.

Code repo.

Using:

vite 4.4.8
vite-plugin-top-level-await 1.3.1
vite-plugin-wasm 3.2.2

[Menci]

Could you confirm whether your code works with Webpack's asyncWebassembly?

I guess the module you imported in your worker code is using document. I don't think my plugin will inject that.

[valterkraemer]

Could you confirm whether your code works with Webpack's asyncWebassembly?

No, don't really know how I would do that. I btw don't expect you to look into this, and am totally fine with you closing this as "won't do" or whatever. More thought it could be helpful for others.

I guess the module you imported in your worker code is using document. I don't think my plugin will inject that.

When not using format: es it fails in this code because document isn't defined:

(function() {
    "use strict";
    (async () => {
        var v = "" + new URL("assets/imagequant_bg-29aff33d.wasm", document.currentScript && document.currentScript.src || new URL("assets/worker-e8eb1697.js", document.baseURI).href).href,
            A = async (n={}, _) => {
                let t;
                if (_.startsWith("data:")) {
                    const l = _.replace(/^data:.*?base64,/, "");
                    let o;
                    if (typeof Buffer == "function" && typeof Buffer.from == "function")
                        o = Buffer.from(l, "base64");
                    ...

and I could find similar code in https://github.com/Menci/vite-plugin-wasm/blob/541d7e46e89c13a3fd07061e33a88a615ee0d059/src/wasm-helper.ts#L11-L15

If using format: es it becomes:

(async () => {
  var j =
      "" + new URL("assets/imagequant_bg-29aff33d.wasm", import.meta.url).href,
    O = async (_ = {}, n) => {
      let o;
      if (n.startsWith("data:")) {
        const d = n.replace(/^data:.*?base64,/, "");
        let t;
        if (typeof Buffer == "function" && typeof Buffer.from == "function")
          t = Buffer.from(d, "base64");
          ...

To my understanding it's this line https://github.com/Menci/vite-plugin-wasm/blob/541d7e46e89c13a3fd07061e33a88a615ee0d059/src/index.ts#L48 that becomes the one containing document.

Also this doesn't happen during vite dev, but only when vite build + vite preview.

[microdou]

I encountered exactly the same issue with wasm-pack + worker + sveltekit in production.

Adding format: "es" to vite resolves the issue.

Thanks @valterkraemer for raising the issue and providing a workaround!

[Menci]

Oh it's a bug in vite-plugin-top-level-await. Let me fix it in that plugin...

[Menci]

Supported in https://github.com/Menci/vite-plugin-top-level-await/commit/160f5f1c817c0cb9da9d71e24209ea56186d175f