From e1173ac5dc863643744766588086a4504e0d180d Mon Sep 17 00:00:00 2001 From: Wonsuk Choi Date: Sun, 3 May 2026 13:07:14 +0900 Subject: [PATCH 1/3] test(preact-query-devtools): add tests for missing 'QueryClient', context provider, 'client' prop, and production fallback --- packages/preact-query-devtools/package.json | 2 + .../__tests__/PreactQueryDevtools.test.tsx | 65 ++++++++++++++++++ .../PreactQueryDevtoolsPanel.test.tsx | 67 +++++++++++++++++++ 3 files changed, 134 insertions(+) create mode 100644 packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx create mode 100644 packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx diff --git a/packages/preact-query-devtools/package.json b/packages/preact-query-devtools/package.json index cbcbe3f9493..f9a03c29dee 100644 --- a/packages/preact-query-devtools/package.json +++ b/packages/preact-query-devtools/package.json @@ -27,6 +27,8 @@ "test:types:ts59": "node ../../node_modules/typescript59/lib/tsc.js --build tsconfig.legacy.json", "test:types:tscurrent": "tsc --build", "test:types:ts60": "node ../../node_modules/typescript60/lib/tsc.js --build tsconfig.legacy.json", + "test:lib": "vitest", + "test:lib:dev": "pnpm run test:lib --watch", "test:build": "publint --strict && attw --pack", "build": "tsup --tsconfig tsconfig.prod.json", "build:dev": "tsup --watch" diff --git a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx new file mode 100644 index 00000000000..7d60f59813e --- /dev/null +++ b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx @@ -0,0 +1,65 @@ +import { describe, expect, it, vi } from 'vitest' +import { render } from '@testing-library/preact' +import { QueryClient, QueryClientProvider } from '@tanstack/preact-query' +import type { TanstackQueryDevtools } from '@tanstack/query-devtools' + +const mountMock = vi.fn() +const unmountMock = vi.fn() +const setClientMock = vi.fn() +const setButtonPositionMock = vi.fn() +const setPositionMock = vi.fn() +const setInitialIsOpenMock = vi.fn() +const setErrorTypesMock = vi.fn() +const setThemeMock = vi.fn() + +vi.mock('@tanstack/query-devtools', () => ({ + TanstackQueryDevtools: vi.fn(function (this: TanstackQueryDevtools) { + this.mount = mountMock + this.unmount = unmountMock + this.setClient = setClientMock + this.setButtonPosition = setButtonPositionMock + this.setPosition = setPositionMock + this.setInitialIsOpen = setInitialIsOpenMock + this.setErrorTypes = setErrorTypesMock + this.setTheme = setThemeMock + }), +})) + +describe('PreactQueryDevtools', () => { + it('should throw an error if no query client has been set', async () => { + const { PreactQueryDevtools } = await import('../PreactQueryDevtools') + + expect(() => render()).toThrow( + 'No QueryClient set, use QueryClientProvider to set one', + ) + }) + + it('should not throw an error if query client is provided via context', async () => { + const { PreactQueryDevtools } = await import('../PreactQueryDevtools') + const queryClient = new QueryClient() + + expect(() => + render( + + + , + ), + ).not.toThrow() + }) + + it('should not throw an error if query client is provided via props', async () => { + const { PreactQueryDevtools } = await import('../PreactQueryDevtools') + const queryClient = new QueryClient() + + expect(() => + render(), + ).not.toThrow() + }) + + it('should return null in non-development environments', async () => { + const { PreactQueryDevtools } = await import('..') + + expect(process.env.NODE_ENV).not.toBe('development') + expect(PreactQueryDevtools({})).toBeNull() + }) +}) diff --git a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx new file mode 100644 index 00000000000..f0093d4b559 --- /dev/null +++ b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx @@ -0,0 +1,67 @@ +import { describe, expect, it, vi } from 'vitest' +import { render } from '@testing-library/preact' +import { QueryClient, QueryClientProvider } from '@tanstack/preact-query' +import type { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools' + +const mountMock = vi.fn() +const unmountMock = vi.fn() +const setClientMock = vi.fn() +const setOnCloseMock = vi.fn() +const setErrorTypesMock = vi.fn() +const setThemeMock = vi.fn() + +vi.mock('@tanstack/query-devtools', () => ({ + TanstackQueryDevtoolsPanel: vi.fn(function (this: TanstackQueryDevtoolsPanel) { + this.mount = mountMock + this.unmount = unmountMock + this.setClient = setClientMock + this.setOnClose = setOnCloseMock + this.setErrorTypes = setErrorTypesMock + this.setTheme = setThemeMock + }), +})) + +describe('PreactQueryDevtoolsPanel', () => { + it('should throw an error if no query client has been set', async () => { + const { PreactQueryDevtoolsPanel } = await import( + '../PreactQueryDevtoolsPanel' + ) + + expect(() => render()).toThrow( + 'No QueryClient set, use QueryClientProvider to set one', + ) + }) + + it('should not throw an error if query client is provided via context', async () => { + const { PreactQueryDevtoolsPanel } = await import( + '../PreactQueryDevtoolsPanel' + ) + const queryClient = new QueryClient() + + expect(() => + render( + + + , + ), + ).not.toThrow() + }) + + it('should not throw an error if query client is provided via props', async () => { + const { PreactQueryDevtoolsPanel } = await import( + '../PreactQueryDevtoolsPanel' + ) + const queryClient = new QueryClient() + + expect(() => + render(), + ).not.toThrow() + }) + + it('should return null in non-development environments', async () => { + const { PreactQueryDevtoolsPanel } = await import('..') + + expect(process.env.NODE_ENV).not.toBe('development') + expect(PreactQueryDevtoolsPanel({})).toBeNull() + }) +}) From 02c68b28c29b7124c3d7cd81e7f462c7728ffe5f Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Sun, 3 May 2026 04:08:51 +0000 Subject: [PATCH 2/3] ci: apply automated fixes --- .../PreactQueryDevtoolsPanel.test.tsx | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx index f0093d4b559..a8ba974b97a 100644 --- a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx +++ b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx @@ -11,7 +11,9 @@ const setErrorTypesMock = vi.fn() const setThemeMock = vi.fn() vi.mock('@tanstack/query-devtools', () => ({ - TanstackQueryDevtoolsPanel: vi.fn(function (this: TanstackQueryDevtoolsPanel) { + TanstackQueryDevtoolsPanel: vi.fn(function ( + this: TanstackQueryDevtoolsPanel, + ) { this.mount = mountMock this.unmount = unmountMock this.setClient = setClientMock @@ -23,9 +25,8 @@ vi.mock('@tanstack/query-devtools', () => ({ describe('PreactQueryDevtoolsPanel', () => { it('should throw an error if no query client has been set', async () => { - const { PreactQueryDevtoolsPanel } = await import( - '../PreactQueryDevtoolsPanel' - ) + const { PreactQueryDevtoolsPanel } = + await import('../PreactQueryDevtoolsPanel') expect(() => render()).toThrow( 'No QueryClient set, use QueryClientProvider to set one', @@ -33,9 +34,8 @@ describe('PreactQueryDevtoolsPanel', () => { }) it('should not throw an error if query client is provided via context', async () => { - const { PreactQueryDevtoolsPanel } = await import( - '../PreactQueryDevtoolsPanel' - ) + const { PreactQueryDevtoolsPanel } = + await import('../PreactQueryDevtoolsPanel') const queryClient = new QueryClient() expect(() => @@ -48,9 +48,8 @@ describe('PreactQueryDevtoolsPanel', () => { }) it('should not throw an error if query client is provided via props', async () => { - const { PreactQueryDevtoolsPanel } = await import( - '../PreactQueryDevtoolsPanel' - ) + const { PreactQueryDevtoolsPanel } = + await import('../PreactQueryDevtoolsPanel') const queryClient = new QueryClient() expect(() => From 1c5596d8b7f7b2efa4d08b1b6421efbbce2cb900 Mon Sep 17 00:00:00 2001 From: Wonsuk Choi Date: Sun, 3 May 2026 13:45:04 +0900 Subject: [PATCH 3/3] test(preact-query-devtools): assert 'mount' call in client provisioning tests --- .../src/__tests__/PreactQueryDevtools.test.tsx | 8 +++++++- .../src/__tests__/PreactQueryDevtoolsPanel.test.tsx | 8 +++++++- 2 files changed, 14 insertions(+), 2 deletions(-) diff --git a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx index 7d60f59813e..ad60e9c3d0d 100644 --- a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx +++ b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx @@ -1,4 +1,4 @@ -import { describe, expect, it, vi } from 'vitest' +import { beforeEach, describe, expect, it, vi } from 'vitest' import { render } from '@testing-library/preact' import { QueryClient, QueryClientProvider } from '@tanstack/preact-query' import type { TanstackQueryDevtools } from '@tanstack/query-devtools' @@ -26,6 +26,10 @@ vi.mock('@tanstack/query-devtools', () => ({ })) describe('PreactQueryDevtools', () => { + beforeEach(() => { + vi.clearAllMocks() + }) + it('should throw an error if no query client has been set', async () => { const { PreactQueryDevtools } = await import('../PreactQueryDevtools') @@ -45,6 +49,7 @@ describe('PreactQueryDevtools', () => { , ), ).not.toThrow() + expect(mountMock).toHaveBeenCalled() }) it('should not throw an error if query client is provided via props', async () => { @@ -54,6 +59,7 @@ describe('PreactQueryDevtools', () => { expect(() => render(), ).not.toThrow() + expect(mountMock).toHaveBeenCalled() }) it('should return null in non-development environments', async () => { diff --git a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx index a8ba974b97a..66930e5bd5a 100644 --- a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx +++ b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx @@ -1,4 +1,4 @@ -import { describe, expect, it, vi } from 'vitest' +import { beforeEach, describe, expect, it, vi } from 'vitest' import { render } from '@testing-library/preact' import { QueryClient, QueryClientProvider } from '@tanstack/preact-query' import type { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools' @@ -24,6 +24,10 @@ vi.mock('@tanstack/query-devtools', () => ({ })) describe('PreactQueryDevtoolsPanel', () => { + beforeEach(() => { + vi.clearAllMocks() + }) + it('should throw an error if no query client has been set', async () => { const { PreactQueryDevtoolsPanel } = await import('../PreactQueryDevtoolsPanel') @@ -45,6 +49,7 @@ describe('PreactQueryDevtoolsPanel', () => { , ), ).not.toThrow() + expect(mountMock).toHaveBeenCalled() }) it('should not throw an error if query client is provided via props', async () => { @@ -55,6 +60,7 @@ describe('PreactQueryDevtoolsPanel', () => { expect(() => render(), ).not.toThrow() + expect(mountMock).toHaveBeenCalled() }) it('should return null in non-development environments', async () => {