You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
TL;DR, a mutation causes a cache invalidation which triggers a re-fetch. If another mutation happens before the re-fetch finishes, a second re-fetch isn't triggerd, and the returned value ends up being stale, because it doesn't account for the second mutation. Is this expected? Is there a way around this? Details and codesanbox and etc. below.
We're running into a quirk with cache invalidation, and I wonder if someone has advice or insight.
Imagine the following endpoints:
getColor: returns the current color value
updateColor: updates the current color value
getColor, provides the ['Color'] tag, and updateColor, invalidates that tag
The problem we're running into is: a user updates the color, the re-fetch is triggered. Before the re-fetch finishes, the user updates the color again. When the original re-fetch finishes, it comes back with the wrong color value, because the user has made a new change that wasn't accounted for. A second re-fetch wasn't triggered I assume because one was already in progress. What are we supposed to do in such a scenario? Ideally, I think I'd want to force another refetch to happen, after the second mutation, rather than it being ignored.
And Here's a gif showing the scenario. I show it working normally changing the color between blue, and then red. Then I show what happens when the user changes the color, then changes the color again after the re-fetch has started from the cache invalidation.
The text was updated successfully, but these errors were encountered:
bad ugly not good solution to the race condition on page load,
but it works perfectly so w/e
i'm delaying each query until the backend URL to query is specified
the (imo) correct solution here is to correctly invalidate tags
in the presence of a race condition. seems like there's a PR to do
that here: reduxjs/redux-toolkit#3116
but no movement on it for the last few months
related issue: reduxjs/redux-toolkit#3386
TL;DR, a mutation causes a cache invalidation which triggers a re-fetch. If another mutation happens before the re-fetch finishes, a second re-fetch isn't triggerd, and the returned value ends up being stale, because it doesn't account for the second mutation. Is this expected? Is there a way around this? Details and codesanbox and etc. below.
We're running into a quirk with cache invalidation, and I wonder if someone has advice or insight.
Imagine the following endpoints:
getColor
: returns the current color valueupdateColor
: updates the current color valuegetColor
, provides the['Color']
tag, andupdateColor
, invalidates that tagThe problem we're running into is: a user updates the color, the re-fetch is triggered. Before the re-fetch finishes, the user updates the color again. When the original re-fetch finishes, it comes back with the wrong color value, because the user has made a new change that wasn't accounted for. A second re-fetch wasn't triggered I assume because one was already in progress. What are we supposed to do in such a scenario? Ideally, I think I'd want to force another refetch to happen, after the second mutation, rather than it being ignored.
Here's a codesandbox link for what I'm talking about: https://codesandbox.io/s/vigorous-sunset-tyu1mz?file=/src/store.ts
And Here's a gif showing the scenario. I show it working normally changing the color between blue, and then red. Then I show what happens when the user changes the color, then changes the color again after the re-fetch has started from the cache invalidation.
The text was updated successfully, but these errors were encountered: