@tanstack/query-core 4.24.10 → 5.0.0-alpha.1

package/src/tests/queryClient.test.tsx

@@ -1,14 +1,14 @@
 import { waitFor } from '@testing-library/react'
 import '@testing-library/jest-dom'
 
-import { sleep, queryKey, mockLogger, createQueryClient } from './utils'
+import { sleep, queryKey, createQueryClient } from './utils'
 import type {
   QueryCache,
   QueryClient,
   QueryFunction,
   QueryObserverOptions,
 } from '..'
-import { InfiniteQueryObserver, MutationObserver, QueryObserver } from '..'
+import { MutationObserver, QueryObserver } from '..'
 import { focusManager, onlineManager } from '..'
 import { noop } from '../utils'
 
@@ -36,7 +36,7 @@ describe('queryClient', () => {
         defaultOptions: { queries: { queryFn } },
       })
 
-      expect(() => testClient.prefetchQuery(key)).not.toThrow()
+      expect(() => testClient.prefetchQuery({ queryKey: key })).not.toThrow()
     })
 
     test('should merge defaultOptions when query is added to cache', async () => {
@@ -44,14 +44,14 @@ describe('queryClient', () => {
 
       const testClient = createQueryClient({
         defaultOptions: {
-          queries: { cacheTime: Infinity },
+          queries: { gcTime: Infinity },
         },
       })
 
       const fetchData = () => Promise.resolve('data')
-      await testClient.prefetchQuery(key, fetchData)
-      const newQuery = testClient.getQueryCache().find(key)
-      expect(newQuery?.options.cacheTime).toBe(Infinity)
+      await testClient.prefetchQuery({ queryKey: key, queryFn: fetchData })
+      const newQuery = testClient.getQueryCache().find({ queryKey: key })
+      expect(newQuery?.options.gcTime).toBe(Infinity)
     })
 
     test('should get defaultOptions', async () => {
@@ -93,7 +93,9 @@ describe('queryClient', () => {
 
     test('should not match if the query key is a subset', async () => {
       const key = queryKey()
-      queryClient.setQueryDefaults([key, 'a'], { queryFn: () => 'data' })
+      queryClient.setQueryDefaults([key, 'a'], {
+        queryFn: () => 'data',
+      })
       const observer = new QueryObserver(queryClient, {
         queryKey: [key],
         retry: false,
@@ -112,7 +114,7 @@ describe('queryClient', () => {
       const observer = new QueryObserver(queryClient, {
         queryKey: [key],
       })
-      expect(observer.getCurrentResult().status).toBe('loading')
+      expect(observer.getCurrentResult().status).toBe('pending')
       expect(observer.getCurrentResult().fetchStatus).toBe('idle')
     })
 
@@ -120,128 +122,22 @@ describe('queryClient', () => {
       const key = queryKey()
       const queryOptions1 = { queryFn: () => 'data' }
       const queryOptions2 = { retry: false }
-      queryClient.setQueryDefaults(key, queryOptions1)
-      queryClient.setQueryDefaults(key, queryOptions2)
+      queryClient.setQueryDefaults(key, { ...queryOptions1 })
+      queryClient.setQueryDefaults(key, { ...queryOptions2 })
       expect(queryClient.getQueryDefaults(key)).toMatchObject(queryOptions2)
     })
 
-    test('should warn in dev if several query defaults match a given key', () => {
-      // Check discussion here: https://github.com/tannerlinsley/react-query/discussions/3199
-      const keyABCD = [
-        {
-          a: 'a',
-          b: 'b',
-          c: 'c',
-          d: 'd',
-        },
-      ]
-
-      // The key below "contains" keyABCD => it is more generic
-      const keyABC = [
-        {
-          a: 'a',
-          b: 'b',
-          c: 'c',
-        },
-      ]
-
-      // The defaults for query matching key "ABCD" (least generic)
-      const defaultsOfABCD = {
-        queryFn: function ABCDQueryFn() {
-          return 'ABCD'
-        },
-      }
-
-      // The defaults for query matching key "ABC" (most generic)
-      const defaultsOfABC = {
-        queryFn: function ABCQueryFn() {
-          return 'ABC'
-        },
-      }
-
-      // No defaults, no warning
-      const noDefaults = queryClient.getQueryDefaults(keyABCD)
-      expect(noDefaults).toBeUndefined()
-      expect(mockLogger.error).toHaveBeenCalledTimes(1)
-
-      // If defaults for key ABCD are registered **before** the ones of key ABC (more generic)…
-      queryClient.setQueryDefaults(keyABCD, defaultsOfABCD)
-      queryClient.setQueryDefaults(keyABC, defaultsOfABC)
-      // … then the "good" defaults are retrieved: we get the ones for key "ABCD"
-      const goodDefaults = queryClient.getQueryDefaults(keyABCD)
-      expect(goodDefaults).toBe(defaultsOfABCD)
-      // The warning is still raised since several defaults are matching
-      expect(mockLogger.error).toHaveBeenCalledTimes(2)
-
-      // Let's create another queryClient and change the order of registration
-      const newQueryClient = createQueryClient()
-      // The defaults for key ABC (more generic) are registered **before** the ones of key ABCD…
-      newQueryClient.setQueryDefaults(keyABC, defaultsOfABC)
-      newQueryClient.setQueryDefaults(keyABCD, defaultsOfABCD)
-      // … then the "wrong" defaults are retrieved: we get the ones for key "ABC"
-      const badDefaults = newQueryClient.getQueryDefaults(keyABCD)
-      expect(badDefaults).not.toBe(defaultsOfABCD)
-      expect(badDefaults).toBe(defaultsOfABC)
-      expect(mockLogger.error).toHaveBeenCalledTimes(4)
-    })
-
-    test('should warn in dev if several mutation defaults match a given key', () => {
-      // Check discussion here: https://github.com/tannerlinsley/react-query/discussions/3199
-      const keyABCD = [
-        {
-          a: 'a',
-          b: 'b',
-          c: 'c',
-          d: 'd',
-        },
-      ]
-
-      // The key below "contains" keyABCD => it is more generic
-      const keyABC = [
-        {
-          a: 'a',
-          b: 'b',
-          c: 'c',
-        },
-      ]
-
-      // The defaults for mutation matching key "ABCD" (least generic)
-      const defaultsOfABCD = {
-        mutationFn: Promise.resolve,
-      }
-
-      // The defaults for mutation matching key "ABC" (most generic)
-      const defaultsOfABC = {
-        mutationFn: Promise.resolve,
-      }
+    test('should merge defaultOptions', async () => {
+      const key = queryKey()
 
-      // No defaults, no warning
-      const noDefaults = queryClient.getMutationDefaults(keyABCD)
-      expect(noDefaults).toBeUndefined()
-      expect(mockLogger.error).toHaveBeenNthCalledWith(
-        1,
-        'Passing a custom logger has been deprecated and will be removed in the next major version.',
-      )
+      queryClient.setQueryDefaults([...key, 'todo'], { suspense: true })
+      queryClient.setQueryDefaults([...key, 'todo', 'detail'], {
+        staleTime: 5000,
+      })
 
-      // If defaults for key ABCD are registered **before** the ones of key ABC (more generic)…
-      queryClient.setMutationDefaults(keyABCD, defaultsOfABCD)
-      queryClient.setMutationDefaults(keyABC, defaultsOfABC)
-      // … then the "good" defaults are retrieved: we get the ones for key "ABCD"
-      const goodDefaults = queryClient.getMutationDefaults(keyABCD)
-      expect(goodDefaults).toBe(defaultsOfABCD)
-      // The warning is still raised since several defaults are matching
-      expect(mockLogger.error).toHaveBeenCalledTimes(2)
-
-      // Let's create another queryClient and change the order of registration
-      const newQueryClient = createQueryClient()
-      // The defaults for key ABC (more generic) are registered **before** the ones of key ABCD…
-      newQueryClient.setMutationDefaults(keyABC, defaultsOfABC)
-      newQueryClient.setMutationDefaults(keyABCD, defaultsOfABCD)
-      // … then the "wrong" defaults are retrieved: we get the ones for key "ABC"
-      const badDefaults = newQueryClient.getMutationDefaults(keyABCD)
-      expect(badDefaults).not.toBe(defaultsOfABCD)
-      expect(badDefaults).toBe(defaultsOfABC)
-      expect(mockLogger.error).toHaveBeenCalledTimes(4)
+      expect(
+        queryClient.getQueryDefaults([...key, 'todo', 'detail']),
+      ).toMatchObject({ suspense: true, staleTime: 5000 })
     })
   })
 
@@ -273,7 +169,7 @@ describe('queryClient', () => {
       const testCache = testClient.getQueryCache()
       testClient.setQueryData(key, 'data')
       expect(testClient.getQueryData(key)).toBe('data')
-      expect(testCache.find(key)).toBe(testCache.get('someKey'))
+      expect(testCache.find({ queryKey: key })).toBe(testCache.get('someKey'))
     })
 
     test('should create a new query if query was not found', () => {
@@ -290,16 +186,24 @@ describe('queryClient', () => {
 
     test('should not create a new query if query was not found and data is undefined', () => {
       const key = queryKey()
-      expect(queryClient.getQueryCache().find(key)).toBe(undefined)
+      expect(queryClient.getQueryCache().find({ queryKey: key })).toBe(
+        undefined,
+      )
       queryClient.setQueryData(key, undefined)
-      expect(queryClient.getQueryCache().find(key)).toBe(undefined)
+      expect(queryClient.getQueryCache().find({ queryKey: key })).toBe(
+        undefined,
+      )
     })
 
     test('should not create a new query if query was not found and updater returns undefined', () => {
       const key = queryKey()
-      expect(queryClient.getQueryCache().find(key)).toBe(undefined)
+      expect(queryClient.getQueryCache().find({ queryKey: key })).toBe(
+        undefined,
+      )
       queryClient.setQueryData(key, () => undefined)
-      expect(queryClient.getQueryCache().find(key)).toBe(undefined)
+      expect(queryClient.getQueryCache().find({ queryKey: key })).toBe(
+        undefined,
+      )
     })
 
     test('should not update query data if data is undefined', () => {
@@ -325,19 +229,9 @@ describe('queryClient', () => {
       queryClient.setQueryData(key, updater)
 
       expect(updater).toHaveBeenCalled()
-      expect(queryCache.find(key)!.state.data).toEqual('new data + test data')
-    })
-
-    test('should use prev data if an isDataEqual function is defined and returns "true"', () => {
-      const key = queryKey()
-
-      queryClient.setDefaultOptions({
-        queries: { isDataEqual: (_prev, data) => data === 'data' },
-      })
-      queryClient.setQueryData(key, 'prev data')
-      queryClient.setQueryData(key, 'data')
-
-      expect(queryCache.find(key)!.state.data).toEqual('prev data')
+      expect(queryCache.find({ queryKey: key })!.state.data).toEqual(
+        'new data + test data',
+      )
     })
 
     test('should set the new data without comparison if structuralSharing is set to false', () => {
@@ -354,7 +248,7 @@ describe('queryClient', () => {
       queryClient.setQueryData(key, oldData)
       queryClient.setQueryData(key, newData)
 
-      expect(queryCache.find(key)!.state.data).toBe(newData)
+      expect(queryCache.find({ queryKey: key })!.state.data).toBe(newData)
     })
 
     test('should apply a custom structuralSharing function when provided', () => {
@@ -381,19 +275,22 @@ describe('queryClient', () => {
       queryClient.setQueryData(key, oldData)
       queryClient.setQueryData(key, newData)
 
-      expect(queryCache.find(key)!.state.data).toBe(oldData)
+      expect(queryCache.find({ queryKey: key })!.state.data).toBe(oldData)
 
       const distinctData = { value: new Date(2021, 11, 25) }
       queryClient.setQueryData(key, distinctData)
 
-      expect(queryCache.find(key)!.state.data).toBe(distinctData)
+      expect(queryCache.find({ queryKey: key })!.state.data).toBe(distinctData)
     })
 
     test('should not set isFetching to false', async () => {
       const key = queryKey()
-      queryClient.prefetchQuery(key, async () => {
-        await sleep(10)
-        return 23
+      queryClient.prefetchQuery({
+        queryKey: key,
+        queryFn: async () => {
+          await sleep(10)
+          return 23
+        },
       })
       expect(queryClient.getQueryState(key)).toMatchObject({
         data: undefined,
@@ -418,8 +315,9 @@ describe('queryClient', () => {
       queryClient.setQueryData(['key', 1], 1)
       queryClient.setQueryData(['key', 2], 2)
 
-      const result = queryClient.setQueriesData<number>(['key'], (old) =>
-        old ? old + 5 : undefined,
+      const result = queryClient.setQueriesData<number>(
+        { queryKey: ['key'] },
+        (old) => (old ? old + 5 : undefined),
       )
 
       expect(result).toEqual([
@@ -433,7 +331,7 @@ describe('queryClient', () => {
     test('should accept queryFilters', () => {
       queryClient.setQueryData(['key', 1], 1)
       queryClient.setQueryData(['key', 2], 2)
-      const query1 = queryCache.find(['key', 1])!
+      const query1 = queryCache.find({ queryKey: ['key', 1] })!
 
       const result = queryClient.setQueriesData<number>(
         { predicate: (query) => query === query1 },
@@ -446,7 +344,10 @@ describe('queryClient', () => {
     })
 
     test('should not update non existing queries', () => {
-      const result = queryClient.setQueriesData<string>(['key'], 'data')
+      const result = queryClient.setQueriesData<string>(
+        { queryKey: ['key'] },
+        'data',
+      )
 
       expect(result).toEqual([])
       expect(queryClient.getQueryData(['key'])).toBe(undefined)
@@ -501,7 +402,7 @@ describe('queryClient', () => {
       queryClient.setQueryData([key1, 1], 1)
       queryClient.setQueryData([key1, 2], 2)
       queryClient.setQueryData([key2, 2], 2)
-      expect(queryClient.getQueriesData([key1])).toEqual([
+      expect(queryClient.getQueriesData({ queryKey: [key1] })).toEqual([
         [[key1, 1], 1],
         [[key1, 2], 2],
       ])
@@ -509,13 +410,13 @@ describe('queryClient', () => {
 
     test('should return empty array if queries are not found', () => {
       const key = queryKey()
-      expect(queryClient.getQueriesData(key)).toEqual([])
+      expect(queryClient.getQueriesData({ queryKey: key })).toEqual([])
     })
 
     test('should accept query filters', () => {
       queryClient.setQueryData(['key', 1], 1)
       queryClient.setQueryData(['key', 2], 2)
-      const query1 = queryCache.find(['key', 1])!
+      const query1 = queryCache.find({ queryKey: ['key', 1] })!
 
       const result = queryClient.getQueriesData({
         predicate: (query) => query === query1,
@@ -535,10 +436,10 @@ describe('queryClient', () => {
         Promise.resolve('data')
 
       await expect(
-        queryClient.fetchQuery<StrictData, any, StrictData, StrictQueryKey>(
-          key,
-          fetchFn,
-        ),
+        queryClient.fetchQuery<StrictData, any, StrictData, StrictQueryKey>({
+          queryKey: key,
+          queryFn: fetchFn,
+        }),
       ).resolves.toEqual('data')
     })
 
@@ -547,8 +448,11 @@ describe('queryClient', () => {
       const key = queryKey()
 
       await expect(
-        queryClient.fetchQuery(key, async (): Promise<unknown> => {
-          throw new Error('error')
+        queryClient.fetchQuery({
+          queryKey: key,
+          queryFn: async (): Promise<unknown> => {
+            throw new Error('error')
+          },
         }),
       ).rejects.toEqual(new Error('error'))
     })
@@ -557,38 +461,44 @@ describe('queryClient', () => {
       const key = queryKey()
 
       const fetchFn = () => Promise.resolve('data')
-      const first = await queryClient.fetchQuery(key, fetchFn)
-      const second = await queryClient.fetchQuery(key, fetchFn)
+      const first = await queryClient.fetchQuery({
+        queryKey: key,
+        queryFn: fetchFn,
+      })
+      const second = await queryClient.fetchQuery({
+        queryKey: key,
+        queryFn: fetchFn,
+      })
 
       expect(second).toBe(first)
     })
 
-    test('should be able to fetch when cache time is set to 0 and then be removed', async () => {
+    test('should be able to fetch when garbage collection time is set to 0 and then be removed', async () => {
       const key1 = queryKey()
-      const result = await queryClient.fetchQuery(
-        key1,
-        async () => {
+      const result = await queryClient.fetchQuery({
+        queryKey: key1,
+        queryFn: async () => {
           await sleep(10)
           return 1
         },
-        { cacheTime: 0 },
-      )
+        gcTime: 0,
+      })
       expect(result).toEqual(1)
       await waitFor(() =>
         expect(queryClient.getQueryData(key1)).toEqual(undefined),
       )
     })
 
-    test('should keep a query in cache if cache time is Infinity', async () => {
+    test('should keep a query in cache if garbage collection time is Infinity', async () => {
       const key1 = queryKey()
-      const result = await queryClient.fetchQuery(
-        key1,
-        async () => {
+      const result = await queryClient.fetchQuery({
+        queryKey: key1,
+        queryFn: async () => {
           await sleep(10)
           return 1
         },
-        { cacheTime: Infinity },
-      )
+        gcTime: Infinity,
+      })
       const result2 = queryClient.getQueryData(key1)
       expect(result).toEqual(1)
       expect(result2).toEqual(1)
@@ -599,7 +509,9 @@ describe('queryClient', () => {
 
       queryClient.setQueryData(key, 'og')
       const fetchFn = () => Promise.resolve('new')
-      const first = await queryClient.fetchQuery(key, fetchFn, {
+      const first = await queryClient.fetchQuery({
+        queryKey: key,
+        queryFn: fetchFn,
         initialData: 'initial',
         staleTime: 100,
       })
@@ -613,18 +525,26 @@ describe('queryClient', () => {
       const fetchFn = () => ++count
 
       queryClient.setQueryData(key, count)
-      const first = await queryClient.fetchQuery(key, fetchFn, {
+      const first = await queryClient.fetchQuery({
+        queryKey: key,
+        queryFn: fetchFn,
         staleTime: 100,
       })
       await sleep(11)
-      const second = await queryClient.fetchQuery(key, fetchFn, {
+      const second = await queryClient.fetchQuery({
+        queryKey: key,
+        queryFn: fetchFn,
         staleTime: 10,
       })
-      const third = await queryClient.fetchQuery(key, fetchFn, {
+      const third = await queryClient.fetchQuery({
+        queryKey: key,
+        queryFn: fetchFn,
         staleTime: 10,
       })
       await sleep(11)
-      const fourth = await queryClient.fetchQuery(key, fetchFn, {
+      const fourth = await queryClient.fetchQuery({
+        queryKey: key,
+        queryFn: fetchFn,
         staleTime: 10,
       })
       expect(first).toBe(0)
@@ -642,10 +562,10 @@ describe('queryClient', () => {
 
       const data = {
         pages: ['data'],
-        pageParams: [undefined],
+        pageParams: [0],
       } as const
 
-      const fetchFn: QueryFunction<StrictData, StrictQueryKey> = () =>
+      const fetchFn: QueryFunction<StrictData, StrictQueryKey, number> = () =>
         Promise.resolve(data.pages[0])
 
       await expect(
@@ -653,22 +573,24 @@ describe('queryClient', () => {
           StrictData,
           any,
           StrictData,
-          StrictQueryKey
-        >(key, fetchFn),
+          StrictQueryKey,
+          number
+        >({ queryKey: key, queryFn: fetchFn, defaultPageParam: 0 }),
       ).resolves.toEqual(data)
     })
 
     test('should return infinite query data', async () => {
       const key = queryKey()
-      const result = await queryClient.fetchInfiniteQuery(
-        key,
-        ({ pageParam = 10 }) => Number(pageParam),
-      )
+      const result = await queryClient.fetchInfiniteQuery({
+        queryKey: key,
+        defaultPageParam: 10,
+        queryFn: ({ pageParam }) => Number(pageParam),
+      })
       const result2 = queryClient.getQueryData(key)
 
       const expected = {
         pages: [10],
-        pageParams: [undefined],
+        pageParams: [10],
       }
 
       expect(result).toEqual(expected)
@@ -682,36 +604,39 @@ describe('queryClient', () => {
       type StrictQueryKey = ['strict', ...ReturnType<typeof queryKey>]
       const key: StrictQueryKey = ['strict', ...queryKey()]
 
-      const fetchFn: QueryFunction<StrictData, StrictQueryKey> = () =>
+      const fetchFn: QueryFunction<StrictData, StrictQueryKey, number> = () =>
         Promise.resolve('data')
 
       await queryClient.prefetchInfiniteQuery<
         StrictData,
         any,
         StrictData,
-        StrictQueryKey
-      >(key, fetchFn)
+        StrictQueryKey,
+        number
+      >({ queryKey: key, queryFn: fetchFn, defaultPageParam: 0 })
 
       const result = queryClient.getQueryData(key)
 
       expect(result).toEqual({
         pages: ['data'],
-        pageParams: [undefined],
+        pageParams: [0],
       })
     })
 
     test('should return infinite query data', async () => {
       const key = queryKey()
 
-      await queryClient.prefetchInfiniteQuery(key, ({ pageParam = 10 }) =>
-        Number(pageParam),
-      )
+      await queryClient.prefetchInfiniteQuery({
+        queryKey: key,
+        queryFn: ({ pageParam }) => Number(pageParam),
+        defaultPageParam: 10,
+      })
 
       const result = queryClient.getQueryData(key)
 
       expect(result).toEqual({
         pages: [10],
-        pageParams: [undefined],
+        pageParams: [10],
       })
     })
   })
@@ -730,7 +655,7 @@ describe('queryClient', () => {
         any,
         StrictData,
         StrictQueryKey
-      >(key, fetchFn)
+      >({ queryKey: key, queryFn: fetchFn })
 
       const result = queryClient.getQueryData(key)
 
@@ -740,33 +665,30 @@ describe('queryClient', () => {
     test('should return undefined when an error is thrown', async () => {
       const key = queryKey()
 
-      const result = await queryClient.prefetchQuery(
-        key,
-        async (): Promise<unknown> => {
+      const result = await queryClient.prefetchQuery({
+        queryKey: key,
+        queryFn: async (): Promise<unknown> => {
           throw new Error('error')
         },
-        {
-          retry: false,
-        },
-      )
+        retry: false,
+      })
 
       expect(result).toBeUndefined()
-      expect(mockLogger.error).toHaveBeenCalled()
     })
 
-    test('should be garbage collected after cacheTime if unused', async () => {
+    test('should be garbage collected after gcTime if unused', async () => {
       const key = queryKey()
 
-      await queryClient.prefetchQuery(
-        key,
-        async () => {
+      await queryClient.prefetchQuery({
+        queryKey: key,
+        queryFn: async () => {
           return 'data'
         },
-        { cacheTime: 10 },
-      )
-      expect(queryCache.find(key)).toBeDefined()
+        gcTime: 10,
+      })
+      expect(queryCache.find({ queryKey: key })).toBeDefined()
       await sleep(15)
-      expect(queryCache.find(key)).not.toBeDefined()
+      expect(queryCache.find({ queryKey: key })).not.toBeDefined()
     })
   })
 
@@ -777,8 +699,8 @@ describe('queryClient', () => {
       const fetchFn = () => Promise.resolve('data')
 
       // check the query was added to the cache
-      await queryClient.prefetchQuery(key, fetchFn)
-      expect(queryCache.find(key)).toBeTruthy()
+      await queryClient.prefetchQuery({ queryKey: key, queryFn: fetchFn })
+      expect(queryCache.find({ queryKey: key })).toBeTruthy()
 
       // check the error doesn't occur
       expect(() =>
@@ -786,7 +708,7 @@ describe('queryClient', () => {
       ).not.toThrow()
 
       // check query was successful removed
-      expect(queryCache.find(key)).toBeFalsy()
+      expect(queryCache.find({ queryKey: key })).toBeFalsy()
     })
   })
 
@@ -795,27 +717,42 @@ describe('queryClient', () => {
       const key1 = queryKey()
       const key2 = queryKey()
       const key3 = queryKey()
-      await queryClient.fetchQuery(key1, async () => {
-        return 'data'
+      await queryClient.fetchQuery({
+        queryKey: key1,
+        queryFn: async () => {
+          return 'data'
+        },
       })
       try {
-        await queryClient.fetchQuery(key2, async () => {
-          return Promise.reject<unknown>('err')
+        await queryClient.fetchQuery({
+          queryKey: key2,
+          queryFn: async () => {
+            return Promise.reject<unknown>('err')
+          },
         })
       } catch {}
-      queryClient.fetchQuery(key1, async () => {
-        await sleep(1000)
-        return 'data2'
+      queryClient.fetchQuery({
+        queryKey: key1,
+        queryFn: async () => {
+          await sleep(1000)
+          return 'data2'
+        },
       })
       try {
-        queryClient.fetchQuery(key2, async () => {
-          await sleep(1000)
-          return Promise.reject<unknown>('err2')
+        queryClient.fetchQuery({
+          queryKey: key2,
+          queryFn: async () => {
+            await sleep(1000)
+            return Promise.reject<unknown>('err2')
+          },
         })
       } catch {}
-      queryClient.fetchQuery(key3, async () => {
-        await sleep(1000)
-        return 'data3'
+      queryClient.fetchQuery({
+        queryKey: key3,
+        queryFn: async () => {
+          await sleep(1000)
+          return 'data3'
+        },
       })
       await sleep(10)
       await queryClient.cancelQueries()
@@ -833,22 +770,28 @@ describe('queryClient', () => {
       })
       expect(state3).toMatchObject({
         data: undefined,
-        status: 'loading',
+        status: 'pending',
         fetchStatus: 'idle',
       })
     })
 
     test('should not revert if revert option is set to false', async () => {
       const key1 = queryKey()
-      await queryClient.fetchQuery(key1, async () => {
-        return 'data'
+      await queryClient.fetchQuery({
+        queryKey: key1,
+        queryFn: async () => {
+          return 'data'
+        },
       })
-      queryClient.fetchQuery(key1, async () => {
-        await sleep(1000)
-        return 'data2'
+      queryClient.fetchQuery({
+        queryKey: key1,
+        queryFn: async () => {
+          await sleep(1000)
+          return 'data2'
+        },
       })
       await sleep(10)
-      await queryClient.cancelQueries(key1, {}, { revert: false })
+      await queryClient.cancelQueries({ queryKey: key1 }, { revert: false })
       const state1 = queryClient.getQueryState(key1)
       expect(state1).toMatchObject({
         status: 'error',
@@ -860,7 +803,7 @@ describe('queryClient', () => {
     test('should not refetch if all observers are disabled', async () => {
       const key = queryKey()
       const queryFn = jest.fn<string, unknown[]>().mockReturnValue('data')
-      await queryClient.fetchQuery(key, queryFn)
+      await queryClient.fetchQuery({ queryKey: key, queryFn })
       const observer1 = new QueryObserver(queryClient, {
         queryKey: key,
         queryFn,
@@ -874,7 +817,7 @@ describe('queryClient', () => {
     test('should refetch if at least one observer is enabled', async () => {
       const key = queryKey()
       const queryFn = jest.fn<string, unknown[]>().mockReturnValue('data')
-      await queryClient.fetchQuery(key, queryFn)
+      await queryClient.fetchQuery({ queryKey: key, queryFn })
       const observer1 = new QueryObserver(queryClient, {
         queryKey: key,
         queryFn,
@@ -897,8 +840,8 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer1 = new QueryObserver(queryClient, {
         queryKey: key1,
         staleTime: Infinity,
@@ -923,8 +866,8 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
@@ -942,14 +885,14 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
       })
       const unsubscribe = observer.subscribe(() => undefined)
-      queryClient.invalidateQueries(key1)
+      queryClient.invalidateQueries({ queryKey: key1 })
       await queryClient.refetchQueries({ stale: true })
       unsubscribe()
       // fetchQuery, observer mount, invalidation (cancels observer mount) and refetch
@@ -962,9 +905,9 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
-      queryClient.invalidateQueries(key1)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
+      queryClient.invalidateQueries({ queryKey: key1 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
@@ -984,8 +927,8 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
@@ -1003,8 +946,8 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
@@ -1022,8 +965,8 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
@@ -1041,8 +984,8 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
@@ -1084,15 +1027,15 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
         staleTime: Infinity,
       })
       const unsubscribe = observer.subscribe(() => undefined)
-      queryClient.invalidateQueries(key1)
+      queryClient.invalidateQueries({ queryKey: key1 })
       unsubscribe()
       expect(queryFn1).toHaveBeenCalledTimes(2)
       expect(queryFn2).toHaveBeenCalledTimes(1)
@@ -1103,15 +1046,15 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         enabled: false,
         staleTime: Infinity,
       })
       const unsubscribe = observer.subscribe(() => undefined)
-      queryClient.invalidateQueries(key1)
+      queryClient.invalidateQueries({ queryKey: key1 })
       unsubscribe()
       expect(queryFn1).toHaveBeenCalledTimes(1)
       expect(queryFn2).toHaveBeenCalledTimes(1)
@@ -1122,15 +1065,16 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
         staleTime: Infinity,
       })
       const unsubscribe = observer.subscribe(() => undefined)
-      queryClient.invalidateQueries(key1, {
+      queryClient.invalidateQueries({
+        queryKey: key1,
         refetchType: 'none',
       })
       unsubscribe()
@@ -1143,8 +1087,8 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
@@ -1154,7 +1098,8 @@ describe('queryClient', () => {
       const unsubscribe = observer.subscribe(() => undefined)
       unsubscribe()
 
-      await queryClient.invalidateQueries(key1, {
+      await queryClient.invalidateQueries({
+        queryKey: key1,
         refetchType: 'inactive',
       })
       expect(queryFn1).toHaveBeenCalledTimes(2)
@@ -1166,8 +1111,8 @@ describe('queryClient', () => {
       const key2 = queryKey()
       const queryFn1 = jest.fn<string, unknown[]>().mockReturnValue('data1')
       const queryFn2 = jest.fn<string, unknown[]>().mockReturnValue('data2')
-      await queryClient.fetchQuery(key1, queryFn1)
-      await queryClient.fetchQuery(key2, queryFn2)
+      await queryClient.fetchQuery({ queryKey: key1, queryFn: queryFn1 })
+      await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer = new QueryObserver(queryClient, {
         queryKey: key1,
         queryFn: queryFn1,
@@ -1192,9 +1137,7 @@ describe('queryClient', () => {
           return new Promise((resolve) => {
             fetchCount++
             setTimeout(() => resolve(5), 10)
-            if (signal) {
-              signal.addEventListener('abort', abortFn)
-            }
+            signal.addEventListener('abort', abortFn)
           })
         },
         initialData: 1,
@@ -1217,9 +1160,7 @@ describe('queryClient', () => {
           return new Promise((resolve) => {
             fetchCount++
             setTimeout(() => resolve(5), 10)
-            if (signal) {
-              signal.addEventListener('abort', abortFn)
-            }
+            signal.addEventListener('abort', abortFn)
           })
         },
         initialData: 1,
@@ -1239,11 +1180,11 @@ describe('queryClient', () => {
 
       const callback = jest.fn()
 
-      await queryClient.prefetchQuery(key, () => 'data')
+      await queryClient.prefetchQuery({ queryKey: key, queryFn: () => 'data' })
 
       queryCache.subscribe(callback)
 
-      queryClient.resetQueries(key)
+      queryClient.resetQueries({ queryKey: key })
 
       expect(callback).toHaveBeenCalled()
     })
@@ -1251,33 +1192,35 @@ describe('queryClient', () => {
     test('should reset query', async () => {
       const key = queryKey()
 
-      await queryClient.prefetchQuery(key, () => 'data')
+      await queryClient.prefetchQuery({ queryKey: key, queryFn: () => 'data' })
 
       let state = queryClient.getQueryState(key)
       expect(state?.data).toEqual('data')
       expect(state?.status).toEqual('success')
 
-      queryClient.resetQueries(key)
+      queryClient.resetQueries({ queryKey: key })
 
       state = queryClient.getQueryState(key)
 
       expect(state).toBeTruthy()
       expect(state?.data).toBeUndefined()
-      expect(state?.status).toEqual('loading')
+      expect(state?.status).toEqual('pending')
       expect(state?.fetchStatus).toEqual('idle')
     })
 
     test('should reset query data to initial data if set', async () => {
       const key = queryKey()
 
-      await queryClient.prefetchQuery(key, () => 'data', {
+      await queryClient.prefetchQuery({
+        queryKey: key,
+        queryFn: () => 'data',
         initialData: 'initial',
       })
 
       let state = queryClient.getQueryState(key)
       expect(state?.data).toEqual('data')
 
-      queryClient.resetQueries(key)
+      queryClient.resetQueries({ queryKey: key })
 
       state = queryClient.getQueryState(key)
 
@@ -1310,98 +1253,6 @@ describe('queryClient', () => {
     })
   })
 
-  describe('refetch only certain pages of an infinite query', () => {
-    test('refetchQueries', async () => {
-      const key = queryKey()
-      let multiplier = 1
-      const observer = new InfiniteQueryObserver<number>(queryClient, {
-        queryKey: key,
-        queryFn: ({ pageParam = 10 }) => Number(pageParam) * multiplier,
-        getNextPageParam: (lastPage) => lastPage + 1,
-      })
-
-      await observer.fetchNextPage()
-      await observer.fetchNextPage()
-
-      expect(queryClient.getQueryData(key)).toMatchObject({
-        pages: [10, 11],
-      })
-
-      multiplier = 2
-
-      await queryClient.refetchQueries({
-        queryKey: key,
-        refetchPage: (_, index) => index === 0,
-      })
-
-      expect(queryClient.getQueryData(key)).toMatchObject({
-        pages: [20, 11],
-      })
-    })
-    test('invalidateQueries', async () => {
-      const key = queryKey()
-      let multiplier = 1
-      const observer = new InfiniteQueryObserver<number>(queryClient, {
-        queryKey: key,
-        queryFn: ({ pageParam = 10 }) => Number(pageParam) * multiplier,
-        getNextPageParam: (lastPage) => lastPage + 1,
-      })
-
-      await observer.fetchNextPage()
-      await observer.fetchNextPage()
-
-      expect(queryClient.getQueryData(key)).toMatchObject({
-        pages: [10, 11],
-      })
-
-      multiplier = 2
-
-      await queryClient.invalidateQueries({
-        queryKey: key,
-        refetchType: 'all',
-        refetchPage: (page, _, allPages) => {
-          return page === allPages[0]
-        },
-      })
-
-      expect(queryClient.getQueryData(key)).toMatchObject({
-        pages: [20, 11],
-      })
-    })
-
-    test('resetQueries', async () => {
-      const key = queryKey()
-      let multiplier = 1
-      new InfiniteQueryObserver<number>(queryClient, {
-        queryKey: key,
-        queryFn: ({ pageParam = 10 }) => Number(pageParam) * multiplier,
-        getNextPageParam: (lastPage) => lastPage + 1,
-        initialData: () => ({
-          pages: [10, 11],
-          pageParams: [10, 11],
-        }),
-      })
-
-      expect(queryClient.getQueryData(key)).toMatchObject({
-        pages: [10, 11],
-      })
-
-      multiplier = 2
-
-      await queryClient.resetQueries({
-        queryKey: key,
-        type: 'inactive',
-        refetchPage: (page, _, allPages) => {
-          return page === allPages[0]
-        },
-      })
-
-      expect(queryClient.getQueryData(key)).toMatchObject({
-        pages: [20, 11],
-      })
-    })
-  })
-
   describe('focusManager and onlineManager', () => {
     test('should notify queryCache and mutationCache if focused', async () => {
       const testClient = createQueryClient()