From 8af6d5bf7adacfb56ba41d5b762449115fe805d1 Mon Sep 17 00:00:00 2001 From: Wonsuk Choi Date: Mon, 11 May 2026 00:49:35 +0900 Subject: [PATCH 1/4] test(query-devtools/Devtools): add tests for mutation details, sort order, and filter --- .../src/__tests__/Devtools.test.tsx | 55 +++++++++++++++++++ 1 file changed, 55 insertions(+) diff --git a/packages/query-devtools/src/__tests__/Devtools.test.tsx b/packages/query-devtools/src/__tests__/Devtools.test.tsx index 1be852b2dd..4efe3115e6 100644 --- a/packages/query-devtools/src/__tests__/Devtools.test.tsx +++ b/packages/query-devtools/src/__tests__/Devtools.test.tsx @@ -575,4 +575,59 @@ describe('Devtools', () => { ) }) }) + + describe('mutation details', () => { + it('should open the mutation details panel when a mutation row is clicked', async () => { + const rendered = renderDevtools({ initialIsOpen: true }) + + fireEvent.click(rendered.getByText('Mutations')) + + const mutation = queryClient.getMutationCache().build(queryClient, { + mutationKey: ['mutation-detail'], + mutationFn: () => Promise.resolve('ok'), + }) + mutation.execute({}) + await vi.advanceTimersByTimeAsync(0) + + fireEvent.click(rendered.getByLabelText(/Mutation submitted at/)) + + expect(rendered.getByText('Mutation Details')).toBeInTheDocument() + }) + }) + + describe('mutation sort order', () => { + it('should toggle the mutation sort order in the mutations view', () => { + const rendered = renderDevtools({ initialIsOpen: true }) + fireEvent.click(rendered.getByText('Mutations')) + + fireEvent.click(rendered.getByLabelText(/Sort order/)) + + expect( + localStorage.getItem('TanstackQueryDevtools.mutationSortOrder'), + ).not.toBeNull() + }) + }) + + describe('mutation filter', () => { + it('should filter mutations by their submission timestamp', async () => { + const rendered = renderDevtools({ initialIsOpen: true }) + fireEvent.click(rendered.getByText('Mutations')) + + const mutation = queryClient.getMutationCache().build(queryClient, { + mutationKey: ['filter-test'], + mutationFn: () => Promise.resolve('ok'), + }) + mutation.execute({}) + await vi.advanceTimersByTimeAsync(0) + + fireEvent.input( + rendered.getByLabelText('Filter queries by query key'), + { target: { value: 'filter-test' } }, + ) + + expect( + rendered.getByLabelText(/Mutation submitted at/), + ).toBeInTheDocument() + }) + }) }) From 428fa5441d80f638fac9b77a4d3fa8315855c9a6 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Sun, 10 May 2026 15:51:03 +0000 Subject: [PATCH 2/4] ci: apply automated fixes --- packages/query-devtools/src/__tests__/Devtools.test.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/packages/query-devtools/src/__tests__/Devtools.test.tsx b/packages/query-devtools/src/__tests__/Devtools.test.tsx index 4efe3115e6..10064cd3b9 100644 --- a/packages/query-devtools/src/__tests__/Devtools.test.tsx +++ b/packages/query-devtools/src/__tests__/Devtools.test.tsx @@ -620,10 +620,9 @@ describe('Devtools', () => { mutation.execute({}) await vi.advanceTimersByTimeAsync(0) - fireEvent.input( - rendered.getByLabelText('Filter queries by query key'), - { target: { value: 'filter-test' } }, - ) + fireEvent.input(rendered.getByLabelText('Filter queries by query key'), { + target: { value: 'filter-test' }, + }) expect( rendered.getByLabelText(/Mutation submitted at/), From 370af000f9154e66be30b8a381cd8bff565b3e2a Mon Sep 17 00:00:00 2001 From: Wonsuk Choi Date: Mon, 11 May 2026 01:06:36 +0900 Subject: [PATCH 3/4] test(query-devtools/Devtools): assert toggled value of 'mutationSortOrder' and exclusion in mutation filter --- .../src/__tests__/Devtools.test.tsx | 35 +++++++++++++------ 1 file changed, 25 insertions(+), 10 deletions(-) diff --git a/packages/query-devtools/src/__tests__/Devtools.test.tsx b/packages/query-devtools/src/__tests__/Devtools.test.tsx index 10064cd3b9..8e0570960a 100644 --- a/packages/query-devtools/src/__tests__/Devtools.test.tsx +++ b/packages/query-devtools/src/__tests__/Devtools.test.tsx @@ -601,32 +601,47 @@ describe('Devtools', () => { fireEvent.click(rendered.getByText('Mutations')) fireEvent.click(rendered.getByLabelText(/Sort order/)) + const afterFirstToggle = localStorage.getItem( + 'TanstackQueryDevtools.mutationSortOrder', + ) + expect(afterFirstToggle).not.toBeNull() - expect( - localStorage.getItem('TanstackQueryDevtools.mutationSortOrder'), - ).not.toBeNull() + fireEvent.click(rendered.getByLabelText(/Sort order/)) + const afterSecondToggle = localStorage.getItem( + 'TanstackQueryDevtools.mutationSortOrder', + ) + expect(afterSecondToggle).not.toBe(afterFirstToggle) }) }) describe('mutation filter', () => { - it('should filter mutations by their submission timestamp', async () => { + it('should filter mutations by their "mutationKey"', async () => { const rendered = renderDevtools({ initialIsOpen: true }) fireEvent.click(rendered.getByText('Mutations')) - const mutation = queryClient.getMutationCache().build(queryClient, { - mutationKey: ['filter-test'], + const matching = queryClient.getMutationCache().build(queryClient, { + mutationKey: ['filter-match'], mutationFn: () => Promise.resolve('ok'), }) - mutation.execute({}) + const other = queryClient.getMutationCache().build(queryClient, { + mutationKey: ['filter-other'], + mutationFn: () => Promise.resolve('ok'), + }) + matching.execute({}) + other.execute({}) await vi.advanceTimersByTimeAsync(0) + expect( + rendered.getAllByLabelText(/Mutation submitted at/), + ).toHaveLength(2) + fireEvent.input(rendered.getByLabelText('Filter queries by query key'), { - target: { value: 'filter-test' }, + target: { value: 'filter-match' }, }) expect( - rendered.getByLabelText(/Mutation submitted at/), - ).toBeInTheDocument() + rendered.getAllByLabelText(/Mutation submitted at/), + ).toHaveLength(1) }) }) }) From 82568bee6de22115f3f6dcb7647eacf53c6441c0 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Sun, 10 May 2026 16:07:40 +0000 Subject: [PATCH 4/4] ci: apply automated fixes --- .../query-devtools/src/__tests__/Devtools.test.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/query-devtools/src/__tests__/Devtools.test.tsx b/packages/query-devtools/src/__tests__/Devtools.test.tsx index 8e0570960a..72adfb112b 100644 --- a/packages/query-devtools/src/__tests__/Devtools.test.tsx +++ b/packages/query-devtools/src/__tests__/Devtools.test.tsx @@ -631,17 +631,17 @@ describe('Devtools', () => { other.execute({}) await vi.advanceTimersByTimeAsync(0) - expect( - rendered.getAllByLabelText(/Mutation submitted at/), - ).toHaveLength(2) + expect(rendered.getAllByLabelText(/Mutation submitted at/)).toHaveLength( + 2, + ) fireEvent.input(rendered.getByLabelText('Filter queries by query key'), { target: { value: 'filter-match' }, }) - expect( - rendered.getAllByLabelText(/Mutation submitted at/), - ).toHaveLength(1) + expect(rendered.getAllByLabelText(/Mutation submitted at/)).toHaveLength( + 1, + ) }) }) })