From a9ec428da7f9b5921ad35589f99b4b9d258993f9 Mon Sep 17 00:00:00 2001
From: Wonsuk Choi <sukvvon@gmail.com>
Date: Tue, 19 May 2026 21:17:54 +0900
Subject: [PATCH] test(query-devtools/Explorer): add test for 'CopyButton'
 error state on clipboard failure

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

diff --git a/packages/query-devtools/src/__tests__/Explorer.test.tsx b/packages/query-devtools/src/__tests__/Explorer.test.tsx
index d6aa870a3c..fb94f5695e 100644
--- a/packages/query-devtools/src/__tests__/Explorer.test.tsx
+++ b/packages/query-devtools/src/__tests__/Explorer.test.tsx
@@ -19,10 +19,12 @@ describe('Explorer', () => {
   let queryClient: QueryClient
 
   beforeEach(() => {
+    vi.useFakeTimers()
     queryClient = new QueryClient()
   })
 
   afterEach(() => {
+    vi.useRealTimers()
     queryClient.clear()
   })
 
@@ -201,6 +203,35 @@ describe('Explorer', () => {
       })
     })
 
+    it('should switch the copy button to an error state when clipboard write fails', async () => {
+      const writeText = vi.fn().mockRejectedValue(new Error('denied'))
+      vi.stubGlobal('navigator', { clipboard: { writeText } })
+      const consoleError = vi
+        .spyOn(console, 'error')
+        .mockImplementation(() => {})
+      queryClient.setQueryData(['data'], { name: 'Anna' })
+
+      const rendered = renderExplorer({
+        label: 'data',
+        value: { name: 'Anna' },
+        editable: true,
+        activeQuery: queryClient
+          .getQueryCache()
+          .find({ queryKey: ['data'] }) as Query,
+      })
+
+      fireEvent.click(rendered.getByLabelText('Copy object to clipboard'))
+      await vi.advanceTimersByTimeAsync(0)
+
+      expect(
+        rendered.getByLabelText('Error copying object to clipboard'),
+      ).toBeInTheDocument()
+      expect(consoleError).toHaveBeenCalledWith(
+        'Failed to copy: ',
+        expect.any(Error),
+      )
+    })
+
     it('should clear array items via "setQueryData" when the clear-array button is clicked', () => {
       queryClient.setQueryData(['data'], ['a', 'b', 'c'])