From 8d8c4e01ddb1e53e51cffdcb0ec47ed0000d332c Mon Sep 17 00:00:00 2001
From: Wonsuk Choi <sukvvon@gmail.com>
Date: Sun, 3 May 2026 10:49:24 +0900
Subject: [PATCH] test(svelte-query-devtools): add tests for missing
 'QueryClient', context provider, and 'client' prop

---
 .../tests/Devtools.svelte.test.ts             | 21 +++++++++++++++++++
 .../tests/Wrapper.svelte                      | 15 +++++++++++++
 2 files changed, 36 insertions(+)
 create mode 100644 packages/svelte-query-devtools/tests/Wrapper.svelte

diff --git a/packages/svelte-query-devtools/tests/Devtools.svelte.test.ts b/packages/svelte-query-devtools/tests/Devtools.svelte.test.ts
index 6808633dad..dc773f5430 100644
--- a/packages/svelte-query-devtools/tests/Devtools.svelte.test.ts
+++ b/packages/svelte-query-devtools/tests/Devtools.svelte.test.ts
@@ -2,6 +2,7 @@ import { describe, expect, it } from 'vitest'
 import { render } from '@testing-library/svelte'
 import { QueryClient } from '@tanstack/svelte-query'
 import SvelteQueryDevtools from '../src/Devtools.svelte'
+import Wrapper from './Wrapper.svelte'
 
 describe('SvelteQueryDevtools', () => {
   it('should render the parent container without throwing in non-development environments', () => {
@@ -15,4 +16,24 @@ describe('SvelteQueryDevtools', () => {
       container.querySelector('.tsqd-parent-container'),
     ).toBeInTheDocument()
   })
+
+  it('should throw an error if no query client has been set', () => {
+    expect(() => render(SvelteQueryDevtools)).toThrow(
+      'No QueryClient was found in Svelte context. Did you forget to wrap your component with QueryClientProvider?',
+    )
+  })
+
+  it('should not throw an error if query client is provided via context', () => {
+    const queryClient = new QueryClient()
+
+    expect(() => render(Wrapper, { props: { queryClient } })).not.toThrow()
+  })
+
+  it('should not throw an error if query client is provided via props', () => {
+    const queryClient = new QueryClient()
+
+    expect(() =>
+      render(SvelteQueryDevtools, { props: { client: queryClient } }),
+    ).not.toThrow()
+  })
 })
diff --git a/packages/svelte-query-devtools/tests/Wrapper.svelte b/packages/svelte-query-devtools/tests/Wrapper.svelte
new file mode 100644
index 0000000000..35c5cf1517
--- /dev/null
+++ b/packages/svelte-query-devtools/tests/Wrapper.svelte
@@ -0,0 +1,15 @@
+<script lang="ts">
+  import { QueryClientProvider } from '@tanstack/svelte-query'
+  import SvelteQueryDevtools from '../src/Devtools.svelte'
+  import type { QueryClient } from '@tanstack/svelte-query'
+
+  type Props = {
+    queryClient: QueryClient
+  }
+
+  let { queryClient }: Props = $props()
+</script>
+
+<QueryClientProvider client={queryClient}>
+  <SvelteQueryDevtools />
+</QueryClientProvider>