Bug: After some time useSyncExternalStore stops reacting on store updates #27891
Labels
Resolution: Stale
Automatically closed due to inactivity
Status: Unconfirmed
A potential issue that we haven't yet confirmed as a bug
I'm using React+Redux, as everyone else. Initially, I assumed it's a react-redux problem, but this bug is only reproduced on versions 8.x and 9.x of react-redux, where useSyncExternalStore was added, and react-redux team suggested me to ask you about this. The issue:
The UI is working perfectly fine, but after a while it just stops receiving store updates. The Redux DevTools shows that the action was successfully dispatched, but no re-renders are triggered by that. We have a setState bound to a blur event on the root component, and when I move my cursor over DevTools, causing blur event, the UI re-renders. Any change in store do not trigger re-render. It is a rare bug, happens after user spends some time on the site without reloads. One of the code examples:
Looks like the problem is in forceUpdate somewhere inside the codebase, but I don't really know.
React version: 18.2.0 ([email protected] or @9.0.4, [email protected], and as a dependency of react-redux, the actual [email protected] is installed)
There are no clear steps to reproduce, just don't reload the page and after a while it happens.
I tried to figure out the problem by myself, but the flow inside useSyncExternalStore is just too complex. I'm not the first one who faced this issue (on react-redux repo: 2060, 1981). There are also a couple of demos: 1, 2.
I'm not sure if this information will be helpful, but we can only catch this bug on production (i.e., NODE_ENV === 'production'). Maybe this helps.
The text was updated successfully, but these errors were encountered: