test({react,preact}-query/usePrefetchQuery): assert the 'Loading...' fallback is rendered before the prefetch resolves by sukvvon · Pull Request #11075 · TanStack/query

sukvvon · 2026-07-18T05:10:21Z

🎯 Changes

Adds an assertion right after the initial render that the Suspense 'Loading...' fallback is shown while the prefetched query is still in flight, in should prefetch query if query state does not exist for both react-query and preact-query. The same file's should not create a suspense waterfall if prefetch is fired test already follows this convention (checking fetchStatus/fallback text before advancing timers); this test was missing it.

✅ Checklist

I have followed the steps in the Contributing guide.
I have tested this code locally with pnpm run test:pr.

🚀 Release Impact

This change affects published code, and I have generated a changeset.
This change is docs/CI/dev-only (no release).

Summary by CodeRabbit

Tests
- Added/strengthened assertions to confirm the Suspense loading fallback (“Loading...”) appears immediately when prefetching a query without existing state.
- Updated coverage for both React and Preact integrations to better validate prefetch behavior during the initial render.

nx-cloud · 2026-07-18T05:10:45Z

View your CI Pipeline Execution ↗ for commit 78dbec4

Command	Status	Duration	Result
`nx affected --targets=test:sherif,test:knip,tes...`	✅ Succeeded	5m 15s	View ↗
`nx run-many --target=build --exclude=examples/*...`	✅ Succeeded	38s	View ↗

☁️ Nx Cloud last updated this comment at 2026-07-18 05:19:21 UTC

github-actions · 2026-07-18T05:11:31Z

🚀 Changeset Version Preview

No changeset entries found. Merging this PR will not cause a version bump for any packages.

coderabbitai · 2026-07-18T05:11:32Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: fff86090-40ea-485c-a4f9-ffe585932a18

📥 Commits

Reviewing files that changed from the base of the PR and between 78dbec4 and 092776c.

📒 Files selected for processing (2)

packages/preact-query/src/__tests__/usePrefetchQuery.test.tsx
packages/react-query/src/__tests__/usePrefetchQuery.test.tsx

🚧 Files skipped from review as they are similar to previous changes (2)

packages/react-query/src/tests/usePrefetchQuery.test.tsx
packages/preact-query/src/tests/usePrefetchQuery.test.tsx

📝 Walkthrough

Walkthrough

The React and Preact usePrefetchQuery tests now assert that the Loading... Suspense fallback appears immediately after rendering, before fake timers advance and prefetched data resolves.

Changes

Prefetch fallback tests

Layer / File(s)	Summary
Initial Suspense fallback validation `packages/preact-query/src/__tests__/usePrefetchQuery.test.tsx`, `packages/react-query/src/__tests__/usePrefetchQuery.test.tsx`	Both tests verify the `Loading...` fallback before advancing timers in the missing-query-state scenario.

Estimated code review effort: 1 (Trivial) | ~2 minutes

Possibly related PRs

TanStack/query#11049: Adds intermediate query-state assertions before advancing fake timers.
TanStack/query#11076: Adds an immediate Suspense fallback assertion in a related query test.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly matches the PR's main change: adding an assertion that the Loading fallback renders before prefetch resolves.
Description check	✅ Passed	The description follows the required template and includes changes, checklist, and release impact sections with relevant details.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch test/prefetch-query-loading-fallback-assertion

_{Comment @coderabbitai help to get the list of available commands.}

…fallback is rendered before the prefetch resolves

pkg-pr-new · 2026-07-18T05:16:21Z

More templates

@tanstack/angular-query-experimental

npm i https://pkg.pr.new/@tanstack/angular-query-experimental@11075

@tanstack/eslint-plugin-query

npm i https://pkg.pr.new/@tanstack/eslint-plugin-query@11075

@tanstack/lit-query

npm i https://pkg.pr.new/@tanstack/lit-query@11075

@tanstack/preact-query

npm i https://pkg.pr.new/@tanstack/preact-query@11075

@tanstack/preact-query-devtools

npm i https://pkg.pr.new/@tanstack/preact-query-devtools@11075

@tanstack/preact-query-persist-client

npm i https://pkg.pr.new/@tanstack/preact-query-persist-client@11075

@tanstack/query-async-storage-persister

npm i https://pkg.pr.new/@tanstack/query-async-storage-persister@11075

@tanstack/query-broadcast-client-experimental

npm i https://pkg.pr.new/@tanstack/query-broadcast-client-experimental@11075

@tanstack/query-core

npm i https://pkg.pr.new/@tanstack/query-core@11075

@tanstack/query-devtools

npm i https://pkg.pr.new/@tanstack/query-devtools@11075

@tanstack/query-persist-client-core

