Detect fast-refresh to update web-workers

[shlajin]

Describe the feature you'd like to request

With Webpack 5, creating web workers is a breeze. However, turns out they aren't a subject to self-refresh on change. Or, at least, I think they fail to do so by design.

Imagine I'm spawning a web worker somehow. Say, inside a useEffect of a component. The purpose of that webworker could be drawing something on an offscreen canvas.

const worker = new Worker(
      new URL('../workers/NiceDrawings.ts', import.meta.url)
    );

During development, I want to tweak the NiceDrawings.ts (and its dependencies!) and I want fast refresh to identify the worker as a dependency of my react component, so it can re-instantiate the worker.

However, it doesn't happen. Fast refresh happens, but the useEffect doesn't fire.

Describe the solution you'd like

Workers might start not only in useEffect, so ideally I would want to have finer control over this, just like the old times with module.hot.accept(deps). Maybe a compile directive, i.e.

// @refresh implicit-dep ../workers/NiceDrawings.ts

Describe alternatives you've considered

Some other way of importing the worker, e.g.

// we have an import here, so nextjs knows it's a dep
import myWorker from './myWorker.worker'

// webpack saw the ".worker" ending on the file, so it transformed the import a bit exposing the URL
new URL(myWorker.url);

[donalffons]

I just want to give my +1 to this issue. I'm having a use case, where I would like to run a custom React renderer that does heavy computations inside a web worker. If we could have Hot Module Reloading for web workers, my "custom" react components would behave just like the React-DOM-ones. Not having HMR would be a bit of a deal breaker for this.

[ShaMan123]

+1 there should at least be a simple documented way to achieve this

[ShaMan123]

Switching to polling causes next to compile but doesn't trigger a hot refresh - https://medium.com/mikkotikkanen/solving-next-js-fast-refresh-on-docker-windows-71dfdb3ee785