Bug report

What is the current behavior?

When using the experimental lazy compilation feature (in Storybook), when you change stories quickly (thus triggering many different lazy compilation jobs), sometimes the HMR for the lazy update can fail in various ways, which can lead to react-refresh errors or simply the whole app having to reload itself.

If the current behavior is a bug, please provide the steps to reproduce.

It is not entirely predictable, and I have not managed to reproduce outside of Storybook (yet), but this is a very very simple Storybook project and I think it is quite obvious the bug is in Webpack, but I am ready to be corrected ;)

https://github.com/tmeasday/storybook-lazy-compilation-webpack -- see the instructions from the repo.

The key point in this reproduction is that when a bunch of lazy updates are created on the server, the browser, which is otherwise doing nothing, will sometimes 404 on a hot-update.json request:

Note we have seen other (less reproducible) issues around HMR and lazy compilation, that you might see if you play with this repository, including:

• Sometimes the storybook fails to load initially with a HMR error. This definitely seems to be a timing issue with when the auto-launched browser loads relative to the initial entries compilation (it happens maybe 10% of the time or less when I simply run rm -rf node_modules/.cache/ && yarn storybook and let the browser launch).

• You can also trigger a bug by changing stories in the sidebar directly quickly while lazy compilation is going on (i.e. start SB, open up, change stories as fast as you can (you can use option-down and option-up to do this). However I cannot make this happen reliably enough to create a reproduction that would be useful. If you'd like to see what I mean I can likely get a screen recording of it happening at least.

What is the expected behavior?

Lazy compilation should be fairly transparent to the consumer, beyond import() requests taking a little longer than they otherwise might. If updates come over the wire from compilations triggered by other browsers, they should not fail.

Other relevant information:
webpack version: 5.70.0
Node.js version: 14.18.1
Operating System: MacOS
Additional tools: Storybook 6.5.0-alpha.48

NOTE

The tool we are using here to trigger the bug is the Storybook test runner, which opens the Storybook up in 4 separate, concurrent playwright instances, each of which will trigger a different dynamic (and thus lazy-compiled) import() statement.