From 5a479f955e4286afebc00bd4d239d61f64827f18 Mon Sep 17 00:00:00 2001
From: Wonsuk Choi <sukvvon@gmail.com>
Date: Tue, 19 May 2026 10:38:21 +0900
Subject: [PATCH 1/2] test(query-devtools/Explorer): add tests for inline edit
 on primitive rows

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

diff --git a/packages/query-devtools/src/__tests__/Explorer.test.tsx b/packages/query-devtools/src/__tests__/Explorer.test.tsx
index e6ac781616..f53425ecf8 100644
--- a/packages/query-devtools/src/__tests__/Explorer.test.tsx
+++ b/packages/query-devtools/src/__tests__/Explorer.test.tsx
@@ -327,4 +327,81 @@ describe('Explorer', () => {
       expect(rendered.getByText('"item-0"')).toBeInTheDocument()
     })
   })
+
+  describe('inline edit', () => {
+    it('should write the new string value via "setQueryData" when a text input is changed', () => {
+      queryClient.setQueryData(['data'], { name: 'Anna' })
+
+      const rendered = renderExplorer({
+        label: 'name',
+        value: 'Anna',
+        editable: true,
+        activeQuery: queryClient
+          .getQueryCache()
+          .find({ queryKey: ['data'] }) as Query,
+        dataPath: ['name'],
+      })
+
+      const input = rendered.getByLabelText('name:')
+      expect(input).toHaveAttribute('type', 'text')
+
+      fireEvent.change(input, { target: { value: 'Bob' } })
+
+      expect(queryClient.getQueryData(['data'])).toEqual({ name: 'Bob' })
+    })
+
+    it('should write the new number value via "setQueryData" when a number input is changed', () => {
+      queryClient.setQueryData(['data'], { count: 1 })
+
+      const rendered = renderExplorer({
+        label: 'count',
+        value: 1,
+        editable: true,
+        activeQuery: queryClient
+          .getQueryCache()
+          .find({ queryKey: ['data'] }) as Query,
+        dataPath: ['count'],
+      })
+
+      const input = rendered.getByLabelText('count:')
+      expect(input).toHaveAttribute('type', 'number')
+
+      fireEvent.change(input, { target: { value: '42' } })
+
+      expect(queryClient.getQueryData(['data'])).toEqual({ count: 42 })
+    })
+
+    it('should render "ToggleValueButton" inline for a boolean primitive row', () => {
+      queryClient.setQueryData(['data'], { flag: false })
+
+      const rendered = renderExplorer({
+        label: 'flag',
+        value: false,
+        editable: true,
+        activeQuery: queryClient
+          .getQueryCache()
+          .find({ queryKey: ['data'] }) as Query,
+        dataPath: ['flag'],
+      })
+
+      expect(rendered.getByLabelText('Toggle value')).toBeInTheDocument()
+    })
+
+    it('should render "DeleteItemButton" inline when a primitive row has "itemsDeletable"', () => {
+      queryClient.setQueryData(['data'], { name: 'Anna' })
+
+      const rendered = renderExplorer({
+        label: 'name',
+        value: 'Anna',
+        editable: true,
+        itemsDeletable: true,
+        activeQuery: queryClient
+          .getQueryCache()
+          .find({ queryKey: ['data'] }) as Query,
+        dataPath: ['name'],
+      })
+
+      expect(rendered.getByLabelText('Delete item')).toBeInTheDocument()
+    })
+  })
 })

From a4c59da24bb3176c176c0257b6806158ba685f69 Mon Sep 17 00:00:00 2001
From: Wonsuk Choi <sukvvon@gmail.com>
Date: Tue, 19 May 2026 10:44:09 +0900
Subject: [PATCH 2/2] test(query-devtools/Explorer): explicitly provide
 'valueAsNumber' in change event payload

---
 packages/query-devtools/src/__tests__/Explorer.test.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/query-devtools/src/__tests__/Explorer.test.tsx b/packages/query-devtools/src/__tests__/Explorer.test.tsx
index f53425ecf8..d6aa870a3c 100644
--- a/packages/query-devtools/src/__tests__/Explorer.test.tsx
+++ b/packages/query-devtools/src/__tests__/Explorer.test.tsx
@@ -366,7 +366,9 @@ describe('Explorer', () => {
       const input = rendered.getByLabelText('count:')
       expect(input).toHaveAttribute('type', 'number')
 
-      fireEvent.change(input, { target: { value: '42' } })
+      fireEvent.change(input, {
+        target: { value: '42', valueAsNumber: 42 },
+      })
 
       expect(queryClient.getQueryData(['data'])).toEqual({ count: 42 })
     })