Skip to content

Conversation

@sukvvon
Copy link
Contributor

@sukvvon sukvvon commented Dec 28, 2025

🎯 Changes

Add useQueries test for SSR in ssr.test.tsx.

✅ 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

  • New Features

    • useQueries hook is now available in the public API for managing multiple queries simultaneously
    • Supports server-side rendering with data prefetching for multiple queries
  • Tests

    • Added test coverage for useQueries in server-side rendering scenarios, verifying successful data retrieval and cache behavior

✏️ Tip: You can customize this high-level summary in your review settings.

@changeset-bot
Copy link

changeset-bot bot commented Dec 28, 2025

⚠️ No Changeset found

Latest commit: 73e67fc

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Dec 28, 2025

📝 Walkthrough

Walkthrough

A new SSR test case for the useQueries hook has been added to verify server-side rendering behavior with multiple cached queries. The useQueries function is now exported from the react-query public API module.

Changes

Cohort / File(s) Summary
Test Coverage
packages/react-query/src/__tests__/ssr.test.tsx
Added new SSR test case that exercises useQueries with prefetching, cache retrieval, and assertion of success statuses and data values from cached queries.
Public API Export
packages/react-query/src/index.ts
Exported useQueries function to make it available in the public module interface.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Suggested labels

package: react-query

Suggested reviewers

  • TkDodo
  • manudeli

Poem

