test({react,preact}-query): move 'queryClient' and 'queryCache' to 'beforeEach' for per-test isolation

Author: sukvvon

packages/preact-query/src/__tests__/QueryResetErrorBoundary.test.tsx

@@ -17,17 +17,20 @@ import { ErrorBoundary } from './ErrorBoundary'
 import { renderWithClient } from './utils'
 
 describe('QueryErrorResetBoundary', () => {
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
   })
 
   afterEach(() => {
     vi.useRealTimers()
+    queryClient.clear()
   })
 
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
-
   describe('useQuery', () => {
     it('should retry fetch if the reset error boundary has been reset', async () => {
       const consoleMock = vi

packages/preact-query/src/__tests__/fine-grained-persister.test.tsx

@@ -10,17 +10,20 @@ import { QueryCache, QueryClient, hashKey, useQuery } from '..'
 import { renderWithClient } from './utils'
 
 describe('fine grained persister', () => {
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
   })
 
   afterEach(() => {
     vi.useRealTimers()
+    queryClient.clear()
   })
 
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
-
   it('should restore query state from persister and not refetch', async () => {
     const key = queryKey()
     const hash = hashKey(key)

packages/preact-query/src/__tests__/useInfiniteQuery.test.tsx

@@ -45,22 +45,25 @@ const fetchItems = async (
 }
 
 describe('useInfiniteQuery', () => {
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({
+      queryCache,
+      defaultOptions: {
+        queries: {
+          experimental_prefetchInRender: true,
+        },
+      },
+    })
   })
 
   afterEach(() => {
     vi.useRealTimers()
-  })
-
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({
-    queryCache,
-    defaultOptions: {
-      queries: {
-        experimental_prefetchInRender: true,
-      },
-    },
+    queryClient.clear()
   })
 
   it('should return the correct states for a successful query', async () => {

packages/preact-query/src/__tests__/usePrefetchInfiniteQuery.test.tsx

@@ -42,19 +42,21 @@ const generateInfiniteQueryOptions = (
 }
 
 describe('usePrefetchInfiniteQuery', () => {
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
   })
 
   afterEach(() => {
+    vi.useRealTimers()
     queryClient.clear()
     Fallback.mockClear()
-    vi.useRealTimers()
   })
 
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
-
   const Fallback = vi.fn().mockImplementation(() => <div>Loading...</div>)
 
   function Suspended<T = unknown>(props: {

packages/preact-query/src/__tests__/usePrefetchQuery.test.tsx

@@ -25,15 +25,18 @@ const generateQueryFn = (data: string) =>
     })
 
 describe('usePrefetchQuery', () => {
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
+  let queryCache: QueryCache
+  let queryClient: QueryClient
 
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
   })
 
   afterEach(() => {
     vi.useRealTimers()
+    queryClient.clear()
   })
 
   function Suspended<TData = unknown>(props: {

packages/preact-query/src/__tests__/useQueries.test.tsx

@@ -31,17 +31,20 @@ import { ErrorBoundary } from './ErrorBoundary'
 import { renderWithClient } from './utils'
 
 describe('useQueries', () => {
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
   })
 
   afterEach(() => {
     vi.useRealTimers()
+    queryClient.clear()
   })
 
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
-
   it('should return the correct states', async () => {
     const key1 = queryKey()
     const key2 = queryKey()

packages/preact-query/src/__tests__/useSuspenseInfiniteQuery.test.tsx

@@ -1,6 +1,6 @@
 import { queryKey } from '@tanstack/query-test-utils'
 import { Suspense } from 'preact/compat'
-import { describe, expect, it, vi } from 'vitest'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import {
   QueryCache,
@@ -11,8 +11,17 @@ import {
 import { renderWithClient } from './utils'
 
 describe('useSuspenseInfiniteQuery', () => {
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
+  beforeEach(() => {
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
+  })
+
+  afterEach(() => {
+    queryClient.clear()
+  })
 
   it('should log an error when skipToken is passed as queryFn', () => {
     const consoleErrorSpy = vi

packages/preact-query/src/__tests__/useSuspenseQuery.test.tsx

@@ -22,17 +22,20 @@ import { ErrorBoundary } from './ErrorBoundary'
 import { renderWithClient } from './utils'
 
 describe('useSuspenseQuery', () => {
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
   })
 
   afterEach(() => {
     vi.useRealTimers()
+    queryClient.clear()
   })
 
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
-
   /**
    * Preact Suspense handles the rerenders differently than React.
    * This test only checks for 4 renders (vs. React -> 6)

packages/react-query/src/__tests__/QueryResetErrorBoundary.test.tsx

@@ -15,17 +15,20 @@ import {
 import { renderWithClient } from './utils'
 
 describe('QueryErrorResetBoundary', () => {
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
   })
 
   afterEach(() => {
     vi.useRealTimers()
+    queryClient.clear()
   })
 
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
-
   describe('useQuery', () => {
     it('should retry fetch if the reset error boundary has been reset', async () => {
       const consoleMock = vi

packages/react-query/src/__tests__/fine-grained-persister.test.tsx

@@ -9,17 +9,20 @@ import { QueryCache, QueryClient, hashKey, useQuery } from '..'
 import { renderWithClient } from './utils'
 
 describe('fine grained persister', () => {
+  let queryCache: QueryCache
+  let queryClient: QueryClient
+
   beforeEach(() => {
     vi.useFakeTimers()
+    queryCache = new QueryCache()
+    queryClient = new QueryClient({ queryCache })
   })
 
   afterEach(() => {
     vi.useRealTimers()
+    queryClient.clear()
   })
 
-  const queryCache = new QueryCache()
-  const queryClient = new QueryClient({ queryCache })
-
   it('should restore query state from persister and not refetch', async () => {
     const key = queryKey()
     const hash = hashKey(key)