Visitar URL original
[svelte-query] A result key first read after the query settled stays stale: the component's copy refreshes only on a change of an already-tracked key · Issue #12485 · TanStack/query · GitHub
Skip to content

[svelte-query] A result key first read after the query settled stays stale: the component's copy refreshes only on a change of an already-tracked key #12485

Open

Description

@jatroconis

Versions: @tanstack/svelte-query 6.3.1, @tanstack/query-core 5.104.1, Svelte 5.

What happens

When notifyOnChangeProps is unset, createBaseQuery wraps the result in observer.trackResult(result) (createBaseQuery.svelte.js:29). QueryObserver.updateResult then notifies only when a key in #trackedProps changes (queryObserver.js:395-403).

The observer does add a key to its tracked set when a template first reads it. But the component's reactive copy is updated only through those notifications. If a query settles while the template has read only some of its keys, the update is skipped and the component keeps its copy of the old result. A key that the template reads later is then read from that stale copy, and nothing updates it again, because the query has already settled.

Minimal case

<script lang="ts">
  import { createQuery } from '@tanstack/svelte-query';

  const wait = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
  const a = createQuery(() => ({ queryKey: ['a'], queryFn: () => wait(300).then(() => 'a') }));
  const b = createQuery(() => ({ queryKey: ['b'], queryFn: () => Promise.resolve('b') }));
</script>

{#if a.isError || b.isError}
  <p>error</p>
{:else if a.data === undefined || b.data === undefined}
  <p>loading</p>
{:else}
  <p>{a.data} {b.data}</p>
{/if}

Expected: a b after about 300 ms.

Actual: loading stays forever. b settles first, while the template has read only b.isError, because the || short-circuits before b.data. The change to b.data doesn't notify, so the component's copy of b keeps data: undefined. When a settles, the template reads b.data from that stale copy.

Workaround

Set notifyOnChangeProps: 'all' in the client's default query options, or read every key before branching.

Suggestion

Pass onPropTracked to trackResult and refresh the component's copy when a key is first tracked, or skip tracking in the Svelte adapter, since Svelte already re-renders key by key.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

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