How to use vanilla web worker in next v13.5.2

[RaenonX]

Summary

I was using vanilla web workers just fine using app directory.

hook.ts

const worker = React.useMemo(() => new Worker(new URL('main.worker', import.meta.url)), []);

worker.onmessage = (event: MessageEvent<Data>) => {
  setLoading(false);
  // Handle data after worker completes
};

worker.onerror = (event) => {
  setLoading(false);
  // Handle error
  console.error('Error event occurred in sorting worker', event);

  throw event;
};

const triggerCalc = () => {
  worker.postMessage(workerMessageOpts);
  setLoading(true);
};

React.useEffect(() => {
  triggerCalc();
}, triggeringDeps);

React.useEffect(() => {
  return () => worker.terminate();
}, []);

main.worker.ts

const onMessage = ({data}: MessageEvent<WorkerMessageOpts>) => {
  const result = calculations(data);
  postMessage(result satisfies Data);
};

addEventListener('message', onMessage);

However, after the changes that seems introduced in v13.5 related to <Script strategy="worker" /> and https://nextjs.org/docs/app/building-your-application/optimizing/scripts#offloading-scripts-to-a-web-worker-experimental, the above implementation doesn't work anymore.

From what I can see, triggerCalc() is executed, but onMessage in the worker is not ran/caught/triggered.

Additional information

No response

Example

No response