Module becomes `undefined` after refresh due to cyclic dependencies

I’m experiencing a bug where upon changing a file, one of my modules becomes undefined (causing part of the page to disappear).

I’ve mostly reduced my repro case. It seems related to cyclic dependencies. Repro steps:

1. Clone https://github.com/sophiebits/refresh-cycle-repro

2. Run yarn and yarn start, then visit http://localhost:7002/. You’ll see the text “Hello: 100”.

3. If you edit the “Hello” (in App.js), it updates properly.

4. If you edit the “100” (in SurveyOverview.js), the 100 disappears until next page reload.

   This is because the DashboardPage import in routes.js becomes undefined (as you can see from the console logs). If you check the same import a tick later, it is correctly populated.

Not sure whether the bug is in react-refresh-webpack-plugin, react-refresh, or webpack.

[sophiebits]

@Timer I think you’re the better judge of that! But it does appear that you successfully copied my code into a test case. 😅 Does the fact that it passes CI mean that this works correctly in @next/react-refresh-utils already?

[pmmmwh]

Closing as it is marked as won't fix in upstream.