Skip to content

BUG: Stale values after using .updateOptions() / .setOptions() #89

Open
@pzcfg

Description

@pzcfg

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions