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

package/src/tests/mutationObserver.test.tsx

@@ -29,7 +29,7 @@ describe('mutationObserver', () => {
     const unsubscribe1 = mutation.subscribe(subscription1Handler)
     const unsubscribe2 = mutation.subscribe(subscription2Handler)
 
-    mutation.mutate()
+    mutation.mutate('input')
 
     unsubscribe1()
 
@@ -43,34 +43,4 @@ describe('mutationObserver', () => {
     // Clean-up
     unsubscribe2()
   })
-
-  test('should not notify listeners if options.listeners is set to false', async () => {
-    const mutation = new MutationObserver(queryClient, {
-      mutationFn: async (text: string) => {
-        await sleep(20)
-        return text
-      },
-    })
-
-    const subscriptionHandler = jest.fn()
-    const unsubscribe = mutation.subscribe(subscriptionHandler)
-    mutation.mutate()
-
-    await waitFor(() => {
-      // 2 calls: loading, success
-      expect(subscriptionHandler).toBeCalledTimes(2)
-    })
-    subscriptionHandler.mockReset()
-
-    // Force a notification with listeners set to false
-    // because there is no existing usage of notify with listeners set to false
-    mutation['notify']({ listeners: false })
-
-    await waitFor(() => {
-      // 0 call because no notification has been sent
-      expect(subscriptionHandler).toBeCalledTimes(0)
-    })
-
-    unsubscribe()
-  })
 })

package/src/tests/mutations.test.tsx

@@ -15,15 +15,6 @@ describe('mutations', () => {
     queryClient.clear()
   })
 
