test(svelte-query): unify queryClient passing to 'setQueryClientContext' and rename test components (#10446)

* test(svelte-query): unify queryClient passing to 'setQueryClientContext' and rename test components

* ci: apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: sukvvon

packages/svelte-query/tests/ProviderWrapper.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
   import { QueryClientProvider } from '../../src/index.js'
-  import ChildComponent from './ChildComponent.svelte'
+  import QueryChild from './QueryChild.svelte'
   import type { QueryClient } from '@tanstack/query-core'
 
   let { queryClient }: { queryClient: QueryClient } = $props()
 </script>
 
 <QueryClientProvider client={queryClient}>
-  <ChildComponent />
+  <QueryChild />
 </QueryClientProvider>

…eryClientProvider/ParentComponent.svelte …s/QueryClientProvider/BaseExample.sveltepackages/svelte-query/tests/QueryClientProvider/ParentComponent.svelte renamed to packages/svelte-query/tests/QueryClientProvider/BaseExample.svelte packages/svelte-query/tests/QueryClientProvider/ParentComponent.svelte renamed to packages/svelte-query/tests/QueryClientProvider/BaseExample.svelte

@@ -1,7 +1,7 @@
 import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest'
 import { render } from '@testing-library/svelte'
 import { QueryClient } from '@tanstack/query-core'
-import ParentComponent from './ParentComponent.svelte'
+import BaseExample from './BaseExample.svelte'
 
 describe('QueryClientProvider', () => {
   beforeEach(() => {
@@ -16,7 +16,7 @@ describe('QueryClientProvider', () => {
     const queryClient = new QueryClient()
     const queryCache = queryClient.getQueryCache()
 
-    const rendered = render(ParentComponent, {
+    const rendered = render(BaseExample, {
       props: {
         queryClient: queryClient,
       },

…ueryClientProvider/ChildComponent.svelte …ts/QueryClientProvider/QueryChild.sveltepackages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte renamed to packages/svelte-query/tests/QueryClientProvider/QueryChild.svelte packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte renamed to packages/svelte-query/tests/QueryClientProvider/QueryChild.svelte

@@ -3,21 +3,20 @@
   import { QueryClient } from '@tanstack/query-core'
   import { queryKey, sleep } from '@tanstack/query-test-utils'
   import { createInfiniteQuery } from '../../src/index.js'
+  import { setQueryClientContext } from '../../src/context.js'
   import type { QueryObserverResult } from '@tanstack/query-core'
 
   let { states }: { states: { value: Array<QueryObserverResult> } } = $props()
 
   const queryClient = new QueryClient()
+  setQueryClientContext(queryClient)
 
-  const query = createInfiniteQuery(
-    () => ({
-      queryKey: queryKey(),
-      queryFn: ({ pageParam }) => sleep(10).then(() => pageParam),
-      getNextPageParam: (lastPage) => lastPage + 1,
-      initialPageParam: 0,
-    }),
-    () => queryClient,
-  )
+  const query = createInfiniteQuery(() => ({
+    queryKey: queryKey(),
+    queryFn: ({ pageParam }) => sleep(10).then(() => pageParam),
+    getNextPageParam: (lastPage) => lastPage + 1,
+    initialPageParam: 0,
+  }))
 
   $effect(() => {
     // @ts-expect-error

packages/svelte-query/tests/QueryClientProvider/QueryClientProvider.svelte.test.ts

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { QueryClient } from '@tanstack/query-core'
   import { createInfiniteQuery } from '../../src/index.js'
+  import { setQueryClientContext } from '../../src/context.js'
   import { sleep } from '@tanstack/query-test-utils'
 
   let { queryClient }: { queryClient: QueryClient } = $props()
@@ -9,15 +10,14 @@
 
   let firstPage = $state(0)
 
-  const query = createInfiniteQuery(
-    () => ({
-      queryKey: queryKey,
-      queryFn: ({ pageParam }) => sleep(10).then(() => pageParam),
-      getNextPageParam: (lastPage) => lastPage + 1,
-      initialPageParam: firstPage,
-    }),
-    () => queryClient,
-  )
+  setQueryClientContext(queryClient)
+
+  const query = createInfiniteQuery(() => ({
+    queryKey: queryKey,
+    queryFn: ({ pageParam }) => sleep(10).then(() => pageParam),
+    getNextPageParam: (lastPage) => lastPage + 1,
+    initialPageParam: firstPage,
+  }))
 </script>
 
 <button

packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte

@@ -2,26 +2,25 @@
   import { untrack } from 'svelte'
   import { QueryClient } from '@tanstack/query-core'
   import { createInfiniteQuery } from '../../src/index.js'
+  import { setQueryClientContext } from '../../src/context.js'
   import type { QueryObserverResult } from '@tanstack/query-core'
   import { queryKey, sleep } from '@tanstack/query-test-utils'
 
   let { states }: { states: { value: Array<QueryObserverResult> } } = $props()
 
   const queryClient = new QueryClient()
+  setQueryClientContext(queryClient)
 
-  const query = createInfiniteQuery(
-    () => ({
-      queryKey: queryKey(),
-      queryFn: () => sleep(10).then(() => ({ count: 1 })),
-      select: (data) => ({
-        pages: data.pages.map((x) => `count: ${x.count}`),
-        pageParams: data.pageParams,
-      }),
-      getNextPageParam: () => undefined,
-      initialPageParam: 0,
+  const query = createInfiniteQuery(() => ({
+    queryKey: queryKey(),
+    queryFn: () => sleep(10).then(() => ({ count: 1 })),
+    select: (data) => ({
+      pages: data.pages.map((x) => `count: ${x.count}`),
+      pageParams: data.pageParams,
     }),
-    () => queryClient,
-  )
+    getNextPageParam: () => undefined,
+    initialPageParam: 0,
+  }))
 
   $effect(() => {
     // @ts-expect-error

…/createInfiniteQuery/ChangeClient.svelte …InfiniteQuery/ChangeClientExample.sveltepackages/svelte-query/tests/createInfiniteQuery/ChangeClient.svelte renamed to packages/svelte-query/tests/createInfiniteQuery/ChangeClientExample.svelte packages/svelte-query/tests/createInfiniteQuery/ChangeClient.svelte renamed to packages/svelte-query/tests/createInfiniteQuery/ChangeClientExample.svelte

@@ -4,7 +4,7 @@ import { QueryClient } from '@tanstack/query-core'
 import { ref } from '../utils.svelte.js'
 import BaseExample from './BaseExample.svelte'
 import SelectExample from './SelectExample.svelte'
-import ChangeClient from './ChangeClient.svelte'
+import ChangeClientExample from './ChangeClientExample.svelte'
 import type { QueryObserverResult } from '@tanstack/query-core'
 
 describe('createInfiniteQuery', () => {
@@ -133,7 +133,7 @@ describe('createInfiniteQuery', () => {
   it('should be able to set new pages with the query client', async () => {
     const queryClient = new QueryClient()
 
-    const rendered = render(ChangeClient, {
+    const rendered = render(ChangeClientExample, {
       props: {
         queryClient,
       },

packages/svelte-query/tests/createInfiniteQuery/SelectExample.svelte

@@ -1,7 +1,10 @@
 <script lang="ts">
   import { QueryClient } from '@tanstack/query-core'
   import { queryKey } from '@tanstack/query-test-utils'
-  import { setIsRestoringContext } from '../../src/context.js'
+  import {
+    setIsRestoringContext,
+    setQueryClientContext,
+  } from '../../src/context.js'
   import { createQueries } from '../../src/index.js'
 
   let {
@@ -13,18 +16,15 @@
   } = $props()
 
   const queryClient = new QueryClient()
-
+  setQueryClientContext(queryClient)
   setIsRestoringContext({ current: true })
 
-  const result = createQueries(
-    () => ({
-      queries: [
-        { queryKey: queryKey(), queryFn: queryFn1 },
-        { queryKey: queryKey(), queryFn: queryFn2 },
-      ],
-    }),
-    () => queryClient,
-  )
+  const result = createQueries(() => ({
+    queries: [
+      { queryKey: queryKey(), queryFn: queryFn1 },
+      { queryKey: queryKey(), queryFn: queryFn2 },
+    ],
+  }))
 </script>
 
 <div>

packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.svelte.test.ts

@@ -1,7 +1,10 @@
 <script lang="ts">
   import { QueryClient } from '@tanstack/query-core'
   import { queryKey } from '@tanstack/query-test-utils'
-  import { setIsRestoringContext } from '../../src/context.js'
+  import {
+    setIsRestoringContext,
+    setQueryClientContext,
+  } from '../../src/context.js'
   import { createQuery } from '../../src/index.js'
 
   let {
@@ -11,16 +14,13 @@
   } = $props()
 
   const queryClient = new QueryClient()
-
+  setQueryClientContext(queryClient)
   setIsRestoringContext({ current: true })
 
-  const query = createQuery(
-    () => ({
-      queryKey: queryKey(),
-      queryFn,
-    }),
-    () => queryClient,
-  )
+  const query = createQuery(() => ({
+    queryKey: queryKey(),
+    queryFn,
+  }))
 </script>
 
 <div>