@tanstack/angular-query-experimental 5.103.2 → 5.104.0

package/src/__tests__/mutation-options.test-d.ts

@@ -0,0 +1,234 @@
+import { assertType, describe, expectTypeOf, it } from 'vitest'
+import { queryKey } from '@tanstack/query-test-utils'
+import { QueryClient } from '@tanstack/query-core'
+import {
+  injectIsMutating,
+  injectMutation,
+  injectMutationState,
+  mutationOptions,
+} from '..'
+import type {
+  DefaultError,
+  MutationFunctionContext,
+  MutationState,
+  WithRequired,
+} from '@tanstack/query-core'
+import type { CreateMutationOptions, CreateMutationResult } from '../types'
+
+describe('mutationOptions', () => {
+  it('should not allow excess properties', () => {
+    const key = queryKey()
+    mutationOptions({
+      mutationFn: () => Promise.resolve(5),
+      // @ts-expect-error this is a good error, because onMutates does not exist!
+      onMutates: 1000,
+      mutationKey: key,
+      onSuccess: (data) => {
+        expectTypeOf(data).toEqualTypeOf<number>()
+      },
+    })
+  })
+
+  it('should infer types for callbacks', () => {
+    const key = queryKey()
+    mutationOptions({
+      mutationFn: () => Promise.resolve(5),
+      mutationKey: key,
+      onSuccess: (data) => {
+        expectTypeOf(data).toEqualTypeOf<number>()
+      },
+    })
+  })
+
+  it('should infer types for onError callback', () => {
+    const key = queryKey()
+    mutationOptions({
+      mutationFn: () => {
+        throw new Error('fail')
+      },
+      mutationKey: key,
+      onError: (error) => {
+        expectTypeOf(error).toEqualTypeOf<DefaultError>()
+      },
+    })
+  })
+
+  it('should infer types for variables', () => {
+    const key = queryKey()
+    mutationOptions<number, DefaultError, { id: string }>({
+      mutationFn: (vars) => {
+        expectTypeOf(vars).toEqualTypeOf<{ id: string }>()
+        return Promise.resolve(5)
+      },
+      mutationKey: key,
+    })
+  })
+
+  it('should infer result type correctly', () => {
+    const key = queryKey()
+    mutationOptions<number, DefaultError, void, { name: string }>({
+      mutationFn: () => Promise.resolve(5),
+      mutationKey: key,
+      onMutate: () => {
+        return { name: 'onMutateResult' }
+      },
+      onSuccess: (_data, _variables, onMutateResult) => {
+        expectTypeOf(onMutateResult).toEqualTypeOf<{ name: string }>()
+      },
+    })
+  })
+
+  it('should infer context type correctly', () => {
+    const key = queryKey()
+    mutationOptions<number>({
+      mutationFn: (_variables, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
+        return Promise.resolve(5)
+      },
+      mutationKey: key,
+      onMutate: (_variables, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
+      },
+      onSuccess: (_data, _variables, _onMutateResult, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
+      },
+      onError: (_error, _variables, _onMutateResult, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
+      },
+      onSettled: (_data, _error, _variables, _onMutateResult, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
+      },
+    })
+  })
+
+  it('should error if mutationFn return type mismatches TData', () => {
+    assertType(
+      mutationOptions<number>({
+        // @ts-expect-error this is a good error, because return type is string, not number
+        mutationFn: async () => Promise.resolve('wrong return'),
+      }),
+    )
+  })
+
+  it('should allow mutationKey to be omitted', () => {
+    return mutationOptions({
+      mutationFn: () => Promise.resolve(123),
+      onSuccess: (data) => {
+        expectTypeOf(data).toEqualTypeOf<number>()
+      },
+    })
+  })
+
+  it('should infer all types when not explicitly provided', () => {
+    const key = queryKey()
+    expectTypeOf(
+      mutationOptions({
+        mutationFn: (id: string) => Promise.resolve(id.length),
+        mutationKey: key,
+        onSuccess: (data) => {
+          expectTypeOf(data).toEqualTypeOf<number>()
+        },
+      }),
+    ).toEqualTypeOf<
+      WithRequired<
+        CreateMutationOptions<number, DefaultError, string>,
+        'mutationKey'
+      >
+    >()
+    expectTypeOf(
+      mutationOptions({
+        mutationFn: (id: string) => Promise.resolve(id.length),
+        onSuccess: (data) => {
+          expectTypeOf(data).toEqualTypeOf<number>()
+        },
+      }),
+    ).toEqualTypeOf<
+      Omit<CreateMutationOptions<number, DefaultError, string>, 'mutationKey'>
+    >()
+  })
+
+  it('should infer types when used with injectMutation', () => {
+    const key = queryKey()
+    const mutation = injectMutation(() =>
+      mutationOptions({
+        mutationKey: key,
+        mutationFn: () => Promise.resolve('data'),
+        onSuccess: (data) => {
+          expectTypeOf(data).toEqualTypeOf<string>()
+        },
+      }),
+    )
+    expectTypeOf(mutation).toEqualTypeOf<
+      CreateMutationResult<string, DefaultError, void, unknown>
+    >()
+
+    injectMutation(
+      // should allow when used with injectMutation without mutationKey
+      () =>
+        mutationOptions({
+          mutationFn: () => Promise.resolve('data'),
+          onSuccess: (data) => {
+            expectTypeOf(data).toEqualTypeOf<string>()
+          },
+        }),
+    )
+  })
+
+  it('should infer types when used with injectIsMutating', () => {
+    const key = queryKey()
+    const isMutating = injectIsMutating(
+      mutationOptions({
+        mutationKey: key,
+        mutationFn: () => Promise.resolve(5),
+      }),
+    )
+    expectTypeOf(isMutating()).toEqualTypeOf<number>()
+
+    injectIsMutating(
+      // @ts-expect-error filters should have mutationKey
+      mutationOptions({
+        mutationFn: () => Promise.resolve(5),
+      }),
+    )
+  })
+
+  it('should infer types when used with queryClient.isMutating', () => {
+    const key = queryKey()
+    const queryClient = new QueryClient()
+
+    const isMutating = queryClient.isMutating(
+      mutationOptions({
+        mutationKey: key,
+        mutationFn: () => Promise.resolve(5),
+      }),
+    )
+    expectTypeOf(isMutating).toEqualTypeOf<number>()
+
+    queryClient.isMutating(
+      // @ts-expect-error filters should have mutationKey
+      mutationOptions({
+        mutationFn: () => Promise.resolve(5),
+      }),
+    )
+  })
+
+  it('should infer types when used with injectMutationState', () => {
+    const key = queryKey()
+    const mutationState = injectMutationState(() => ({
+      filters: mutationOptions({
+        mutationKey: key,
+        mutationFn: () => Promise.resolve(5),
+      }),
+    }))
+    expectTypeOf(mutationState()).toEqualTypeOf<
+      Array<MutationState<unknown, Error, unknown, unknown>>
+    >()
+
+    injectMutationState({
+      // @ts-expect-error filters should have mutationKey
+      filters: mutationOptions({
+        mutationFn: () => Promise.resolve(5),
+      }),
+    })
+  })
+})