-  test('mutate should trigger a mutation', async () => {
-    const result = await executeMutation(queryClient, {
-      mutationFn: async (text: string) => text,
-      variables: 'todo',
-    })
-
-    expect(result).toBe(result)
-  })
-
   test('mutate should accept null values', async () => {
     let variables
 
@@ -34,26 +25,29 @@ describe('mutations', () => {
       },
     })
 
-    mutation.mutate(null)
-
-    await sleep(10)
+    await mutation.mutate(null)
 
     expect(variables).toBe(null)
   })
 
   test('setMutationDefaults should be able to set defaults', async () => {
     const key = queryKey()
+    const fn = jest.fn()
 
     queryClient.setMutationDefaults(key, {
-      mutationFn: async (text: string) => text,
+      mutationFn: fn,
     })
 
-    const result = await executeMutation(queryClient, {
-      mutationKey: key,
-      variables: 'todo',
-    })
+    await executeMutation(
+      queryClient,
+      {
+        mutationKey: key,
+      },
+      'vars',
+    )
 
-    expect(result).toBe(result)
+    expect(fn).toHaveBeenCalledTimes(1)
+    expect(fn).toHaveBeenCalledWith('vars')
   })
 
   test('mutation should set correct success states', async () => {
@@ -63,7 +57,6 @@ describe('mutations', () => {
         return text
       },
       onMutate: (text) => text,
-      variables: 'todo',
     })
 
     expect(mutation.getCurrentResult()).toEqual({
@@ -74,13 +67,14 @@ describe('mutations', () => {
       failureReason: null,
       isError: false,
       isIdle: true,
-      isLoading: false,
+      isPending: false,
       isPaused: false,
       isSuccess: false,
       mutate: expect.any(Function),
       reset: expect.any(Function),
       status: 'idle',
       variables: undefined,
+      submittedAt: 0,
     })
 
     const states: MutationState<string, unknown, string, string>[] = []
@@ -89,7 +83,7 @@ describe('mutations', () => {
       states.push(state)
     })
 
-    mutation.mutate()
+    mutation.mutate('todo')
 
     await sleep(0)
 
@@ -101,13 +95,14 @@ describe('mutations', () => {
       failureReason: null,
       isError: false,
       isIdle: false,
-      isLoading: true,
+      isPending: true,
       isPaused: false,
       isSuccess: false,
       mutate: expect.any(Function),
       reset: expect.any(Function),
-      status: 'loading',
+      status: 'pending',
       variables: 'todo',
+      submittedAt: expect.any(Number),
     })
 
     await sleep(5)
@@ -120,13 +115,14 @@ describe('mutations', () => {
       failureReason: null,
       isError: false,
       isIdle: false,
-      isLoading: true,
+      isPending: true,
       isPaused: false,
       isSuccess: false,
       mutate: expect.any(Function),
       reset: expect.any(Function),
-      status: 'loading',
+      status: 'pending',
       variables: 'todo',
+      submittedAt: expect.any(Number),
     })
 
     await sleep(20)
@@ -139,24 +135,24 @@ describe('mutations', () => {
       failureReason: null,
       isError: false,
       isIdle: false,
-      isLoading: false,
+      isPending: false,
       isPaused: false,
       isSuccess: true,
       mutate: expect.any(Function),
       reset: expect.any(Function),
       status: 'success',
       variables: 'todo',
+      submittedAt: expect.any(Number),
     })
   })
 
   test('mutation should set correct error states', async () => {
     const mutation = new MutationObserver(queryClient, {
-      mutationFn: async () => {
+      mutationFn: async (_: string) => {
         await sleep(20)
-        return Promise.reject('err')
+        return Promise.reject(new Error('err'))
       },
       onMutate: (text) => text,
-      variables: 'todo',
       retry: 1,
       retryDelay: 1,
     })
@@ -167,7 +163,7 @@ describe('mutations', () => {
       states.push(state)
     })
 
-    mutation.mutate().catch(() => undefined)
+    mutation.mutate('todo').catch(() => undefined)
 
     await sleep(0)
 
@@ -179,13 +175,14 @@ describe('mutations', () => {
       failureReason: null,
       isError: false,
       isIdle: false,
-      isLoading: true,
+      isPending: true,
       isPaused: false,
       isSuccess: false,
       mutate: expect.any(Function),
       reset: expect.any(Function),
-      status: 'loading',
+      status: 'pending',
       variables: 'todo',
+      submittedAt: expect.any(Number),
     })
 
     await sleep(10)
@@ -198,13 +195,14 @@ describe('mutations', () => {
       failureReason: null,
       isError: false,
       isIdle: false,
-      isLoading: true,
+      isPending: true,
       isPaused: false,
       isSuccess: false,
       mutate: expect.any(Function),
       reset: expect.any(Function),
-      status: 'loading',
+      status: 'pending',
       variables: 'todo',
+      submittedAt: expect.any(Number),
     })
 
     await sleep(20)
@@ -214,16 +212,17 @@ describe('mutations', () => {
       data: undefined,
       error: null,
       failureCount: 1,
-      failureReason: 'err',
+      failureReason: new Error('err'),
       isError: false,
       isIdle: false,
-      isLoading: true,
+      isPending: true,
       isPaused: false,
       isSuccess: false,
       mutate: expect.any(Function),
       reset: expect.any(Function),
-      status: 'loading',
+      status: 'pending',
       variables: 'todo',
+      submittedAt: expect.any(Number),
     })
 
     await sleep(30)
@@ -231,18 +230,19 @@ describe('mutations', () => {
     expect(states[3]).toEqual({
       context: 'todo',
       data: undefined,
-      error: 'err',
+      error: new Error('err'),
       failureCount: 2,
-      failureReason: 'err',
+      failureReason: new Error('err'),
       isError: true,
       isIdle: false,
-      isLoading: false,
+      isPending: false,
       isPaused: false,
       isSuccess: false,
       mutate: expect.any(Function),
       reset: expect.any(Function),
       status: 'error',
       variables: 'todo',
+      submittedAt: expect.any(Number),
     })
   })
 
@@ -274,8 +274,9 @@ describe('mutations', () => {
           failureCount: 1,
           failureReason: 'err',
           isPaused: true,
-          status: 'loading',
+          status: 'pending',
           variables: 'todo',
+          submittedAt: 1,
         },
       )
 
@@ -286,8 +287,9 @@ describe('mutations', () => {
       failureCount: 1,
       failureReason: 'err',
       isPaused: true,
-      status: 'loading',
+      status: 'pending',
       variables: 'todo',
+      submittedAt: 1,
     })
 
     await queryClient.resumePausedMutations()
@@ -301,6 +303,7 @@ describe('mutations', () => {
       isPaused: false,
       status: 'success',
       variables: 'todo',
+      submittedAt: 1,
     })
 
     expect(onMutate).not.toHaveBeenCalled()
@@ -340,7 +343,23 @@ describe('mutations', () => {
     } catch (err) {
       error = err
     }
-    expect(error).toEqual('No mutationFn found')
+    expect(error).toEqual(new Error('No mutationFn found'))
+  })
+
+  test('mutate update the mutation state even without an active subscription', async () => {
+    const onSuccess = jest.fn()
+    const onSettled = jest.fn()
+
+    const mutation = new MutationObserver(queryClient, {
+      mutationFn: async () => {
+        return 'update'
+      },
+    })
+
+    await mutation.mutate(undefined, { onSuccess, onSettled })
+    expect(mutation.getCurrentResult().data).toEqual('update')
+    expect(onSuccess).not.toHaveBeenCalled()
+    expect(onSettled).not.toHaveBeenCalled()
   })
 
   test('mutate update the mutation state even without an active subscription', async () => {

package/src/tests/onlineManager.test.tsx

@@ -56,26 +56,34 @@ describe('onlineManager', () => {
     expect(remove2Spy).not.toHaveBeenCalled()
   })
 
-  test('cleanup should still be undefined if window is not defined', async () => {
+  test('cleanup (removeEventListener) should not be called if window is not defined', async () => {
     const restoreIsServer = setIsServer(true)
 
+    const removeEventListenerSpy = jest.spyOn(globalThis, 'removeEventListener')
+
     const unsubscribe = onlineManager.subscribe(() => undefined)
-    expect(onlineManager['cleanup']).toBeUndefined()
 
     unsubscribe()
+
+    expect(removeEventListenerSpy).not.toHaveBeenCalled()
+
     restoreIsServer()
   })
 
-  test('cleanup should still be undefined if window.addEventListener is not defined', async () => {
+  test('cleanup (removeEventListener) should not be called if window.addEventListener is not defined', async () => {
     const { addEventListener } = globalThis.window
 
     // @ts-expect-error
     globalThis.window.addEventListener = undefined
 
+    const removeEventListenerSpy = jest.spyOn(globalThis, 'removeEventListener')
+
     const unsubscribe = onlineManager.subscribe(() => undefined)
-    expect(onlineManager['cleanup']).toBeUndefined()
 
     unsubscribe()
+
+    expect(removeEventListenerSpy).not.toHaveBeenCalled()
+
     globalThis.window.addEventListener = addEventListener
   })
 

package/src/tests/queriesObserver.test.tsx

@@ -1,8 +1,7 @@
 import { waitFor } from '@testing-library/react'
-import { sleep, queryKey, createQueryClient, mockLogger } from './utils'
+import { sleep, queryKey, createQueryClient } from './utils'
 import type { QueryClient, QueryObserverResult } from '..'
-import { QueriesObserver, QueryObserver } from '..'
-import type { QueryKey } from '..'
+import { QueriesObserver } from '..'
 
 describe('queriesObserver', () => {
   let queryClient: QueryClient
@@ -35,6 +34,8 @@ describe('queriesObserver', () => {
   })
 
   test('should still return value for undefined query key', async () => {
+    const consoleMock = jest.spyOn(console, 'error')
+    consoleMock.mockImplementation(() => undefined)
     const key1 = queryKey()
     const queryFn1 = jest.fn().mockReturnValue(1)
     const queryFn2 = jest.fn().mockReturnValue(2)
@@ -50,13 +51,11 @@ describe('queriesObserver', () => {
     unsubscribe()
     expect(observerResult).toMatchObject([{ data: 1 }, { data: 2 }])
 
-    expect(mockLogger.error).toHaveBeenCalledTimes(2)
-    expect(mockLogger.error).toHaveBeenCalledWith(
-      'Passing a custom logger has been deprecated and will be removed in the next major version.',
-    )
-    expect(mockLogger.error).toHaveBeenCalledWith(
-      'Passing a custom logger has been deprecated and will be removed in the next major version.',
+    expect(consoleMock).toHaveBeenCalledTimes(1)
+    expect(consoleMock).toHaveBeenCalledWith(
+      "As of v4, queryKey needs to be an Array. If you are using a string like 'repoData', please change it to an Array, e.g. ['repoData']",
     )
+    consoleMock.mockRestore()
   })
 
   test('should update when a query updates', async () => {
@@ -79,20 +78,20 @@ describe('queriesObserver', () => {
     unsubscribe()
     expect(results.length).toBe(6)
     expect(results[0]).toMatchObject([
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
     ])
     expect(results[1]).toMatchObject([
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
     ])
     expect(results[2]).toMatchObject([
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
     ])
     expect(results[3]).toMatchObject([
       { status: 'success', data: 1 },
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
     ])
     expect(results[4]).toMatchObject([
       { status: 'success', data: 1 },
@@ -122,27 +121,27 @@ describe('queriesObserver', () => {
     observer.setQueries([{ queryKey: key2, queryFn: queryFn2 }])
     await sleep(1)
     const queryCache = queryClient.getQueryCache()
-    expect(queryCache.find(key1, { type: 'active' })).toBeUndefined()
-    expect(queryCache.find(key2, { type: 'active' })).toBeDefined()
+    expect(queryCache.find({ queryKey: key1, type: 'active' })).toBeUndefined()
+    expect(queryCache.find({ queryKey: key2, type: 'active' })).toBeDefined()
     unsubscribe()
-    expect(queryCache.find(key1, { type: 'active' })).toBeUndefined()
-    expect(queryCache.find(key2, { type: 'active' })).toBeUndefined()
+    expect(queryCache.find({ queryKey: key1, type: 'active' })).toBeUndefined()
+    expect(queryCache.find({ queryKey: key2, type: 'active' })).toBeUndefined()
     expect(results.length).toBe(6)
     expect(results[0]).toMatchObject([
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
     ])
     expect(results[1]).toMatchObject([
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
     ])
     expect(results[2]).toMatchObject([
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
     ])
     expect(results[3]).toMatchObject([
       { status: 'success', data: 1 },
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
     ])
     expect(results[4]).toMatchObject([
       { status: 'success', data: 1 },
@@ -174,20 +173,20 @@ describe('queriesObserver', () => {
     unsubscribe()
     expect(results.length).toBe(6)
     expect(results[0]).toMatchObject([
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
     ])
     expect(results[1]).toMatchObject([
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
     ])
     expect(results[2]).toMatchObject([
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
     ])
     expect(results[3]).toMatchObject([
       { status: 'success', data: 1 },
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
     ])
     expect(results[4]).toMatchObject([
       { status: 'success', data: 1 },
@@ -222,20 +221,20 @@ describe('queriesObserver', () => {
     unsubscribe()
     expect(results.length).toBe(5)
     expect(results[0]).toMatchObject([
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
     ])
     expect(results[1]).toMatchObject([
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
-      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
     ])
     expect(results[2]).toMatchObject([
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
     ])
     expect(results[3]).toMatchObject([
       { status: 'success', data: 1 },
-      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
     ])
     expect(results[4]).toMatchObject([
       { status: 'success', data: 1 },
@@ -280,7 +279,7 @@ describe('queriesObserver', () => {
     unsubscribe1()
 
     await waitFor(() => {
-      // 1 call: loading
+      // 1 call: pending
       expect(subscription1Handler).toBeCalledTimes(1)
       // 1 call: success
       expect(subscription2Handler).toBeCalledTimes(1)
@@ -289,39 +288,4 @@ describe('queriesObserver', () => {
     // Clean-up
     unsubscribe2()
   })
-
-  test('onUpdate should not update the result for an unknown observer', async () => {
-    const key1 = queryKey()
-    const key2 = queryKey()
-
-    const queriesObserver = new QueriesObserver(queryClient, [
-      {
-        queryKey: key1,
-        queryFn: () => 1,
-      },
-    ])
-
-    const newQueryObserver = new QueryObserver<
-      unknown,
-      unknown,
-      unknown,
-      unknown,
-      QueryKey
-    >(queryClient, {
-      queryKey: key2,
-      queryFn: () => 2,
-    })
-
-    // Force onUpdate with an unknown QueryObserver
-    // because no existing use case has been found in the lib
-    queriesObserver['onUpdate'](
-      newQueryObserver,
-      // The current queries observer result is re-used here
-      // to use a typescript friendly result
-      queriesObserver.getCurrentResult()[0]!,
-    )
-
-    // Should not alter the result
-    expect(queriesObserver.getCurrentResult()[-1]).toBeUndefined()
-  })
 })