From 24f5b5afddabaf946b3febe3a66a3730494fcc51 Mon Sep 17 00:00:00 2001
From: Wonsuk Choi <sukvvon@gmail.com>
Date: Tue, 29 Sep 2026 10:48:41 +0900
Subject: [PATCH] test(preact-query-devtools): add test for creating the
 devtools instance only once across re-renders

---
 .../src/__tests__/PreactQueryDevtools.test.tsx         | 10 ++++++++++
 .../src/__tests__/PreactQueryDevtoolsPanel.test.tsx    | 10 ++++++++++
 2 files changed, 20 insertions(+)

diff --git a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx
index 75e69860edd..aae7275dcb1 100644
--- a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx
+++ b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx
@@ -149,6 +149,16 @@ describe('PreactQueryDevtools', () => {
     )
   })
 
+  it('should create the devtools instance only once across re-renders', () => {
+    const { rerender } = render(
+      <PreactQueryDevtools client={queryClient} position="bottom" />,
+    )
+
+    rerender(<PreactQueryDevtools client={queryClient} position="top" />)
+
+    expect(TanstackQueryDevtools).toHaveBeenCalledTimes(1)
+  })
+
   it('should forward a "buttonPosition" change to the devtools instance after mount', () => {
     const { rerender } = render(
       <PreactQueryDevtools
diff --git a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx
index 3eedadff41f..7a4dc2bd1e5 100644
--- a/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx
+++ b/packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx
@@ -143,6 +143,16 @@ describe('PreactQueryDevtoolsPanel', () => {
     )
   })
 
+  it('should create the devtools instance only once across re-renders', () => {
+    const { rerender } = render(
+      <PreactQueryDevtoolsPanel client={queryClient} errorTypes={[]} />,
+    )
+
+    rerender(<PreactQueryDevtoolsPanel client={queryClient} errorTypes={[]} />)
+
+    expect(TanstackQueryDevtoolsPanel).toHaveBeenCalledTimes(1)
+  })
+
   it('should preserve the default container height when "style" omits "height"', () => {
     const { container } = render(
       <PreactQueryDevtoolsPanel