Description
We're running into a lot of issues using dependent queries, and I believe we've tracked it down to the store values not updating immediately after calling .updateOptions()
and .setOptions()
.
I've created a REPL to demonstrate the issue here: https://svelte.dev/repl/458963582d5c4b828b6152d44eb95467
In this example, the query fetches https://jsonplaceholder.typicode.com/todos/${id}
, and the response has an id
value that matches the one in the request. I have a <select/>
element that changes which ID is being queried, and this reactively calls .setOptions()
$: query.setOptions({
queryFn: getTodo,
queryKey: keyFactory.todo(value)
})
but in other reactive calls depending on the id and results of this query still show a stale value immediately after setting this
$: {
if ($query.isSuccess && $query.data && `${$query.data.id}` !== value) alert("invalid") // this should never happen, but it does
}
I've also tried adding enable: false
to .setOptions()
, which should definitely not show data and .isSuccess
, but that, as well as .isError
and .isLoading
are also stale.
I tried combining these into one reactive block, but still the same issue
$: {
query.setOptions({
// enabled: false, // Happens even if query is immediately disabled
queryFn: getTodo,
queryKey: keyFactory.todo(value)
})
if ($query.data && `${$query.data.id}` !== value) {
alert(`data.id -> ${$query.data.id} !== ${value} <- value\nqueryKey:${JSON.stringify(keyFactory.todo(value))}\nisSuccess: ${$query.isSuccess}\nisLoading: ${$query.isLoading}`)
}
}
I thought this might be a Svelte limitation of reactive blocks and/or store updates, but I built a simple test store and can see the updated value immediately after: https://svelte.dev/repl/1a66de513c67498c978eeeb62bebaf57
$: {
console.log("BEFORE", $mystore)
mystore.add(parseInt(amt))
console.log("AFTER", $mystore)
}
Console:
"BEFORE" 0
"AFTER" 1
"BEFORE" 1
"AFTER" 6
At the very least, it that if the query is updated to a queryKey that isn't in the cache, the .data
should immediately be undefined
and .isSuccess
should be false