No rerender triggered on successive updates of the same reactive variable using the useReactiveVar hook

[limekiln]

Intended outcome:

I am using reactive variables and the useReactiveVar hook to manage local state. Updates to a reactive variable which correctly update the object stored in the variable should trigger a rerender in components which consume this variable using the provided hook.

Actual outcome:

In some circumstances (described below), the cache is updated correctly, but no rerender is triggered.

How to reproduce the issue:

Sandbox: https://codesandbox.io/s/reactive-variable-bug-8dccb?file=/src/button.js

It seems in case there are successive updates to the same reactive variable, only the first update triggers a new render of the component which consumes it. The second one is skipped. This behaviour was introduced in version 3.3.7 and persists also within 3.3.13. Using version 3.3.6, it works perfectly fine. Also, if a separate reactive variable is used for the trigger, it works fine as well in current versions. This might be a valid workaround, but, at least for me, it is not really satisfying since I like to group related information in the same variable.

Versions

• @apollo/client 3.3.13
• graphql 15.5.0
• react 17.0.2
• react-dom 17.0.2
• react-scripts 4.0.0

[limekiln]

An update on this one ... I actually managed to reproduce this behaviour while using different reactive variables as well, but not consistently. In most cases it works, but for one it shows the exact same behaviour of skipping the necessary rerender. The steps are the same:

• Update the trigger variable
• Read the trigger variable using the useReactiveVar
• Use an effect to update the other reactive variable once the trigger changes

The only difference is that in this case (where it does not work), both the trigger and the data variable are changed within the same component.

[felixmeziere]

Similar problem here, when I update a reactive var too often successively, at some point the re-rendering stops working :/

[felixmeziere]

Update: I can confirm that with @apollo/client v3.3.6 I don't have the issue, so 3.3.7 broke useReactiveVar.

[brainkim]

I am reasonably certain this is fixed by #8022. Feel free to ping and yell at me if this is not the case 🤗 Should be in a release soon.

[brainkim]

Shipped in 3.3.16