@tanstack/query-core 4.0.0

package/src/tests/notifyManager.test.tsx

@@ -0,0 +1,51 @@
+import { createNotifyManager } from '../notifyManager'
+import { sleep } from '../../../../tests/utils'
+
+describe('notifyManager', () => {
+  it('should use default notifyFn', async () => {
+    const notifyManagerTest = createNotifyManager()
+    const callbackSpy = jest.fn()
+    notifyManagerTest.schedule(callbackSpy)
+    await sleep(1)
+    expect(callbackSpy).toHaveBeenCalled()
+  })
+
+  it('should use default batchNotifyFn', async () => {
+    const notifyManagerTest = createNotifyManager()
+    const callbackScheduleSpy = jest
+      .fn()
+      .mockImplementation(async () => await sleep(20))
+    const callbackBatchLevel2Spy = jest.fn().mockImplementation(async () => {
+      notifyManagerTest.schedule(callbackScheduleSpy)
+    })
+    const callbackBatchLevel1Spy = jest.fn().mockImplementation(async () => {
+      notifyManagerTest.batch(callbackBatchLevel2Spy)
+    })
+
+    notifyManagerTest.batch(callbackBatchLevel1Spy)
+
+    await sleep(30)
+    expect(callbackBatchLevel1Spy).toHaveBeenCalledTimes(1)
+    expect(callbackBatchLevel2Spy).toHaveBeenCalledTimes(1)
+    expect(callbackScheduleSpy).toHaveBeenCalledTimes(1)
+  })
+
+  it('should notify if error is thrown', async () => {
+    const notifyManagerTest = createNotifyManager()
+    const notifySpy = jest.fn()
+
+    notifyManagerTest.setNotifyFunction(notifySpy)
+
+    try {
+      notifyManagerTest.batch(() => {
+        notifyManagerTest.schedule(jest.fn)
+        throw new Error('Foo')
+      })
+    } catch {}
+
+    // needed for scheduleMicroTask to kick in
+    await sleep(1)
+
+    expect(notifySpy).toHaveBeenCalledTimes(1)
+  })
+})

package/src/tests/onlineManager.test.tsx

@@ -0,0 +1,148 @@
+import { OnlineManager } from '../onlineManager'
+import { setIsServer, sleep } from '../../../../tests/utils'
+
+describe('onlineManager', () => {
+  let onlineManager: OnlineManager
+  beforeEach(() => {
+    onlineManager = new OnlineManager()
+  })
+
+  test('isOnline should return true if navigator is undefined', () => {
+    const navigatorSpy = jest.spyOn(globalThis, 'navigator', 'get')
+
+    // Force navigator to be undefined
+    //@ts-expect-error
+    navigatorSpy.mockImplementation(() => undefined)
+    expect(onlineManager.isOnline()).toBeTruthy()
+
+    navigatorSpy.mockRestore()
+  })
+
+  test('isOnline should return true if navigator.onLine is true', () => {
+    const navigatorSpy = jest.spyOn(navigator, 'onLine', 'get')
+    navigatorSpy.mockImplementation(() => true)
+
+    expect(onlineManager.isOnline()).toBeTruthy()
+
+    navigatorSpy.mockRestore()
+  })
+
+  test('setEventListener should use online boolean arg', async () => {
+    let count = 0
+
+    const setup = (setOnline: (online?: boolean) => void) => {
+      setTimeout(() => {
+        count++
+        setOnline(false)
+      }, 20)
+      return () => void 0
+    }
+
+    onlineManager.setEventListener(setup)
+
+    await sleep(30)
+    expect(count).toEqual(1)
+    expect(onlineManager.isOnline()).toBeFalsy()
+  })
+
+  test('setEventListener should call previous remove handler when replacing an event listener', () => {
+    const remove1Spy = jest.fn()
+    const remove2Spy = jest.fn()
+
+    onlineManager.setEventListener(() => remove1Spy)
+    onlineManager.setEventListener(() => remove2Spy)
+
+    expect(remove1Spy).toHaveBeenCalledTimes(1)
+    expect(remove2Spy).not.toHaveBeenCalled()
+  })
+
+  test('cleanup should still be undefined if window is not defined', async () => {
+    const restoreIsServer = setIsServer(true)
+
+    const unsubscribe = onlineManager.subscribe(() => undefined)
+    expect(onlineManager['cleanup']).toBeUndefined()
+
+    unsubscribe()
+    restoreIsServer()
+  })
+
+  test('cleanup should still be undefined if window.addEventListener is not defined', async () => {
+    const { addEventListener } = globalThis.window
+
+    // @ts-expect-error
+    globalThis.window.addEventListener = undefined
+
+    const unsubscribe = onlineManager.subscribe(() => undefined)
+    expect(onlineManager['cleanup']).toBeUndefined()
+
+    unsubscribe()
+    globalThis.window.addEventListener = addEventListener
+  })
+
+  test('it should replace default window listener when a new event listener is set', async () => {
+    const addEventListenerSpy = jest.spyOn(
+      globalThis.window,
+      'addEventListener',
+    )
+
+    const removeEventListenerSpy = jest.spyOn(
+      globalThis.window,
+      'removeEventListener',
+    )
+
+    // Should set the default event listener with window event listeners
+    const unsubscribe = onlineManager.subscribe(() => undefined)
+    expect(addEventListenerSpy).toHaveBeenCalledTimes(2)
+
+    // Should replace the window default event listener by a new one
+    // and it should call window.removeEventListener twice
+    onlineManager.setEventListener(() => {
+      return () => void 0
+    })
+
+    expect(removeEventListenerSpy).toHaveBeenCalledTimes(2)
+
+    unsubscribe()
+    addEventListenerSpy.mockRestore()
+    removeEventListenerSpy.mockRestore()
+  })
+
+  test('should call removeEventListener when last listener unsubscribes', () => {
+    const addEventListenerSpy = jest.spyOn(
+      globalThis.window,
+      'addEventListener',
+    )
+
+    const removeEventListenerSpy = jest.spyOn(
+      globalThis.window,
+      'removeEventListener',
+    )
+
+    const unsubscribe1 = onlineManager.subscribe(() => undefined)
+    const unsubscribe2 = onlineManager.subscribe(() => undefined)
+    expect(addEventListenerSpy).toHaveBeenCalledTimes(2) // online + offline
+
+    unsubscribe1()
+    expect(removeEventListenerSpy).toHaveBeenCalledTimes(0)
+    unsubscribe2()
+    expect(removeEventListenerSpy).toHaveBeenCalledTimes(2) // online + offline
+  })
+
+  test('should keep setup function even if last listener unsubscribes', () => {
+    const setupSpy = jest.fn().mockImplementation(() => () => undefined)
+
+    onlineManager.setEventListener(setupSpy)
+
+    const unsubscribe1 = onlineManager.subscribe(() => undefined)
+
+    expect(setupSpy).toHaveBeenCalledTimes(1)
+
+    unsubscribe1()
+
+    const unsubscribe2 = onlineManager.subscribe(() => undefined)
+
+    expect(setupSpy).toHaveBeenCalledTimes(2)
+
+    unsubscribe2()
+  })
+})

