React-instantsearch: `react-hot-loader` and `connectSearchBox` results in 100% CPU core usage and browser tab freezing

[thejamespower]

Describe the bug 🐛

When using connectSearchBox with an application that uses react-hot-loader, HMR updated changes result in the following error being repeated over and over again, to infinity:

React-Hot-Loader: some components were updated out-of-bound. Updating your app to reconcile the changes.

This results in a 100% CPU core usage and freezes the browser tab completely. (Resulting in not being able to close the tab without using task manager).

(Note, it's possible to prevent the freeze if you reload the page 'in time' before whatever limit (memory?)is reached by the browser which causes the freeze).

To Reproduce 🔍

Steps to reproduce the behavior:

1. Use a React application with react-hot-loader HMR.
2. Change code.
3. Switch to browser.
4. Observe error in console and CPU usage spike.
5. Wait and page freezes completely.

Expected behavior 💭

Normal HMR behaviour.

Environment:

• OS: Any (Testing on MacOS and Win10)
• Browser: Tested on Chrome
• Version: 78.0.3904.108

[francoischalifour]

Thanks for opening the issue, we'll investigate this. As a reminder for the team, here's another issue about HRM: #2396.

Do you have a sandbox where we can see this behavior? Is this the only component that you've seen break HMR compatibility?

[thejamespower]

Hey @francoischalifour, thanks for the speedy response. The behaviour is no longer being expressed, so I need to delve deeper into our history to pinpoint what change we made fixed the issue. Unfortunately we are due for release on Monday, so time is tight, but I will try to get a minimum repro' together when I can.