npm i https://pkg.pr.new/@tanstack/query-persist-client-core@11075

@tanstack/query-sync-storage-persister

npm i https://pkg.pr.new/@tanstack/query-sync-storage-persister@11075

@tanstack/react-query

npm i https://pkg.pr.new/@tanstack/react-query@11075

@tanstack/react-query-devtools

npm i https://pkg.pr.new/@tanstack/react-query-devtools@11075

@tanstack/react-query-next-experimental

npm i https://pkg.pr.new/@tanstack/react-query-next-experimental@11075

@tanstack/react-query-persist-client

npm i https://pkg.pr.new/@tanstack/react-query-persist-client@11075

@tanstack/solid-query

npm i https://pkg.pr.new/@tanstack/solid-query@11075

@tanstack/solid-query-devtools

npm i https://pkg.pr.new/@tanstack/solid-query-devtools@11075

@tanstack/solid-query-persist-client

npm i https://pkg.pr.new/@tanstack/solid-query-persist-client@11075

@tanstack/svelte-query

npm i https://pkg.pr.new/@tanstack/svelte-query@11075

@tanstack/svelte-query-devtools

npm i https://pkg.pr.new/@tanstack/svelte-query-devtools@11075

@tanstack/svelte-query-persist-client

npm i https://pkg.pr.new/@tanstack/svelte-query-persist-client@11075

@tanstack/vue-query

npm i https://pkg.pr.new/@tanstack/vue-query@11075

@tanstack/vue-query-devtools

npm i https://pkg.pr.new/@tanstack/vue-query-devtools@11075

commit: 092776c

github-actions · 2026-07-18T05:17:13Z

size-limit report 📦

Path	Size
react full	12.13 KB (0%)
react minimal	9.08 KB (0%)

sukvvon changed the title ~~test(react-query,preact-query/usePrefetchQuery): assert the 'Loading...' fallback is rendered before the prefetch resolves~~test({react,preact}-query/usePrefetchQuery): assert the 'Loading...' fallback is rendered before the prefetch resolvesJul 18, 2026

test({react,preact}-query/usePrefetchQuery): assert the 'Loading...' …
092776c
…fallback is rendered before the prefetch resolves

sukvvon force-pushed the test/prefetch-query-loading-fallback-assertion branch from 78dbec4 to 092776cCompare July 18, 2026 05:12

sukvvon self-assigned this Jul 18, 2026

coderabbitaiBot mentioned this pull request Jul 18, 2026
test({react,preact}-query/useSuspenseQuery): assert the 'loading' fallback is rendered when gcTime is 0 #11076
Merged
4 tasks

sukvvon merged commit b9c657e into mainJul 18, 2026
9 checks passed

sukvvon deleted the test/prefetch-query-loading-fallback-assertion branch July 18, 2026 05:47

This was referenced Jul 18, 2026
test({react,preact}-query/usePrefetchQuery): inline the shared 'Suspended' component into each test #11077
Merged
test({react,preact}-query/usePrefetchQuery): inline the 'generateQueryFn' factory into each call site #11080
Merged

Navigation Menu

Uh oh!

Uh oh!

test({react,preact}-query/usePrefetchQuery): assert the 'Loading...' fallback is rendered before the prefetch resolves - #11075

test({react,preact}-query/usePrefetchQuery): assert the 'Loading...' fallback is rendered before the prefetch resolves#11075
sukvvon merged 1 commit into
mainfrom
test/prefetch-query-loading-fallback-assertion

sukvvon commented Jul 18, 2026•
edited by coderabbitai Bot
Loading

Uh oh!

nx-cloudBot commented Jul 18, 2026•
edited
Loading

Uh oh!

github-actionsBot commented Jul 18, 2026

Uh oh!

coderabbitaiBot commented Jul 18, 2026•
edited
Loading

Walkthrough

Changes

Uh oh!

pkg-pr-newBot commented Jul 18, 2026

Uh oh!

github-actionsBot commented Jul 18, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Uh oh!

Uh oh!

Conversation

sukvvon commented Jul 18, 2026• edited by coderabbitai BotLoading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🎯 Changes

✅ Checklist

🚀 Release Impact

Summary by CodeRabbit

Uh oh!

nx-cloudBot commented Jul 18, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actionsBot commented Jul 18, 2026

🚀 Changeset Version Preview

Uh oh!

coderabbitaiBot commented Jul 18, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Uh oh!

pkg-pr-newBot commented Jul 18, 2026

Uh oh!

github-actionsBot commented Jul 18, 2026

size-limit report 📦

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

sukvvon commented Jul 18, 2026•
edited by coderabbitai Bot
Loading

nx-cloudBot commented Jul 18, 2026•
edited
Loading

coderabbitaiBot commented Jul 18, 2026•
edited
Loading