package/src/tests/queriesObserver.test.tsx

@@ -0,0 +1,330 @@
+import { waitFor } from '@testing-library/react'
+import {
+  sleep,
+  queryKey,
+  createQueryClient,
+  mockLogger,
+} from '../../../../tests/utils'
+import {
+  QueryClient,
+  QueriesObserver,
+  QueryObserverResult,
+  QueryObserver,
+} from '..'
+import { QueryKey } from '..'
+
+describe('queriesObserver', () => {
+  let queryClient: QueryClient
+
+  beforeEach(() => {
+    queryClient = createQueryClient()
+    queryClient.mount()
+  })
+
+  afterEach(() => {
+    queryClient.clear()
+  })
+
+  test('should return an array with all query results', async () => {
+    const key1 = queryKey()
+    const key2 = queryKey()
+    const queryFn1 = jest.fn().mockReturnValue(1)
+    const queryFn2 = jest.fn().mockReturnValue(2)
+    const observer = new QueriesObserver(queryClient, [
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: key2, queryFn: queryFn2 },
+    ])
+    let observerResult
+    const unsubscribe = observer.subscribe((result) => {
+      observerResult = result
+    })
+    await sleep(1)
+    unsubscribe()
+    expect(observerResult).toMatchObject([{ data: 1 }, { data: 2 }])
+  })
+
+  test('should still return value for undefined query key', async () => {
+    const key1 = queryKey()
+    const queryFn1 = jest.fn().mockReturnValue(1)
+    const queryFn2 = jest.fn().mockReturnValue(2)
+    const observer = new QueriesObserver(queryClient, [
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: undefined, queryFn: queryFn2 },
+    ])
+    let observerResult
+    const unsubscribe = observer.subscribe((result) => {
+      observerResult = result
+    })
+    await sleep(1)
+    unsubscribe()
+    expect(observerResult).toMatchObject([{ data: 1 }, { data: 2 }])
+
+    expect(mockLogger.error).toHaveBeenCalledTimes(1)
+  })
+
+  test('should update when a query updates', async () => {
+    const key1 = queryKey()
+    const key2 = queryKey()
+    const queryFn1 = jest.fn().mockReturnValue(1)
+    const queryFn2 = jest.fn().mockReturnValue(2)
+    const observer = new QueriesObserver(queryClient, [
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: key2, queryFn: queryFn2 },
+    ])
+    const results: QueryObserverResult[][] = []
+    results.push(observer.getCurrentResult())
+    const unsubscribe = observer.subscribe((result) => {
+      results.push(result)
+    })
+    await sleep(1)
+    queryClient.setQueryData(key2, 3)
+    await sleep(1)
+    unsubscribe()
+    expect(results.length).toBe(6)
+    expect(results[0]).toMatchObject([
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[1]).toMatchObject([
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[2]).toMatchObject([
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+    ])
+    expect(results[3]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+    ])
+    expect(results[4]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'success', data: 2 },
+    ])
+    expect(results[5]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'success', data: 3 },
+    ])
+  })
+
+  test('should update when a query is removed', async () => {
+    const key1 = queryKey()
+    const key2 = queryKey()
+    const queryFn1 = jest.fn().mockReturnValue(1)
+    const queryFn2 = jest.fn().mockReturnValue(2)
+    const observer = new QueriesObserver(queryClient, [
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: key2, queryFn: queryFn2 },
+    ])
+    const results: QueryObserverResult[][] = []
+    results.push(observer.getCurrentResult())
+    const unsubscribe = observer.subscribe((result) => {
+      results.push(result)
+    })
+    await sleep(1)
+    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()
+    unsubscribe()
+    expect(queryCache.find(key1, { type: 'active' })).toBeUndefined()
+    expect(queryCache.find(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 },
+    ])
+    expect(results[1]).toMatchObject([
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[2]).toMatchObject([
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+    ])
+    expect(results[3]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+    ])
+    expect(results[4]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'success', data: 2 },
+    ])
+    expect(results[5]).toMatchObject([{ status: 'success', data: 2 }])
+  })
+
+  test('should update when a query changed position', async () => {
+    const key1 = queryKey()
+    const key2 = queryKey()
+    const queryFn1 = jest.fn().mockReturnValue(1)
+    const queryFn2 = jest.fn().mockReturnValue(2)
+    const observer = new QueriesObserver(queryClient, [
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: key2, queryFn: queryFn2 },
+    ])
+    const results: QueryObserverResult[][] = []
+    results.push(observer.getCurrentResult())
+    const unsubscribe = observer.subscribe((result) => {
+      results.push(result)
+    })
+    await sleep(1)
+    observer.setQueries([
+      { queryKey: key2, queryFn: queryFn2 },
+      { queryKey: key1, queryFn: queryFn1 },
+    ])
+    await sleep(1)
+    unsubscribe()
+    expect(results.length).toBe(6)
+    expect(results[0]).toMatchObject([
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[1]).toMatchObject([
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[2]).toMatchObject([
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+    ])
+    expect(results[3]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+    ])
+    expect(results[4]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'success', data: 2 },
+    ])
+    expect(results[5]).toMatchObject([
+      { status: 'success', data: 2 },
+      { status: 'success', data: 1 },
+    ])
+  })
+
+  test('should not update when nothing has changed', async () => {
+    const key1 = queryKey()
+    const key2 = queryKey()
+    const queryFn1 = jest.fn().mockReturnValue(1)
+    const queryFn2 = jest.fn().mockReturnValue(2)
+    const observer = new QueriesObserver(queryClient, [
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: key2, queryFn: queryFn2 },
+    ])
+    const results: QueryObserverResult[][] = []
+    results.push(observer.getCurrentResult())
+    const unsubscribe = observer.subscribe((result) => {
+      results.push(result)
+    })
+    await sleep(1)
+    observer.setQueries([
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: key2, queryFn: queryFn2 },
+    ])
+    await sleep(1)
+    unsubscribe()
+    expect(results.length).toBe(5)
+    expect(results[0]).toMatchObject([
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[1]).toMatchObject([
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'loading', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[2]).toMatchObject([
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+    ])
+    expect(results[3]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'loading', fetchStatus: 'fetching', data: undefined },
+    ])
+    expect(results[4]).toMatchObject([
+      { status: 'success', data: 1 },
+      { status: 'success', data: 2 },
+    ])
+  })
+
+  test('should trigger all fetches when subscribed', async () => {
+    const key1 = queryKey()
+    const key2 = queryKey()
+    const queryFn1 = jest.fn().mockReturnValue(1)
+    const queryFn2 = jest.fn().mockReturnValue(2)
+    const observer = new QueriesObserver(queryClient, [
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: key2, queryFn: queryFn2 },
+    ])
+    const unsubscribe = observer.subscribe(() => undefined)
+    await sleep(1)
+    unsubscribe()
+    expect(queryFn1).toHaveBeenCalledTimes(1)
+    expect(queryFn2).toHaveBeenCalledTimes(1)
+  })
+
+  test('should not destroy the observer if there is still a subscription', async () => {
+    const key1 = queryKey()
+    const observer = new QueriesObserver(queryClient, [
+      {
+        queryKey: key1,
+        queryFn: async () => {
+          await sleep(20)
+          return 1
+        },
+      },
+    ])
+
+    const subscription1Handler = jest.fn()
+    const subscription2Handler = jest.fn()
+
+    const unsubscribe1 = observer.subscribe(subscription1Handler)
+    const unsubscribe2 = observer.subscribe(subscription2Handler)
+
+    unsubscribe1()
+
+    await waitFor(() => {
+      // 1 call: loading
+      expect(subscription1Handler).toBeCalledTimes(1)
+      // 1 call: success
+      expect(subscription2Handler).toBeCalledTimes(1)
+    })
+
+    // 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()
+  })
+})