Skip to content

useQueries doesn’t call combine when StoragePersister deserializes data #9586

@iamakulov

Description

@iamakulov

Describe the bug

Take some queries that are 1) allowed to be stale, 2) are combined into something:

const ids = [1, 2, 3];
const combinedQueries = useQueries({
  queries: ids.map((id) => ({
    queryKey: ["post", id],
    queryFn: () => Promise.resolve(id),
    staleTime: 30_000, // ← 1️⃣
  })),
  combine: i => i, // ← 2️⃣
});

and 3) are persisted in localStorage:

const persister = createAsyncStoragePersister({ storage: window.localStorage });
const queryClient = new QueryClient();

<PersistQueryClientProvider
  client={queryClient}
  persistOptions={{ persister }}
>

In this setup, when the persister finishes deserializing the queries, and the queries aren’t stale yet, useQueries will not call combine (unless combine’s identity changes). As a result, combinedQueries will remain in isPending: true state until staleTime expires.

This only reproduces with a custom combine function, even if it simply returns the same value.

Your minimal, reproducible example

https://codesandbox.io/p/sandbox/wqrzzm

Steps to reproduce

To repro the issue:

  1. Open the codesandbox
  2. Confirm the preview shows “Pending: false, false, false. Data: 1, 2, 3”
  3. Reload the preview a few times
  4. Confirm the preview shows “Pending: true, true, true. Data: , ,” every time
The issue disappears if you pass a different `combine` on every render
  1. Unwrap combine on line 27 from useCallback
  2. Reload the preview a few times
  3. Confirm the preview shows “Pending: false, false, false. Data: 1, 2, 3” every time
The issue disappears if you don’t pass `combine` at all
  1. Remove combine on line 38
  2. Reload the preview a few times
  3. Confirm the preview shows “Pending: false, false, false. Data: 1, 2, 3” every time

Expected behavior

As a user, I expect to see “Pending: false, false, false. Data: 1, 2, 3” on every reload. However, I actually see “Pending: true, true, true. Data: , ,” starting with the second load.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

  • macOS 15.6
  • Chrome 139

Tanstack Query adapter

None

TanStack Query version

v5.85.5

TypeScript version

No response

Additional context

No response

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