From 120a0b61beac891844d8bb3a469c9306b274f511 Mon Sep 17 00:00:00 2001
From: Wonsuk Choi <sukvvon@gmail.com>
Date: Mon, 11 May 2026 01:21:49 +0900
Subject: [PATCH] test(query-devtools/Devtools): add tests for "Bulk Edit Data"
 mode switch, save, and invalid JSON

---
 .../src/__tests__/Devtools.test.tsx           | 44 +++++++++++++++++++
 1 file changed, 44 insertions(+)

diff --git a/packages/query-devtools/src/__tests__/Devtools.test.tsx b/packages/query-devtools/src/__tests__/Devtools.test.tsx
index 72adfb112b..1521877b5b 100644
--- a/packages/query-devtools/src/__tests__/Devtools.test.tsx
+++ b/packages/query-devtools/src/__tests__/Devtools.test.tsx
@@ -644,4 +644,48 @@ describe('Devtools', () => {
       )
     })
   })
+
+  describe('data edit', () => {
+    it('should switch to data editor when "Bulk Edit Data" is clicked', () => {
+      queryClient.setQueryData(['edit-data'], { name: 'a' })
+      const rendered = renderDevtools({ initialIsOpen: true })
+
+      fireEvent.click(rendered.getByLabelText(/Query key \["edit-data"\]/))
+      fireEvent.click(rendered.getByLabelText('Bulk Edit Data'))
+
+      expect(
+        rendered.getByLabelText('Edit query data as JSON'),
+      ).toBeInTheDocument()
+    })
+
+    it('should save the edited data when the form is submitted', () => {
+      queryClient.setQueryData(['edit-save'], { name: 'a' })
+      const rendered = renderDevtools({ initialIsOpen: true })
+
+      fireEvent.click(rendered.getByLabelText(/Query key \["edit-save"\]/))
+      fireEvent.click(rendered.getByLabelText('Bulk Edit Data'))
+
+      const textarea = rendered.getByLabelText('Edit query data as JSON')
+      fireEvent.input(textarea, {
+        target: { value: JSON.stringify({ name: 'b' }) },
+      })
+      fireEvent.submit(textarea.closest('form')!)
+
+      expect(queryClient.getQueryData(['edit-save'])).toEqual({ name: 'b' })
+    })
+
+    it('should set an error state when the edited data is invalid JSON', () => {
+      queryClient.setQueryData(['edit-invalid'], { name: 'a' })
+      const rendered = renderDevtools({ initialIsOpen: true })
+
+      fireEvent.click(rendered.getByLabelText(/Query key \["edit-invalid"\]/))
+      fireEvent.click(rendered.getByLabelText('Bulk Edit Data'))
+
+      const textarea = rendered.getByLabelText('Edit query data as JSON')
+      fireEvent.input(textarea, { target: { value: 'not json' } })
+      fireEvent.submit(textarea.closest('form')!)
+
+      expect(rendered.getByText('Invalid Value')).toBeInTheDocument()
+    })
+  })
 })