Skip to content

A Prefetched Infinity State Time Query Gets Fetched Again on Mount #8482

Closed as not planned
@kivvvvv

Description

@kivvvvv

Describe the bug

A prefetched query with staleTime of Infinity always triggers an unexpected fetch again when the component with suspenseful query(staleTime: 0) is mounted.

Steps to reproduce

I would like to achieve these following requirements(a very contrived one):

  1. Display a post list 1 to 3.
  2. Initially display the details of the first post.
  3. When the user clicks a list, always fetches the latest details.

I have provided an example here(StackBlitz): A Prefetched Infinity State Time Query Gets Fetched Again on Mount

Here is how I achieved those requirements:

  1. For "Display a post list 1 to 3", I render(hardcoded) a list of 3 posts.
  2. For "Initially display the details of the first post" I have read Prefetching & Router Integration. I know that the first post details will be needed ahead of time, so I prefetch early in the Suspense tree with the queryClient.defaultOptions.queries.staleTime of Infinity to avoid any refetching of a query down the Suspense tree.
  3. For "When the user clicks a list, always fetches the latest details" I use a state of a selected post id as a query key of a suspenseful post query with staleTime of 0.

Expected behavior

The behavior seems to be as expected, but when I observed the network request, there are 2 unexpected requests for the first post(instead of only one request). If I try to make the post query to have staleTime of non-zero for example Infinity there would be only 1 request but I lose the ability to always fetch for the latest post.

How often does this bug happen?

Every time

Platform

  • OS: macOS
  • Browser: Chrome
  • Version: 131.0.6778.205 (Official Build) (arm64)

TanStack Query version

v5.62.11

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions