test(query-devtools/Devtools): add tests for online toggle by sukvvon · Pull Request #10692 · TanStack/query

sukvvon · 2026-05-11T01:37:36Z

🎯 Changes

Adds a test for the online toggle button in Devtools.tsx:

should swap the toggle label after the offline button is clicked

✅ 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 a test suite for the Devtools online/offline toggle, verifying the control toggles and its label updates to reflect offline mocking state.

coderabbitai · 2026-05-11T01:37:49Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: c0a6dd1d-5add-4348-83bb-cabd86fb2169

📥 Commits

Reviewing files that changed from the base of the PR and between 18ded1a and 585c5e2.

📒 Files selected for processing (1)

packages/query-devtools/src/__tests__/Devtools.test.tsx

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

packages/query-devtools/src/tests/Devtools.test.tsx

📝 Walkthrough

Walkthrough

This PR adds a test suite validating the Devtools "online/offline" toggle behavior. The tests verify that clicking the offline mock button updates onlineManager to offline status and changes the toggle label to reflect the new state.

Changes

Devtools Online Toggle Tests

Layer / File(s)	Summary
Online Toggle Test Suite `packages/query-devtools/src/__tests__/Devtools.test.tsx`	New `describe('online toggle')` test block verifies that clicking the offline mock button sets `onlineManager.isOnline()` to `false` and updates the toggle label to "Unset offline mocking behavior".

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Poem

🐰 A toggle so fine, now tested with care,
Mock offline behavior—the tests are all there!
Click once, go dark, let onlineManager know,
Labels that shimmer with each toggle flow! 🌙✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes the main change: adding tests for the online toggle functionality in the Devtools component.
Description check	✅ Passed	The description follows the template structure with all required sections completed: changes are described, the checklist is properly filled out, and release impact is correctly marked as dev-only.
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.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ 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/query-devtools-devtools-online-toggle

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

nx-cloud · 2026-05-11T01:38:08Z

View your CI Pipeline Execution ↗ for commit 18ded1a

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

☁️ Nx Cloud last updated this comment at 2026-05-11 01:44:02 UTC

github-actions · 2026-05-11T01:38:16Z

🚀 Changeset Version Preview

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

…nager" offline' covered by label swap test

pkg-pr-new · 2026-05-11T01:42:17Z

More templates

@tanstack/angular-query-experimental

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

@tanstack/eslint-plugin-query

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

@tanstack/lit-query

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

@tanstack/preact-query

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

@tanstack/preact-query-devtools

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

@tanstack/preact-query-persist-client

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

@tanstack/query-async-storage-persister

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

@tanstack/query-broadcast-client-experimental

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

@tanstack/query-core

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

@tanstack/query-devtools

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

@tanstack/query-persist-client-core

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

@tanstack/query-sync-storage-persister

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

@tanstack/react-query

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

@tanstack/react-query-devtools

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

@tanstack/react-query-next-experimental

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

@tanstack/react-query-persist-client

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

@tanstack/solid-query

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

@tanstack/solid-query-devtools

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

@tanstack/solid-query-persist-client

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

@tanstack/svelte-query

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

@tanstack/svelte-query-devtools

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

@tanstack/svelte-query-persist-client

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

@tanstack/vue-query

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

@tanstack/vue-query-devtools

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

commit: 585c5e2

github-actions · 2026-05-11T01:42:29Z

size-limit report 📦

Path	Size
react full	12.1 KB (0%)
react minimal	9.07 KB (0%)

test(query-devtools/Devtools): add tests for online toggle

18ded1a

github-actions Bot added the package: query-devtools label May 11, 2026

test(query-devtools/Devtools): remove redundant 'should set "onlineMa…

585c5e2

…nager" offline' covered by label swap test

sukvvon merged commit c84c9d0 into main May 11, 2026
8 checks passed

sukvvon deleted the test/query-devtools-devtools-online-toggle branch May 11, 2026 01:47

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

test(query-devtools/Devtools): add tests for online toggle#10692

test(query-devtools/Devtools): add tests for online toggle#10692
sukvvon merged 2 commits intomainfrom
test/query-devtools-devtools-online-toggle

sukvvon commented May 11, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented May 11, 2026 •

edited

Loading

Walkthrough

Changes

Estimated code review effort

Poem

Uh oh!

nx-cloud Bot commented May 11, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented May 11, 2026 •

edited

Loading

Uh oh!

pkg-pr-new Bot commented May 11, 2026

Uh oh!

github-actions Bot commented May 11, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Uh oh!

Conversation

sukvvon commented May 11, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🎯 Changes

✅ Checklist

🚀 Release Impact

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented May 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Poem

Uh oh!

nx-cloud Bot commented May 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented May 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🚀 Changeset Version Preview

Uh oh!

pkg-pr-new Bot commented May 11, 2026

Uh oh!

github-actions Bot commented May 11, 2026

size-limit report 📦

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

sukvvon commented May 11, 2026 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented May 11, 2026 •

edited

Loading

nx-cloud Bot commented May 11, 2026 •

edited

Loading

github-actions Bot commented May 11, 2026 •

edited

Loading