package/src/__tests__/mutation-options.test.ts

@@ -0,0 +1,344 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { provideZonelessChangeDetection } from '@angular/core'
+import { TestBed } from '@angular/core/testing'
+import { QueryClient } from '@tanstack/query-core'
+import { queryKey, sleep } from '@tanstack/query-test-utils'
+import {
+  injectIsMutating,
+  injectMutation,
+  injectMutationState,
+  mutationOptions,
+  provideTanStackQuery,
+} from '..'
+import type { CreateMutationOptions } from '../types'
+
+describe('mutationOptions', () => {
+  let queryClient: QueryClient
+
+  beforeEach(() => {
+    vi.useFakeTimers()
+    queryClient = new QueryClient()
+    TestBed.configureTestingModule({
+      providers: [
+        provideZonelessChangeDetection(),
+        provideTanStackQuery(queryClient),
+      ],
+    })
+  })
+
+  afterEach(() => {
+    vi.useRealTimers()
+  })
+
+  it('should return the object received as a parameter without any modification (with mutationKey in mutationOptions)', () => {
+    const key = queryKey()
+    const object: CreateMutationOptions = {
+      mutationKey: key,
+      mutationFn: () => sleep(10).then(() => 5),
+    } as const
+
+    expect(mutationOptions(object)).toBe(object)
+  })
+
+  it('should return the object received as a parameter without any modification (without mutationKey in mutationOptions)', () => {
+    const object: CreateMutationOptions = {
+      mutationFn: () => sleep(10).then(() => 5),
+    } as const
+
+    expect(mutationOptions(object)).toBe(object)
+  })
+
+  it('should return the number of fetching mutations when used with injectIsMutating (with mutationKey in mutationOptions)', async () => {
+    const key = queryKey()
+    const mutationOpts = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(50).then(() => 'data'),
+    })
+
+    const [mutation, isMutating] = TestBed.runInInjectionContext(() => [
+      injectMutation(() => mutationOpts),
+      injectIsMutating(),
+    ])
+
+    expect(isMutating()).toBe(0)
+
+    mutation.mutate()
+    expect(isMutating()).toBe(0)
+    await vi.advanceTimersByTimeAsync(0)
+    expect(isMutating()).toBe(1)
+    await vi.advanceTimersByTimeAsync(51)
+    expect(isMutating()).toBe(0)
+  })
+
+  it('should return the number of fetching mutations when used with injectIsMutating (without mutationKey in mutationOptions)', async () => {
+    const mutationOpts = mutationOptions({
+      mutationFn: () => sleep(50).then(() => 'data'),
+    })
+
+    const [mutation, isMutating] = TestBed.runInInjectionContext(() => [
+      injectMutation(() => mutationOpts),
+      injectIsMutating(),
+    ])
+
+    expect(isMutating()).toBe(0)
+
+    mutation.mutate()
+    expect(isMutating()).toBe(0)
+    await vi.advanceTimersByTimeAsync(0)
+    expect(isMutating()).toBe(1)
+    await vi.advanceTimersByTimeAsync(51)
+    expect(isMutating()).toBe(0)
+  })
+
+  it('should return the number of fetching mutations when used with injectIsMutating', async () => {
+    const key = queryKey()
+    const mutationOpts1 = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(50).then(() => 'data1'),
+    })
+    const mutationOpts2 = mutationOptions({
+      mutationFn: () => sleep(50).then(() => 'data2'),
+    })
+
+    const [mutation1, mutation2, isMutating] = TestBed.runInInjectionContext(
+      () => [
+        injectMutation(() => mutationOpts1),
+        injectMutation(() => mutationOpts2),
+        injectIsMutating(),
+      ],
+    )
+
+    expect(isMutating()).toBe(0)
+
+    mutation1.mutate()
+    mutation2.mutate()
+    expect(isMutating()).toBe(0)
+    await vi.advanceTimersByTimeAsync(0)
+    expect(isMutating()).toBe(2)
+    await vi.advanceTimersByTimeAsync(51)
+    expect(isMutating()).toBe(0)
+  })
+
+  it('should return the number of fetching mutations when used with injectIsMutating (filter mutationOpts1.mutationKey)', async () => {
+    const key = queryKey()
+    const mutationOpts1 = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(50).then(() => 'data1'),
+    })
+    const mutationOpts2 = mutationOptions({
+      mutationFn: () => sleep(50).then(() => 'data2'),
+    })
+
+    const [mutation1, mutation2, isMutating] = TestBed.runInInjectionContext(
+      () => [
+        injectMutation(() => mutationOpts1),
+        injectMutation(() => mutationOpts2),
+        injectIsMutating({ mutationKey: mutationOpts1.mutationKey }),
+      ],
+    )
+
+    expect(isMutating()).toBe(0)
+
+    mutation1.mutate()
+    mutation2.mutate()
+    expect(isMutating()).toBe(0)
+    await vi.advanceTimersByTimeAsync(0)
+    expect(isMutating()).toBe(1)
+    await vi.advanceTimersByTimeAsync(51)
+    expect(isMutating()).toBe(0)
+  })
+
+  it('should return the number of fetching mutations when used with queryClient.isMutating (with mutationKey in mutationOptions)', async () => {
+    const key = queryKey()
+    const mutationOpts = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(500).then(() => 'data'),
+    })
+
+    const mutation = TestBed.runInInjectionContext(() =>
+      injectMutation(() => mutationOpts),
+    )
+
+    expect(queryClient.isMutating(mutationOpts)).toBe(0)
+
+    mutation.mutate()
+    expect(queryClient.isMutating(mutationOpts)).toBe(1)
+    await vi.advanceTimersByTimeAsync(501)
+    expect(queryClient.isMutating(mutationOpts)).toBe(0)
+  })
+
+  it('should return the number of fetching mutations when used with queryClient.isMutating (without mutationKey in mutationOptions)', async () => {
+    const mutationOpts = mutationOptions({
+      mutationFn: () => sleep(500).then(() => 'data'),
+    })
+
+    const mutation = TestBed.runInInjectionContext(() =>
+      injectMutation(() => mutationOpts),
+    )
+
+    expect(queryClient.isMutating()).toBe(0)
+
+    mutation.mutate()
+    expect(queryClient.isMutating()).toBe(1)
+    await vi.advanceTimersByTimeAsync(501)
+    expect(queryClient.isMutating()).toBe(0)
+  })
+
+  it('should return the number of fetching mutations when used with queryClient.isMutating', async () => {
+    const key = queryKey()
+    const mutationOpts1 = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(500).then(() => 'data1'),
+    })
+    const mutationOpts2 = mutationOptions({
+      mutationFn: () => sleep(500).then(() => 'data2'),
+    })
+
+    const [mutation1, mutation2] = TestBed.runInInjectionContext(() => [
+      injectMutation(() => mutationOpts1),
+      injectMutation(() => mutationOpts2),
+    ])
+
+    expect(queryClient.isMutating()).toBe(0)
+
+    mutation1.mutate()
+    mutation2.mutate()
+    expect(queryClient.isMutating()).toBe(2)
+    await vi.advanceTimersByTimeAsync(501)
+    expect(queryClient.isMutating()).toBe(0)
+  })
+
+  it('should return the number of fetching mutations when used with queryClient.isMutating (filter mutationOpt1.mutationKey)', async () => {
+    const key = queryKey()
+    const mutationOpts1 = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(500).then(() => 'data1'),
+    })
+    const mutationOpts2 = mutationOptions({
+      mutationFn: () => sleep(500).then(() => 'data2'),
+    })
+
+    const [mutation1, mutation2] = TestBed.runInInjectionContext(() => [
+      injectMutation(() => mutationOpts1),
+      injectMutation(() => mutationOpts2),
+    ])
+
+    expect(
+      queryClient.isMutating({ mutationKey: mutationOpts1.mutationKey }),
+    ).toBe(0)
+
+    mutation1.mutate()
+    mutation2.mutate()
+    expect(
+      queryClient.isMutating({ mutationKey: mutationOpts1.mutationKey }),
+    ).toBe(1)
+    await vi.advanceTimersByTimeAsync(501)
+    expect(
+      queryClient.isMutating({ mutationKey: mutationOpts1.mutationKey }),
+    ).toBe(0)
+  })
+
+  it('should return the number of fetching mutations when used with injectMutationState (with mutationKey in mutationOptions)', async () => {
+    const key = queryKey()
+    const mutationOpts = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(10).then(() => 'data'),
+    })
+
+    const [mutation, mutationState] = TestBed.runInInjectionContext(() => [
+      injectMutation(() => mutationOpts),
+      injectMutationState(() => ({
+        filters: { mutationKey: mutationOpts.mutationKey, status: 'success' },
+      })),
+    ])
+
+    expect(mutationState().length).toBe(0)
+
+    mutation.mutate()
+    await vi.advanceTimersByTimeAsync(11)
+    expect(mutationState().length).toBe(1)
+    expect(mutationState()[0]?.data).toBe('data')
+  })
+
+  it('should return the number of fetching mutations when used with injectMutationState (without mutationKey in mutationOptions)', async () => {
+    const mutationOpts = mutationOptions({
+      mutationFn: () => sleep(10).then(() => 'data'),
+    })
+
+    const [mutation, mutationState] = TestBed.runInInjectionContext(() => [
+      injectMutation(() => mutationOpts),
+      injectMutationState(() => ({
+        filters: { status: 'success' },
+      })),
+    ])
+
+    expect(mutationState().length).toBe(0)
+
+    mutation.mutate()
+    await vi.advanceTimersByTimeAsync(11)
+    expect(mutationState().length).toBe(1)
+    expect(mutationState()[0]?.data).toBe('data')
+  })
+
+  it('should return the number of fetching mutations when used with injectMutationState', async () => {
+    const key = queryKey()
+    const mutationOpts1 = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(10).then(() => 'data1'),
+    })
+    const mutationOpts2 = mutationOptions({
+      mutationFn: () => sleep(10).then(() => 'data2'),
+    })
+
+    const [mutation1, mutation2, mutationState] = TestBed.runInInjectionContext(
+      () => [
+        injectMutation(() => mutationOpts1),
+        injectMutation(() => mutationOpts2),
+        injectMutationState(() => ({
+          filters: { status: 'success' },
+        })),
+      ],
+    )
+
+    expect(mutationState().length).toBe(0)
+
+    mutation1.mutate()
+    mutation2.mutate()
+    await vi.advanceTimersByTimeAsync(11)
+    expect(mutationState().length).toBe(2)
+    expect(mutationState()[0]?.data).toBe('data1')
+    expect(mutationState()[1]?.data).toBe('data2')
+  })
+
+  it('should return the number of fetching mutations when used with injectMutationState (filter mutationOpt1.mutationKey)', async () => {
+    const key = queryKey()
+    const mutationOpts1 = mutationOptions({
+      mutationKey: key,
+      mutationFn: () => sleep(10).then(() => 'data1'),
+    })
+    const mutationOpts2 = mutationOptions({
+      mutationFn: () => sleep(10).then(() => 'data2'),
+    })
+
+    const [mutation1, mutation2, mutationState] = TestBed.runInInjectionContext(
+      () => [
+        injectMutation(() => mutationOpts1),
+        injectMutation(() => mutationOpts2),
+        injectMutationState(() => ({
+          filters: {
+            mutationKey: mutationOpts1.mutationKey,
+            status: 'success',
+          },
+        })),
+      ],
+    )
+
+    expect(mutationState().length).toBe(0)
+
+    mutation1.mutate()
+    mutation2.mutate()
+    await vi.advanceTimersByTimeAsync(11)
+    expect(mutationState().length).toBe(1)
+    expect(mutationState()[0]?.data).toBe('data1')
+  })
+})