A query hook, twice paired in test,
SSR'd, then put to rest,
Cache whispers soft, data flows true,
Now exported for all to use! 🐰✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
✅ Passed checks (2 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly and concisely describes the main change: adding a useQueries test for SSR in the react-query package.
Description check ✅ Passed The description follows the required template structure with all sections completed: Changes, Checklist (both items checked), and Release Impact (correctly marked as dev-only).
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

📜 Recent review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 5810292 and 73e67fc.

📒 Files selected for processing (1)
  • packages/react-query/src/__tests__/ssr.test.tsx
🧰 Additional context used
🧠 Learnings (3)
📓 Common learnings
Learnt from: sukvvon
Repo: TanStack/query PR: 9892
File: packages/solid-query-persist-client/src/__tests__/PersistQueryClientProvider.test.tsx:331-335
Timestamp: 2025-11-22T09:06:05.219Z
Learning: In TanStack/query test files, when a queryFn contains side effects (e.g., setting flags for test verification), prefer async/await syntax for clarity; when there are no side effects, prefer the .then() pattern for conciseness.
📚 Learning: 2025-11-22T09:06:05.219Z
Learnt from: sukvvon
Repo: TanStack/query PR: 9892
File: packages/solid-query-persist-client/src/__tests__/PersistQueryClientProvider.test.tsx:331-335
Timestamp: 2025-11-22T09:06:05.219Z
Learning: In TanStack/query test files, when a queryFn contains side effects (e.g., setting flags for test verification), prefer async/await syntax for clarity; when there are no side effects, prefer the .then() pattern for conciseness.

Applied to files:

  • packages/react-query/src/__tests__/ssr.test.tsx
📚 Learning: 2025-08-19T03:18:18.303Z
Learnt from: oscartbeaumont
Repo: TanStack/query PR: 9564
File: packages/solid-query-devtools/src/production.tsx:2-3
Timestamp: 2025-08-19T03:18:18.303Z
Learning: In the solid-query-devtools package, the codebase uses a pattern of type-only default imports combined with typeof for component type annotations (e.g., `import type SolidQueryDevtoolsComp from './devtools'` followed by `typeof SolidQueryDevtoolsComp`). This pattern is consistently used across index.tsx and production.tsx files, and the maintainers prefer consistency over changing this approach.

Applied to files:

  • packages/react-query/src/__tests__/ssr.test.tsx
🧬 Code graph analysis (1)
packages/react-query/src/__tests__/ssr.test.tsx (2)
packages/query-core/src/queriesObserver.ts (1)
  • queries (235-268)
packages/react-query/src/useQueries.ts (1)
  • useQueries (208-332)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
  • GitHub Check: Test
  • GitHub Check: Preview
🔇 Additional comments (2)
packages/react-query/src/__tests__/ssr.test.tsx (2)

10-10: LGTM! Import addition is correct.

The useQueries import is properly added and alphabetically ordered within the import statement.


178-218: Excellent SSR test coverage for useQueries!

The test is well-structured and follows the established patterns in the file:

  • Query functions correctly use the .then() pattern without side effects (as per learnings)
  • Proper prefetching of both queries ensures data is available in cache
  • Timer advancement allows async operations to complete
  • Assertions verify both status and data for multiple queries
  • Appropriate cleanup with queryCache.clear()

This test effectively verifies that useQueries can retrieve multiple queries from the cache during server-side rendering, complementing the existing SSR tests for useQuery and useInfiniteQuery.


Comment @coderabbitai help to get the list of available commands and usage tips.

@nx-cloud
Copy link

nx-cloud bot commented Dec 28, 2025

View your CI Pipeline Execution ↗ for commit 73e67fc

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

☁️ Nx Cloud last updated this comment at 2025-12-28 07:23:12 UTC

@pkg-pr-new
Copy link

pkg-pr-new bot commented Dec 28, 2025

More templates

@tanstack/angular-query-experimental

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

@tanstack/eslint-plugin-query

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

@tanstack/query-async-storage-persister

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

@tanstack/query-broadcast-client-experimental

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

@tanstack/query-core

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

@tanstack/query-devtools

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

@tanstack/query-persist-client-core

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

@tanstack/query-sync-storage-persister

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

@tanstack/react-query

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

@tanstack/react-query-devtools

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

@tanstack/react-query-next-experimental

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

@tanstack/react-query-persist-client

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

@tanstack/solid-query

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

@tanstack/solid-query-devtools

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

@tanstack/solid-query-persist-client

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

@tanstack/svelte-query

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

@tanstack/svelte-query-devtools

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

@tanstack/svelte-query-persist-client

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

@tanstack/vue-query

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

@tanstack/vue-query-devtools

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

commit: 73e67fc

@codecov
Copy link

codecov bot commented Dec 28, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 83.91%. Comparing base (f64ac77) to head (73e67fc).
⚠️ Report is 4 commits behind head on main.

Additional details and impacted files

Impacted file tree graph

@@             Coverage Diff             @@
##             main    #9996       +/-   ##
===========================================
+ Coverage   45.89%   83.91%   +38.02%     
===========================================
  Files         200       26      -174     
  Lines        8437      373     -8064     
  Branches     1933      110     -1823     
===========================================
- Hits         3872      313     -3559     
+ Misses       4116       51     -4065     
+ Partials      449        9      -440     
Components Coverage Δ
@tanstack/angular-query-experimental ∅ <ø> (∅)
@tanstack/eslint-plugin-query ∅ <ø> (∅)
@tanstack/query-async-storage-persister ∅ <ø> (∅)
@tanstack/query-broadcast-client-experimental ∅ <ø> (∅)
@tanstack/query-codemods ∅ <ø> (∅)
@tanstack/query-core ∅ <ø> (∅)
@tanstack/query-devtools ∅ <ø> (∅)
@tanstack/query-persist-client-core ∅ <ø> (∅)
@tanstack/query-sync-storage-persister ∅ <ø> (∅)
@tanstack/query-test-utils ∅ <ø> (∅)
@tanstack/react-query 96.34% <ø> (+0.33%) ⬆️
@tanstack/react-query-devtools 9.25% <ø> (ø)
@tanstack/react-query-next-experimental ∅ <ø> (∅)
@tanstack/react-query-persist-client 100.00% <ø> (ø)
@tanstack/solid-query ∅ <ø> (∅)
@tanstack/solid-query-devtools ∅ <ø> (∅)
@tanstack/solid-query-persist-client ∅ <ø> (∅)
@tanstack/svelte-query ∅ <ø> (∅)
@tanstack/svelte-query-devtools ∅ <ø> (∅)
@tanstack/svelte-query-persist-client ∅ <ø> (∅)
@tanstack/vue-query ∅ <ø> (∅)
@tanstack/vue-query-devtools ∅ <ø> (∅)
🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

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

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant