bug(instrumentation-fetch): WebAssembly.compileStreaming failed: TypeError

[dyladan]

What happened?

Steps to Reproduce

1. instrument fetch
2. create a wasm object URL like const wasmUrl = URL.createObjectURL(new Blob([new Uint8Array([ 0x00, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00 ])], { type: "application/wasm" }));
3. compile module with const module = await WebAssembly.compileStreaming(fetch(wasmUrl))

Expected Result

module is a compiled WebAssembly.Module

Actual Result

compileStreaming throws because wrapped fetch no longer returns a native Promise, but instead a PromiseLike object that wraps the Promise.

Additional Details

You can work around this by awaiting the response and passing the bytes to WebAssembly.compile manually.

// Minimal valid WASM binary: magic + version only.
const wasmBytes = new Uint8Array([
  0x00, 0x61, 0x73, 0x6d,
  0x01, 0x00, 0x00, 0x00,
]);

const wasmUrl = URL.createObjectURL(
  new Blob([wasmBytes], { type: "application/wasm" })
);

// Broken code
const module = await WebAssembly.compileStreaming(fetch(wasmUrl));

// Workaround
const response = await fetch(wasmUrl);
console.log("response ok:", response.ok, response.headers.get("content-type"));

const bytes = await response.arrayBuffer();
const module = await WebAssembly.compile(bytes);

issue.html

workaround.html

OpenTelemetry Setup Code

import { WebTracerProvider } from "https://esm.sh/@opentelemetry/sdk-trace-web?bundle";
import {
    ConsoleSpanExporter,
    SimpleSpanProcessor,
} from "https://esm.sh/@opentelemetry/sdk-trace-base?bundle";
import { registerInstrumentations } from "https://esm.sh/@opentelemetry/instrumentation?bundle";
import { FetchInstrumentation } from "https://esm.sh/@opentelemetry/instrumentation-fetch?bundle";
import { ZoneContextManager } from "https://esm.sh/@opentelemetry/context-zone?bundle";

const provider = new WebTracerProvider({
    spanProcessors: [new SimpleSpanProcessor(new ConsoleSpanExporter())],
});

provider.register({
    contextManager: new ZoneContextManager(),
});

const originalFetch = globalThis.fetch;

registerInstrumentations({
    instrumentations: [new FetchInstrumentation()],
});

console.log("fetch patched:", globalThis.fetch !== originalFetch);

package.json

Relevant log output

Operating System and Version

No response

Runtime and Version

No response

Tip

_{React with 👍 to help prioritize this issue. Please use comments to provide useful context, avoiding +1 or me too, to help us triage it. Learn more here.}

[dyladan]

I originally thought this happened because fetch no longer returned a native promise, but actually the wrapped Response is the problem. Introduced by #6343