React Refresh / HMR not working in Web Worker

[donalffons]

Description of Bug

React Refresh / HMR is not fully working in Stackblitz with my setup. It is working, when running the project locally, though. This is my setup:

• This is using three different react renderers. ReactDOM and React-Three-Fiber are running on the main thread and work fine (including live updates). "My own" custom renderer is running in a web worker and React Refresh / HMR doesn't seem to work there in Stackblitz.
• To make React Refresh / HMR work, I'm using Webpack in multi-compiler (started from start.mjs mode with 2 webpack configs
  • One for the main thread: webpack.config.js
  • One for the worker: webpack.config.worker.js
• React Refresh / HMR is not meant to be working in src/worker/index.tsx (neither on Stackblitz nor locally). It should be working with src/worker/Model.tsx though.

Steps to Reproduce

1. Go to https://stackblitz.com/edit/stackblitz-issue-react-refresh-hmr?file=src%2FApp.tsx,src%2Fworker%2Findex.tsx,src%2Fworker%2FModel.tsx and edit the file src/worker/Model.tsx
2. Change the boolean operation (or any other props like position, radius, ...):

-     <bool op="cut">
+     <bool op="common">
        <box position={[-0.5, -0.5, -0.5]} />
        <sphere radius={0.7} position={[0, 0, 0]} />
      </bool>

3. When running locally, the viewport updates (using HMR / react-refresh, i.e. without a reload) and shows this
   
   However, on Stackblitz there is no change until you click on reload.
4. Changing the ReactDOM contents in src/App.tsx works as expected without having to reload manually

      <div>
-        Hello, World!
+        Hello, Stackblitz!
      </div>

Expected Behavior

I would expect React Refresh / HMR to work in Stackblitz, as it does when running locally.

PS: I love your product and would like to use it for demoing my CAD library. For that, it would be great if React Refresh / HMR would be working 🙂.

[donalffons]

...not sure if that's related, but there are some console errors appearing after a while, indicating an error in /node_modules/webpack-dev-server/client/clients/WebSocketClient.js which is trying to make a Websocket connection with wss://stackblitz-issue-react-refresh-hmr--3000.local.webcontainer.io:3000/ws.

[fvsch]

This might be the same issue as, or related to, stackblitz/webcontainer-core#665