@tanstack/query-core 5.0.0-alpha.2 → 5.0.0-alpha.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/query-core",
-  "version": "5.0.0-alpha.2",
+  "version": "5.0.0-alpha.5",
   "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<
@@ -85,55 +68,52 @@ export function infiniteQueryBehavior<
 
           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 +121,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/mutation.ts

@@ -85,26 +85,35 @@ export class Mutation<
   TContext = unknown,
 > extends Removable {
   state: MutationState<TData, TError, TVariables, TContext>
-  readonly options: MutationOptions<TData, TError, TVariables, TContext>
+  options!: MutationOptions<TData, TError, TVariables, TContext>
   readonly mutationId: number
 
   #observers: MutationObserver<TData, TError, TVariables, TContext>[]
+  #defaultOptions?: MutationOptions<TData, TError, TVariables, TContext>
   #mutationCache: MutationCache
   #retryer?: Retryer<TData>
 
   constructor(config: MutationConfig<TData, TError, TVariables, TContext>) {
     super()
 
-    this.options = config.options
     this.mutationId = config.mutationId
+    this.#defaultOptions = config.defaultOptions
     this.#mutationCache = config.mutationCache
     this.#observers = []
     this.state = config.state || getDefaultState()
 
-    this.updateGcTime(this.options.gcTime)
+    this.setOptions(config.options)
     this.scheduleGc()
   }
 
+  setOptions(
+    options?: MutationOptions<TData, TError, TVariables, TContext>,
+  ): void {
+    this.options = { ...this.#defaultOptions, ...options }
+
+    this.updateGcTime(this.options.gcTime)
+  }
+
   get meta(): MutationMeta | undefined {
     return this.options.meta
   }
@@ -228,7 +237,7 @@ export class Mutation<
       try {
         // Notify cache callback
         await this.#mutationCache.config.onError?.(
-          error,
+          error as any,
           variables,
           this.state.context,
           this as Mutation<unknown, unknown, unknown, unknown>,
@@ -243,7 +252,7 @@ export class Mutation<
         // Notify cache callback
         await this.#mutationCache.config.onSettled?.(
           undefined,
-          error,
+          error as any,
           this.state.variables,
           this.state.context,
           this as Mutation<unknown, unknown, unknown, unknown>,

package/src/mutationCache.ts

@@ -12,7 +12,7 @@ import { Subscribable } from './subscribable'
 
 interface MutationCacheConfig {
   onError?: (
-    error: unknown,
+    error: DefaultError,
     variables: unknown,
     context: unknown,
     mutation: Mutation<unknown, unknown, unknown>,
@@ -29,7 +29,7 @@ interface MutationCacheConfig {
   ) => Promise<unknown> | unknown
   onSettled?: (
     data: unknown | undefined,
-    error: unknown | null,
+    error: DefaultError | null,
     variables: unknown,
     context: unknown,
     mutation: Mutation<unknown, unknown, unknown>,

package/src/mutationObserver.ts

@@ -64,6 +64,7 @@ export class MutationObserver<
         observer: this,
       })
     }
+    this.#currentMutation?.setOptions(this.options)
   }
 
   protected onUnsubscribe(): void {

package/src/query.ts

@@ -433,10 +433,13 @@ export class Query<
 
       if (!isCancelledError(error)) {
         // Notify cache callback
-        this.#cache.config.onError?.(error, this as Query<any, any, any, any>)
+        this.#cache.config.onError?.(
+          error as any,
+          this as Query<any, any, any, any>,
+        )
         this.#cache.config.onSettled?.(
           this.state.data,
-          error,
+          error as any,
           this as Query<any, any, any, any>,
         )
       }
@@ -450,7 +453,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') {
@@ -469,7 +472,7 @@ export class Query<
         this.#cache.config.onSuccess?.(data, this as Query<any, any, any, any>)
         this.#cache.config.onSettled?.(
           data,
-          this.state.error,
+          this.state.error as any,
           this as Query<any, any, any, any>,
         )
 

package/src/queryCache.ts

@@ -17,11 +17,14 @@ import type { QueryObserver } from './queryObserver'
 // TYPES
 
 interface QueryCacheConfig {
-  onError?: (error: unknown, query: Query<unknown, unknown, unknown>) => void
+  onError?: (
+    error: DefaultError,
+    query: Query<unknown, unknown, unknown>,
+  ) => void
   onSuccess?: (data: unknown, query: Query<unknown, unknown, unknown>) => void
   onSettled?: (
     data: unknown | undefined,
-    error: unknown | null,
+    error: DefaultError | null,
     query: Query<unknown, unknown, unknown>,
   ) => void
   createStore?: () => QueryStore

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
     })
@@ -185,7 +183,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
@@ -236,7 +234,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
     })
@@ -284,7 +282,7 @@ describe('InfiniteQueryBehavior', () => {
       signal: abortSignal,
     })
 
-    queryFnSpy = jest.fn().mockImplementation(({ pageParam = 1, signal }) => {
+    queryFnSpy = vi.fn().mockImplementation(({ pageParam = 1, signal }) => {
       abortSignal = signal
       sleep(10)
       return pageParam