Hot module replacement do not work on asyncComponents

[mathportillo]

Hello all, and thanks for the amazing project!

To reproduce: clone universally, checkout branch next, run npm run develop, alter anything in a component "inside" an asyncComponent (eg.: add content to HomeRoute.js)

On branch next, when running npm run develop with the project untouched, updates made to components loaded asyncronally fails to reflect on browser. Instead of not updating, everything inside the async component is removed from tree after the update. The route still matches and the asyncComponent component still loads in react tree, but with no children.

No error appear on server console and client console. On client console HMR logs as if working normally:

[HMR] connected
client.js?0e07:222 [HMR] bundle rebuilding
client.js?0e07:230 [HMR] bundle rebuilt in 172ms
process-update.js:41 [HMR] Checking for updates on the server...
process-update.js:114 [HMR] Updated modules:
process-update.js:116 [HMR]  - ./shared/components/DemoApp/AsyncHomeRoute/HomeRoute.js
process-update.js:116 [HMR]  - ./shared/components/DemoApp/AsyncHomeRoute/index.js
process-update.js:116 [HMR]  - ./shared/components/DemoApp/index.js
process-update.js:121 [HMR] App is up to date.
client.js?0e07:230 [HMR] bundle rebuilt in 491ms

I don't know if the problem is on Universally config, or on react-async-component code, or error on any of it's dependencies.

Things I tried:

• using http://0.0.0.0:1337 instead of localhost:1337 (as seen on #506)
• using different node versions
• using different environments (with different OS)
• updating dependencies to latest versions

Thanks again.

[mathportillo]

It looks like adding key={Math.random()} to ReactHotLoader component on client folder solves the issue, (as seen here: ctrlplusb/react-async-component/issues/14)

Still, I would say that a proper fix should be either not needing a random key for react-async-component to work, or adding it permanently to React Universally base.

So I will let you guys close the issue based on your decision.

Thanks anyway for this amazing project!!