test(preact-query-devtools/PreactQueryDevtools{,Panel}): add tests for the full prop wiring matrix by sukvvon · Pull Request #10852 · TanStack/query

sukvvon · 2026-06-01T01:25:05Z

🎯 Changes

Add test cases to both PreactQueryDevtools and PreactQueryDevtoolsPanel that cover the full prop wiring matrix, mirroring the matrix already in place for SolidQueryDevtools (#10823, #10824), SolidQueryDevtoolsPanel (#10827, #10828), and ReactQueryDevtools{,Panel} (#10851).

`PreactQueryDevtools`

initialIsOpen → setInitialIsOpen + default (false when omitted)
errorTypes → setErrorTypes + default ([] when omitted)
theme → setTheme
resolved QueryClient → setClient
constructor-only props (styleNonce, shadowDOMTarget, hideDisabledQueries)
unmount cleanup

`PreactQueryDevtoolsPanel`

onClose → setOnClose + default (no-op function when omitted)
errorTypes → setErrorTypes + default
theme → setTheme
resolved QueryClient → setClient
constructor-only props (styleNonce, shadowDOMTarget, hideDisabledQueries)
style merge contract (preserve default and override on conflict)
unmount cleanup

All cases follow the existing mock pattern (`vi.mock('@tanstack/query-devtools', ...)` with per-method spies), and style cases use `toHaveStyle` from @testing-library/jest-dom.

✅ 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
- Enhanced test coverage for PreactQueryDevtools with improved assertions for prop forwarding and default values.
- Expanded PreactQueryDevtoolsPanel test suite to validate configuration handling and component lifecycle behavior.

…r the full prop wiring matrix

coderabbitai · 2026-06-01T01:25:16Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 5e9123a5-fdbe-4ede-8b4d-1ef8afabebdd

📥 Commits

Reviewing files that changed from the base of the PR and between 9d488a1 and 8d40ef4.

📒 Files selected for processing (2)

packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx
packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx

📝 Walkthrough

Walkthrough

The PR expands test coverage for two Preact devtools wrapper components. Both test suites now import their underlying TanStack devtools dependencies as runtime values and add comprehensive test cases validating prop forwarding, constructor options, and lifecycle behavior.

Changes

Preact Devtools Component Tests

Layer / File(s)	Summary
PreactQueryDevtools prop forwarding tests `packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx`	Import of `TanstackQueryDevtools` switches to runtime value; test cases validate `initialIsOpen`, `errorTypes`, and `theme` forwarding with defaults; confirm `QueryClient` passes via `setClient`; validate constructor options (`styleNonce`, `shadowDOMTarget`, `hideDisabledQueries`); and verify `unmount` is called on component unmount.
PreactQueryDevtoolsPanel prop forwarding and lifecycle tests `packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx`	Import of `TanstackQueryDevtoolsPanel` switches to runtime value; test cases validate `onClose`, `errorTypes`, and `theme` forwarding with defaults; confirm `QueryClient` forwarding via `setClient`; validate constructor options (`styleNonce`, `shadowDOMTarget`, `hideDisabledQueries`); verify container height styling (default preservation and override); and ensure `unmount` is called on component unmount.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

TanStack/query#10818: Extends PreactQueryDevtools test suite to verify prop delegation into mocked TanstackQueryDevtools instances.
TanStack/query#10828: Adds devtoolsPanel test cases verifying the style merge contract for container height handling.
TanStack/query#10827: Extends devtools panel test cases verifying option forwarding and unmount lifecycle behavior.

Suggested labels

package: query-devtools

Poem

🐰 Tests that hop with certainty bright,
Props forwarding through devtools' sight,
Mocks unwrapped from type to runtime's might,
Every option checked, lifecycle tight—
Coverage bounds the feature in flight! ✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The PR title accurately summarizes the main change: adding comprehensive prop wiring tests for PreactQueryDevtools and PreactQueryDevtoolsPanel components.
Description check	✅ Passed	The PR description is comprehensive and well-structured, covering all test cases for both components, with clear organization and complete checklist responses.
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/preact-query-devtools-mirror-solid-wiring-matrix

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

nx-cloud · 2026-06-01T01:25:33Z

View your CI Pipeline Execution ↗ for commit c0926c9

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

☁️ Nx Cloud last updated this comment at 2026-06-01 01:30:03 UTC

github-actions · 2026-06-01T01:25:41Z

🚀 Changeset Version Preview

2 package(s) bumped directly, 23 bumped as dependents.

🟩 Patch bumps

Package	Version	Reason
`@tanstack/lit-query`	0.2.6 → 0.2.7	Changeset
`@tanstack/query-devtools`	5.100.14 → 5.100.15	Changeset
`@tanstack/angular-query-experimental`	5.100.14 → 5.100.15	Dependent
`@tanstack/angular-query-persist-client`	5.100.14 → 5.100.15	Dependent
`@tanstack/eslint-plugin-query`	5.100.14 → 5.100.15	Dependent
`@tanstack/preact-query`	5.100.14 → 5.100.15	Dependent
`@tanstack/preact-query-devtools`	5.100.14 → 5.100.15	Dependent
`@tanstack/preact-query-persist-client`	5.100.14 → 5.100.15	Dependent
`@tanstack/query-async-storage-persister`	5.100.14 → 5.100.15	Dependent
`@tanstack/query-broadcast-client-experimental`	5.100.14 → 5.100.15	Dependent
`@tanstack/query-core`	5.100.14 → 5.100.15	Dependent
`@tanstack/query-persist-client-core`	5.100.14 → 5.100.15	Dependent
`@tanstack/query-sync-storage-persister`	5.100.14 → 5.100.15	Dependent
`@tanstack/react-query`	5.100.14 → 5.100.15	Dependent
`@tanstack/react-query-devtools`	5.100.14 → 5.100.15	Dependent
`@tanstack/react-query-next-experimental`	5.100.14 → 5.100.15	Dependent
`@tanstack/react-query-persist-client`	5.100.14 → 5.100.15	Dependent
`@tanstack/solid-query`	5.100.14 → 5.100.15	Dependent
`@tanstack/solid-query-devtools`	5.100.14 → 5.100.15	Dependent
`@tanstack/solid-query-persist-client`	5.100.14 → 5.100.15	Dependent
`@tanstack/svelte-query`	6.1.33 → 6.1.34	Dependent
`@tanstack/svelte-query-devtools`	6.1.33 → 6.1.34	Dependent
`@tanstack/svelte-query-persist-client`	6.1.33 → 6.1.34	Dependent
`@tanstack/vue-query`	5.100.14 → 5.100.15	Dependent
`@tanstack/vue-query-devtools`	6.1.33 → 6.1.34	Dependent

pkg-pr-new · 2026-06-01T01:29:43Z

More templates

@tanstack/angular-query-experimental

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

@tanstack/eslint-plugin-query

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

@tanstack/lit-query

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

@tanstack/preact-query

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

@tanstack/preact-query-devtools

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

@tanstack/preact-query-persist-client

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

@tanstack/query-async-storage-persister

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

@tanstack/query-broadcast-client-experimental

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

@tanstack/query-core

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

@tanstack/query-devtools

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

@tanstack/query-persist-client-core

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

@tanstack/query-sync-storage-persister

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

@tanstack/react-query

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

@tanstack/react-query-devtools

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

@tanstack/react-query-next-experimental

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

@tanstack/react-query-persist-client

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

@tanstack/solid-query

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

@tanstack/solid-query-devtools

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

@tanstack/solid-query-persist-client

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

@tanstack/svelte-query

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

@tanstack/svelte-query-devtools

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

@tanstack/svelte-query-persist-client

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

@tanstack/vue-query

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

@tanstack/vue-query-devtools

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

commit: 8d40ef4

github-actions · 2026-06-01T01:30:03Z

size-limit report 📦

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

test(preact-query-devtools/PreactQueryDevtools{,Panel}): add tests fo…

c0926c9

…r the full prop wiring matrix

ci: apply automated fixes

8d40ef4

sukvvon self-assigned this Jun 1, 2026

sukvvon merged commit 1114d0b into main Jun 1, 2026
9 checks passed

sukvvon deleted the test/preact-query-devtools-mirror-solid-wiring-matrix branch June 1, 2026 01:33

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

test(preact-query-devtools/PreactQueryDevtools{,Panel}): add tests for the full prop wiring matrix#10852

test(preact-query-devtools/PreactQueryDevtools{,Panel}): add tests for the full prop wiring matrix#10852
sukvvon merged 2 commits into
mainfrom
test/preact-query-devtools-mirror-solid-wiring-matrix

sukvvon commented Jun 1, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented Jun 1, 2026 •

edited

Loading

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested labels

Poem

Uh oh!

nx-cloud Bot commented Jun 1, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Jun 1, 2026 •

edited

Loading

Uh oh!

pkg-pr-new Bot commented Jun 1, 2026

Uh oh!

github-actions Bot commented Jun 1, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Uh oh!

Conversation

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

Uh oh!

🎯 Changes

PreactQueryDevtools

PreactQueryDevtoolsPanel

✅ Checklist

🚀 Release Impact

Summary by CodeRabbit

Uh oh!

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

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested labels

Poem

Uh oh!

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

Uh oh!

Uh oh!

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

Uh oh!

🚀 Changeset Version Preview

🟩 Patch bumps

Uh oh!

pkg-pr-new Bot commented Jun 1, 2026

Uh oh!

github-actions Bot commented Jun 1, 2026

size-limit report 📦

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

sukvvon commented Jun 1, 2026 •

edited by coderabbitai Bot

Loading

`PreactQueryDevtools`

`PreactQueryDevtoolsPanel`

coderabbitai Bot commented Jun 1, 2026 •

edited

Loading

nx-cloud Bot commented Jun 1, 2026 •

edited

Loading

github-actions Bot commented Jun 1, 2026 •

edited

Loading