@tanstack/query-core 5.0.0-alpha.3 → 5.0.0-alpha.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/query-core",
-  "version": "5.0.0-alpha.3",
+  "version": "5.0.0-alpha.6",
   "description": "The framework agnostic core that powers TanStack Query",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -31,7 +31,7 @@
     "clean": "rimraf ./build",
     "test:eslint": "eslint --ext .ts,.tsx ./src",
     "test:types": "tsc",
-    "test:lib": "jest --config ./jest.config.ts",
+    "test:lib": "vitest run --coverage",
     "test:lib:dev": "pnpm run test:lib --watch",
     "build:types": "tsc --build"
   }

package/src/infiniteQueryBehavior.ts

@@ -14,12 +14,12 @@ export function infiniteQueryBehavior<
 >(): QueryBehavior<TQueryFnData, TError, InfiniteData<TData>> {
   return {
     onFetch: (context) => {
-      context.fetchFn = () => {
+      context.fetchFn = async () => {
         const options = context.options as InfiniteQueryPageParamsOptions<TData>
         const direction = context.fetchOptions?.meta?.fetchMore?.direction
         const oldPages = context.state.data?.pages || []
         const oldPageParams = context.state.data?.pageParams || []
-        let newPageParams = oldPageParams
+        const empty = { pages: [], pageParams: [] }
         let cancelled = false
 
         const addSignalProperty = (object: unknown) => {
@@ -43,35 +43,18 @@ export function infiniteQueryBehavior<
           context.options.queryFn ||
           (() => Promise.reject(new Error('Missing queryFn')))
 
-        const buildNewPages = (
-          pages: unknown[],
-          param: unknown,
-          page: unknown,
-          previous?: boolean,
-        ) => {
-          const { maxPages } = context.options
-
-          if (previous) {
-            newPageParams = addToStart(newPageParams, param, maxPages)
-            return addToStart(pages, page, maxPages)
-          }
-
-          newPageParams = addToEnd(newPageParams, param, maxPages)
-          return addToEnd(pages, page, maxPages)
-        }
-
         // Create function to fetch a page
-        const fetchPage = (
-          pages: unknown[],
+        const fetchPage = async (
+          data: InfiniteData<unknown>,
           param: unknown,
           previous?: boolean,
-        ): Promise<unknown[]> => {
+        ): Promise<InfiniteData<unknown>> => {
           if (cancelled) {
             return Promise.reject()
           }
 
-          if (typeof param === 'undefined' && pages.length) {
-            return Promise.resolve(pages)
+          if (typeof param === 'undefined' && data.pages.length) {
+            return Promise.resolve(data)
           }
 
           const queryFnContext: Omit<
@@ -80,60 +63,58 @@ export function infiniteQueryBehavior<
           > = {
             queryKey: context.queryKey,
             pageParam: param,
+            direction: previous ? 'backward' : 'forward',
             meta: context.options.meta,
           }
 
           addSignalProperty(queryFnContext)
 
-          const queryFnResult = queryFn(
+          const page = await queryFn(
             queryFnContext as QueryFunctionContext<QueryKey, unknown>,
           )
 
-          const promise = Promise.resolve(queryFnResult).then((page) =>
-            buildNewPages(pages, param, page, previous),
-          )
+          const { maxPages } = context.options
+          const addTo = previous ? addToStart : addToEnd
 
-          return promise
+          return {
+            pages: addTo(data.pages, page, maxPages),
+            pageParams: addTo(data.pageParams, param, maxPages),
+          }
         }
 
-        let promise: Promise<unknown[]>
+        let result: InfiniteData<unknown>
 
         // Fetch first page?
         if (!oldPages.length) {
-          promise = fetchPage([], options.defaultPageParam)
+          result = await fetchPage(empty, options.defaultPageParam)
         }
 
         // fetch next / previous page?
         else if (direction) {
           const previous = direction === 'backward'
-          const param = previous
-            ? getPreviousPageParam(options, oldPages)
-            : getNextPageParam(options, oldPages)
-          promise = fetchPage(oldPages, param, previous)
+          const pageParamFn = previous ? getPreviousPageParam : getNextPageParam
+          const oldData = {
+            pages: oldPages,
+            pageParams: oldPageParams,
+          }
+          const param = pageParamFn(options, oldData)
+
+          result = await fetchPage(oldData, param, previous)
         }
 
         // Refetch pages
         else {
-          newPageParams = []
-
           // Fetch first page
-          promise = fetchPage([], oldPageParams[0])
+          result = await fetchPage(empty, oldPageParams[0])
 
           // Fetch remaining pages
           for (let i = 1; i < oldPages.length; i++) {
-            promise = promise.then((pages) => {
-              const param = getNextPageParam(options, pages)
-              return fetchPage(pages, param)
-            })
+            const param = getNextPageParam(options, result)
+            result = await fetchPage(result, param)
           }
         }
 
-        const finalPromise = promise.then((pages) => ({
-          pages,
-          pageParams: newPageParams,
-        }))
-
-        return finalPromise
+        return result
       }
     },
   }
@@ -141,36 +122,47 @@ export function infiniteQueryBehavior<
 
 function getNextPageParam(
   options: InfiniteQueryPageParamsOptions<any>,
-  pages: unknown[],
+  { pages, pageParams }: InfiniteData<unknown>,
 ): unknown | undefined {
-  return options.getNextPageParam(pages[pages.length - 1], pages)
+  const lastIndex = pages.length - 1
+  return options.getNextPageParam(
+    pages[lastIndex],
+    pages,
+    pageParams[lastIndex],
+    pageParams,
+  )
 }
 
 function getPreviousPageParam(
   options: InfiniteQueryPageParamsOptions<any>,
-  pages: unknown[],
+  { pages, pageParams }: InfiniteData<unknown>,
 ): unknown | undefined {
-  return options.getPreviousPageParam?.(pages[0], pages)
+  return options.getPreviousPageParam?.(
+    pages[0],
+    pages,
+    pageParams[0],
+    pageParams,
+  )
 }
 
 /**
  * Checks if there is a next page.
  */
 export function hasNextPage(
-  options: InfiniteQueryPageParamsOptions<any>,
-  pages?: unknown[],
+  options: InfiniteQueryPageParamsOptions<any, any>,
+  data?: InfiniteData<unknown>,
 ): boolean {
-  if (!pages) return false
-  return typeof getNextPageParam(options, pages) !== 'undefined'
+  if (!data) return false
+  return typeof getNextPageParam(options, data) !== 'undefined'
 }
 
 /**
  * Checks if there is a previous page.
  */
 export function hasPreviousPage(
-  options: InfiniteQueryPageParamsOptions<any>,
-  pages?: unknown[],
+  options: InfiniteQueryPageParamsOptions<any, any>,
+  data?: InfiniteData<unknown>,
 ): boolean {
-  if (!pages || !options.getPreviousPageParam) return false
-  return typeof getPreviousPageParam(options, pages) !== 'undefined'
+  if (!data || !options.getPreviousPageParam) return false
+  return typeof getPreviousPageParam(options, data) !== 'undefined'
 }

package/src/infiniteQueryObserver.ts

@@ -28,6 +28,7 @@ export class InfiniteQueryObserver<
   TData = InfiniteData<TQueryFnData>,
   TQueryData = TQueryFnData,
   TQueryKey extends QueryKey = QueryKey,
+  TPageParam = unknown,
 > extends QueryObserver<
   TQueryFnData,
   TError,
@@ -56,7 +57,8 @@ export class InfiniteQueryObserver<
       TError,
       TData,
       TQueryData,
-      TQueryKey
+      TQueryKey,
+      TPageParam
     >,
   ) {
     super(client, options)
@@ -74,7 +76,8 @@ export class InfiniteQueryObserver<
       TError,
       TData,
       TQueryData,
-      TQueryKey
+      TQueryKey,
+      TPageParam
     >,
     notifyOptions?: NotifyOptions,
   ): void {
@@ -93,7 +96,8 @@ export class InfiniteQueryObserver<
       TError,
       TData,
       TQueryData,
-      TQueryKey
+      TQueryKey,
+      TPageParam
     >,
   ): InfiniteQueryObserverResult<TData, TError> {
     options.behavior = infiniteQueryBehavior()
@@ -104,7 +108,7 @@ export class InfiniteQueryObserver<
   }
 
   fetchNextPage(
-    options: FetchNextPageOptions = {},
+    options?: FetchNextPageOptions,
   ): Promise<InfiniteQueryObserverResult<TData, TError>> {
     return this.fetch({
       ...options,
@@ -114,9 +118,9 @@ export class InfiniteQueryObserver<
     })
   }
 
-  fetchPreviousPage({ ...options }: FetchPreviousPageOptions = {}): Promise<
-    InfiniteQueryObserverResult<TData, TError>
-  > {
+  fetchPreviousPage(
+    options?: FetchPreviousPageOptions,
+  ): Promise<InfiniteQueryObserverResult<TData, TError>> {
     return this.fetch({
       ...options,
       meta: {
@@ -132,7 +136,8 @@ export class InfiniteQueryObserver<
       TError,
       TData,
       TQueryData,
-      TQueryKey
+      TQueryKey,
+      TPageParam
     >,
   ): InfiniteQueryObserverResult<TData, TError> {
     const { state } = query
@@ -150,8 +155,8 @@ export class InfiniteQueryObserver<
       ...result,
       fetchNextPage: this.fetchNextPage,
       fetchPreviousPage: this.fetchPreviousPage,
-      hasNextPage: hasNextPage(options, state.data?.pages),
-      hasPreviousPage: hasPreviousPage(options, state.data?.pages),
+      hasNextPage: hasNextPage(options, state.data),
+      hasPreviousPage: hasPreviousPage(options, state.data),
       isFetchingNextPage,
       isFetchingPreviousPage,
       isRefetching:

package/src/query.ts

@@ -74,8 +74,10 @@ export interface QueryBehavior<
   ) => void
 }
 
+export type FetchDirection = 'forward' | 'backward'
+
 export interface FetchMeta {
-  fetchMore?: { direction: 'forward' | 'backward' }
+  fetchMore?: { direction: FetchDirection }
 }
 
 export interface FetchOptions {
@@ -120,7 +122,7 @@ interface ContinueAction {
 
 interface SetStateAction<TData, TError> {
   type: 'setState'
-  state: QueryState<TData, TError>
+  state: Partial<QueryState<TData, TError>>
   setStateOptions?: SetStateOptions
 }
 
@@ -211,7 +213,7 @@ export class Query<
   }
 
   setState(
-    state: QueryState<TData, TError>,
+    state: Partial<QueryState<TData, TError>>,
     setStateOptions?: SetStateOptions,
   ): void {
     this.#dispatch({ type: 'setState', state, setStateOptions })
@@ -453,7 +455,7 @@ export class Query<
 
     // Try to fetch the data
     this.#retryer = createRetryer({
-      fn: context.fetchFn as () => TData,
+      fn: context.fetchFn as () => Promise<TData>,
       abort: abortController.abort.bind(abortController),
       onSuccess: (data) => {
         if (typeof data === 'undefined') {

package/src/tests/focusManager.test.tsx

@@ -1,17 +1,18 @@
 import { sleep } from '../utils'
 import { FocusManager } from '../focusManager'
 import { setIsServer } from './utils'
+import { vi } from 'vitest'
 
 describe('focusManager', () => {
   let focusManager: FocusManager
   beforeEach(() => {
-    jest.resetModules()
+    vi.resetModules()
     focusManager = new FocusManager()
   })
 
   it('should call previous remove handler when replacing an event listener', () => {
-    const remove1Spy = jest.fn()
-    const remove2Spy = jest.fn()
+    const remove1Spy = vi.fn()
+    const remove2Spy = vi.fn()
 
     focusManager.setEventListener(() => remove1Spy)
     focusManager.setEventListener(() => remove2Spy)
@@ -39,7 +40,7 @@ describe('focusManager', () => {
   })
 
   it('should not notify listeners on focus if already focused', async () => {
-    const subscriptionSpy = jest.fn()
+    const subscriptionSpy = vi.fn()
     const unsubscribe = focusManager.subscribe(subscriptionSpy)
 
     focusManager.setFocused(true)
@@ -66,7 +67,7 @@ describe('focusManager', () => {
   test('cleanup (removeEventListener) should not be called if window is not defined', async () => {
     const restoreIsServer = setIsServer(true)
 
-    const removeEventListenerSpy = jest.spyOn(globalThis, 'removeEventListener')
+    const removeEventListenerSpy = vi.spyOn(globalThis, 'removeEventListener')
 
     const unsubscribe = focusManager.subscribe(() => undefined)
 
@@ -83,7 +84,7 @@ describe('focusManager', () => {
     // @ts-expect-error
     globalThis.window.addEventListener = undefined
 
-    const removeEventListenerSpy = jest.spyOn(globalThis, 'removeEventListener')
+    const removeEventListenerSpy = vi.spyOn(globalThis, 'removeEventListener')
 
     const unsubscribe = focusManager.subscribe(() => undefined)
 
@@ -95,8 +96,8 @@ describe('focusManager', () => {
   })
 
   it('should replace default window listener when a new event listener is set', async () => {
-    const unsubscribeSpy = jest.fn().mockImplementation(() => undefined)
-    const handlerSpy = jest.fn().mockImplementation(() => unsubscribeSpy)
+    const unsubscribeSpy = vi.fn().mockImplementation(() => undefined)
+    const handlerSpy = vi.fn().mockImplementation(() => unsubscribeSpy)
 
     focusManager.setEventListener(() => handlerSpy())
 
@@ -115,12 +116,9 @@ describe('focusManager', () => {
   })
 
   test('should call removeEventListener when last listener unsubscribes', () => {
-    const addEventListenerSpy = jest.spyOn(
-      globalThis.window,
-      'addEventListener',
-    )
+    const addEventListenerSpy = vi.spyOn(globalThis.window, 'addEventListener')
 
-    const removeEventListenerSpy = jest.spyOn(
+    const removeEventListenerSpy = vi.spyOn(
       globalThis.window,
       'removeEventListener',
     )
@@ -136,7 +134,7 @@ describe('focusManager', () => {
   })
 
   test('should keep setup function even if last listener unsubscribes', () => {
-    const setupSpy = jest.fn().mockImplementation(() => () => undefined)
+    const setupSpy = vi.fn().mockImplementation(() => () => undefined)
 
     focusManager.setEventListener(setupSpy)
 

package/src/tests/hydration.test.tsx

@@ -6,6 +6,7 @@ import {
 } from './utils'
 import { QueryCache } from '../queryCache'
 import { dehydrate, hydrate } from '../hydration'
+import { vi } from 'vitest'
 
 async function fetchData<TData>(value: TData, ms?: number): Promise<TData> {
   await sleep(ms || 0)
@@ -67,7 +68,7 @@ describe('dehydration and rehydration', () => {
       key: [{ nestedKey: 1 }],
     })
 
-    const fetchDataAfterHydration = jest.fn<unknown, unknown[]>()
+    const fetchDataAfterHydration = vi.fn<unknown[], unknown>()
     await hydrationClient.prefetchQuery({
       queryKey: ['string'],
       queryFn: fetchDataAfterHydration,
@@ -192,7 +193,7 @@ describe('dehydration and rehydration', () => {
       })?.state.data,
     ).toBe('string')
 
-    const fetchDataAfterHydration = jest.fn<unknown, unknown[]>()
+    const fetchDataAfterHydration = vi.fn<unknown[], unknown>()
     await hydrationClient.prefetchQuery({
       queryKey: ['string', { key: ['string'], key2: 0 }],
       queryFn: fetchDataAfterHydration,
@@ -205,7 +206,7 @@ describe('dehydration and rehydration', () => {
   })
 
   test('should only hydrate successful queries by default', async () => {
-    const consoleMock = jest.spyOn(console, 'error')
+    const consoleMock = vi.spyOn(console, 'error')
     consoleMock.mockImplementation(() => undefined)
 
     const queryCache = new QueryCache()
@@ -341,18 +342,18 @@ describe('dehydration and rehydration', () => {
   })
 
   test('should be able to dehydrate mutations and continue on hydration', async () => {
-    const consoleMock = jest.spyOn(console, 'error')
+    const consoleMock = vi.spyOn(console, 'error')
     consoleMock.mockImplementation(() => undefined)
     const onlineMock = mockNavigatorOnLine(false)
 
-    const serverAddTodo = jest
+    const serverAddTodo = vi
       .fn()
       .mockImplementation(() => Promise.reject(new Error('offline')))
-    const serverOnMutate = jest.fn().mockImplementation((variables) => {
+    const serverOnMutate = vi.fn().mockImplementation((variables) => {
       const optimisticTodo = { id: 1, text: variables.text }
       return { optimisticTodo }
     })
-    const serverOnSuccess = jest.fn()
+    const serverOnSuccess = vi.fn()
 
     const serverClient = createQueryClient()
 
@@ -386,14 +387,14 @@ describe('dehydration and rehydration', () => {
     const parsed = JSON.parse(stringified)
     const client = createQueryClient()
 
-    const clientAddTodo = jest.fn().mockImplementation((variables) => {
+    const clientAddTodo = vi.fn().mockImplementation((variables) => {
       return { id: 2, text: variables.text }
     })
-    const clientOnMutate = jest.fn().mockImplementation((variables) => {
+    const clientOnMutate = vi.fn().mockImplementation((variables) => {
       const optimisticTodo = { id: 1, text: variables.text }
       return { optimisticTodo }
     })
-    const clientOnSuccess = jest.fn()
+    const clientOnSuccess = vi.fn()
 
     client.setMutationDefaults(['addTodo'], {
       mutationFn: clientAddTodo,
@@ -422,10 +423,10 @@ describe('dehydration and rehydration', () => {
   })
 
   test('should not dehydrate mutations if dehydrateMutations is set to false', async () => {
-    const consoleMock = jest.spyOn(console, 'error')
+    const consoleMock = vi.spyOn(console, 'error')
     consoleMock.mockImplementation(() => undefined)
 
-    const serverAddTodo = jest
+    const serverAddTodo = vi
       .fn()
       .mockImplementation(() => Promise.reject(new Error('offline')))
 
@@ -454,10 +455,10 @@ describe('dehydration and rehydration', () => {
   })
 
   test('should not dehydrate mutation if mutation state is set to pause', async () => {
-    const consoleMock = jest.spyOn(console, 'error')
+    const consoleMock = vi.spyOn(console, 'error')
     consoleMock.mockImplementation(() => undefined)
 
-    const serverAddTodo = jest
+    const serverAddTodo = vi
       .fn()
       .mockImplementation(() => Promise.reject(new Error('offline')))
 

package/src/tests/infiniteQueryBehavior.test.tsx

@@ -1,10 +1,8 @@
 import { waitFor } from '@testing-library/react'
-import type {
-  QueryClient,
-  InfiniteQueryObserverResult,
-} from '@tanstack/query-core'
-import { InfiniteQueryObserver, CancelledError } from '@tanstack/query-core'
+import type { QueryClient, InfiniteQueryObserverResult } from '..'
+import { InfiniteQueryObserver, CancelledError } from '..'
 import { createQueryClient, queryKey, sleep } from './utils'
+import { vi } from 'vitest'
 
 describe('InfiniteQueryBehavior', () => {
   let queryClient: QueryClient
@@ -50,7 +48,7 @@ describe('InfiniteQueryBehavior', () => {
     const key = queryKey()
     let abortSignal: AbortSignal | null = null
 
-    const queryFnSpy = jest.fn().mockImplementation(({ pageParam, signal }) => {
+    const queryFnSpy = vi.fn().mockImplementation(({ pageParam, signal }) => {
       abortSignal = signal
       return pageParam
     })
@@ -84,6 +82,7 @@ describe('InfiniteQueryBehavior', () => {
       queryKey: key,
       pageParam: 1,
       meta: undefined,
+      direction: 'forward',
       signal: abortSignal,
     })
 
@@ -95,6 +94,7 @@ describe('InfiniteQueryBehavior', () => {
     expect(queryFnSpy).toHaveBeenNthCalledWith(1, {
       queryKey: key,
       pageParam: 2,
+      direction: 'forward',
       meta: undefined,
       signal: abortSignal,
     })
@@ -112,6 +112,7 @@ describe('InfiniteQueryBehavior', () => {
     expect(queryFnSpy).toHaveBeenNthCalledWith(1, {
       queryKey: key,
       pageParam: 0,
+      direction: 'backward',
       meta: undefined,
       signal: abortSignal,
     })
@@ -131,6 +132,7 @@ describe('InfiniteQueryBehavior', () => {
       queryKey: key,
       pageParam: -1,
       meta: undefined,
+      direction: 'backward',
       signal: abortSignal,
     })
 
@@ -148,6 +150,7 @@ describe('InfiniteQueryBehavior', () => {
       queryKey: key,
       pageParam: 1,
       meta: undefined,
+      direction: 'forward',
       signal: abortSignal,
     })
 
@@ -168,6 +171,7 @@ describe('InfiniteQueryBehavior', () => {
       queryKey: key,
       pageParam: 0,
       meta: undefined,
+      direction: 'forward',
       signal: abortSignal,
     })
 
@@ -175,6 +179,7 @@ describe('InfiniteQueryBehavior', () => {
       queryKey: key,
       pageParam: 1,
       meta: undefined,
+      direction: 'forward',
       signal: abortSignal,
     })
 
@@ -185,7 +190,7 @@ describe('InfiniteQueryBehavior', () => {
     const key = queryKey()
     let abortSignal: AbortSignal | null = null
 
-    const queryFnSpy = jest.fn().mockImplementation(({ pageParam, signal }) => {
+    const queryFnSpy = vi.fn().mockImplementation(({ pageParam, signal }) => {
       abortSignal = signal
       sleep(10)
       return pageParam
@@ -226,6 +231,7 @@ describe('InfiniteQueryBehavior', () => {
       queryKey: key,
       pageParam: 1,
       meta: undefined,
+      direction: 'forward',
       signal: abortSignal,
     })
 
@@ -236,7 +242,7 @@ describe('InfiniteQueryBehavior', () => {
     const key = queryKey()
     let abortSignal: AbortSignal | null = null
 
-    let queryFnSpy = jest.fn().mockImplementation(({ pageParam, signal }) => {
+    let queryFnSpy = vi.fn().mockImplementation(({ pageParam, signal }) => {
       abortSignal = signal
       return pageParam
     })
@@ -281,10 +287,11 @@ describe('InfiniteQueryBehavior', () => {
       queryKey: key,
       pageParam: 2,
       meta: undefined,
+      direction: 'forward',
       signal: abortSignal,
     })
 
-    queryFnSpy = jest.fn().mockImplementation(({ pageParam = 1, signal }) => {
+    queryFnSpy = vi.fn().mockImplementation(({ pageParam = 1, signal }) => {
       abortSignal = signal
       sleep(10)
       return pageParam