@tanstack/vue-query 5.40.0 → 5.40.1

package/src/__tests__/useQuery.test-d.ts

@@ -0,0 +1,228 @@
+import { describe, expectTypeOf, it } from 'vitest'
+import { reactive } from 'vue-demi'
+import { useQuery } from '../useQuery'
+import { queryOptions } from '../queryOptions'
+import { simpleFetcher } from './test-utils'
+import type { OmitKeyof } from '..'
+import type { UseQueryOptions } from '../useQuery'
+
+describe('initialData', () => {
+  describe('Config object overload', () => {
+    it('TData should always be defined when initialData is provided as an object', () => {
+      const { data } = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: () => {
+            return {
+              wow: true,
+            }
+          },
+          initialData: {
+            wow: true,
+          },
+        }),
+      )
+
+      expectTypeOf(data).toEqualTypeOf<{ wow: boolean }>()
+    })
+
+    it('TData should be defined when passed through queryOptions', () => {
+      const options = queryOptions({
+        queryKey: ['key'],
+        queryFn: () => {
+          return {
+            wow: true,
+          }
+        },
+        initialData: {
+          wow: true,
+        },
+      })
+      const { data } = reactive(useQuery(options))
+
+      expectTypeOf(data).toEqualTypeOf<{ wow: boolean }>()
+    })
+
+    it('it should be possible to define a different TData than TQueryFnData using select with queryOptions spread into useQuery', () => {
+      const options = queryOptions({
+        queryKey: ['key'],
+        queryFn: () => Promise.resolve(1),
+      })
+
+      const query = reactive(
+        useQuery({
+          ...options,
+          select: (data) => data > 1,
+        }),
+      )
+
+      expectTypeOf(query.data).toEqualTypeOf<boolean | undefined>()
+    })
+
+    it('TData should always be defined when initialData is provided as a function which ALWAYS returns the data', () => {
+      const { data } = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: () => {
+            return {
+              wow: true,
+            }
+          },
+          initialData: () => ({
+            wow: true,
+          }),
+        }),
+      )
+
+      expectTypeOf(data).toEqualTypeOf<{ wow: boolean }>()
+    })
+
+    it('TData should have undefined in the union when initialData is NOT provided', () => {
+      const { data } = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: () => {
+            return {
+              wow: true,
+            }
+          },
+        }),
+      )
+
+      expectTypeOf(data).toEqualTypeOf<{ wow: boolean } | undefined>()
+    })
+
+    it('TData should have undefined in the union when initialData is provided as a function which can return undefined', () => {
+      const { data } = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: () => {
+            return {
+              wow: true,
+            }
+          },
+          initialData: () => undefined as { wow: boolean } | undefined,
+        }),
+      )
+
+      expectTypeOf(data).toEqualTypeOf<{ wow: boolean } | undefined>()
+    })
+
+    it('TData should be narrowed after an isSuccess check when initialData is provided as a function which can return undefined', () => {
+      const { data, isSuccess } = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: () => {
+            return {
+              wow: true,
+            }
+          },
+          initialData: () => undefined as { wow: boolean } | undefined,
+        }),
+      )
+
+      if (isSuccess) {
+        expectTypeOf(data).toEqualTypeOf<{ wow: boolean }>()
+      }
+    })
+  })
+
+  describe('custom composable', () => {
+    it('should allow custom composable using UseQueryOptions', () => {
+      const useCustomQuery = (
+        options?: OmitKeyof<
+          UseQueryOptions<string>,
+          'queryKey' | 'queryFn',
+          'safely'
+        >,
+      ) => {
+        return useQuery({
+          ...options,
+          queryKey: ['todos-key'],
+          queryFn: () => Promise.resolve('data'),
+        })
+      }
+
+      const { data } = reactive(useCustomQuery())
+
+      expectTypeOf(data).toEqualTypeOf<string | undefined>()
+    })
+  })
+
+  describe('structuralSharing', () => {
+    it('should restrict to same types', () => {
+      useQuery({
+        queryKey: ['key'],
+        queryFn: () => 5,
+        structuralSharing: (_oldData, newData) => {
+          return newData
+        },
+      })
+    })
+  })
+
+  describe('Discriminated union return type', () => {
+    it('data should be possibly undefined by default', () => {
+      const query = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: simpleFetcher,
+        }),
+      )
+
+      expectTypeOf(query.data).toEqualTypeOf<string | undefined>()
+    })
+
+    it('data should be defined when query is success', () => {
+      const query = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: simpleFetcher,
+        }),
+      )
+
+      if (query.isSuccess) {
+        expectTypeOf(query.data).toEqualTypeOf<string>()
+      }
+    })
+
+    it('error should be null when query is success', () => {
+      const query = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: simpleFetcher,
+        }),
+      )
+
+      if (query.isSuccess) {
+        expectTypeOf(query.error).toEqualTypeOf<null>()
+      }
+    })
+
+    it('data should be undefined when query is pending', () => {
+      const query = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: simpleFetcher,
+        }),
+      )
+
+      if (query.isPending) {
+        expectTypeOf(query.data).toEqualTypeOf<undefined>()
+      }
+    })
+
+    it('error should be defined when query is error', () => {
+      const query = reactive(
+        useQuery({
+          queryKey: ['key'],
+          queryFn: simpleFetcher,
+        }),
+      )
+
+      if (query.isError) {
+        expectTypeOf(query.error).toEqualTypeOf<Error>()
+      }
+    })
+  })
+})

package/src/useQueries.ts

@@ -42,6 +42,9 @@ type UseQueryOptionsForUseQueries<
 // Avoid TS depth-limit error in case of large array literal
 type MAXIMUM_DEPTH = 20
 
+// Widen the type of the symbol to enable type inference even if skipToken is not immutable.
+type SkipTokenForUseQueries = symbol
+
 type GetOptions<T> =
   // Part 1: if UseQueryOptions are already being sent through, then just return T
   T extends UseQueryOptions
@@ -66,34 +69,20 @@ type GetOptions<T> =
                 ? UseQueryOptionsForUseQueries<TQueryFnData>
                 : // Part 4: responsible for inferring and enforcing type if no explicit parameter was provided
                   T extends {
-                      queryFn?: QueryFunction<
-                        infer TQueryFnData,
-                        infer TQueryKey
-                      >
+                      queryFn?:
+                        | QueryFunction<infer TQueryFnData, infer TQueryKey>
+                        | SkipTokenForUseQueries
                       select?: (data: any) => infer TData
                       throwOnError?: ThrowOnError<any, infer TError, any, any>
                     }
                   ? UseQueryOptionsForUseQueries<
                       TQueryFnData,
-                      TError,
-                      TData,
+                      unknown extends TError ? DefaultError : TError,
+                      unknown extends TData ? TQueryFnData : TData,
                       TQueryKey
                     >
-                  : T extends {
-                        queryFn?: QueryFunction<
-                          infer TQueryFnData,
-                          infer TQueryKey
-                        >
-                        throwOnError?: ThrowOnError<any, infer TError, any, any>
-                      }
-                    ? UseQueryOptionsForUseQueries<
-                        TQueryFnData,
-                        TError,
-                        TQueryFnData,
-                        TQueryKey
-                      >
-                    : // Fallback
-                      UseQueryOptionsForUseQueries
+                  : // Fallback
+                    UseQueryOptionsForUseQueries
 
 // A defined initialData setting should return a DefinedQueryObserverResult rather than QueryObserverResult
 type GetDefinedOrUndefinedQueryResult<T, TData, TError = unknown> = T extends {
@@ -124,7 +113,7 @@ type GetResults<T> =
     ? GetDefinedOrUndefinedQueryResult<
         T,
         undefined extends TData ? TQueryFnData : TData,
-        TError
+        unknown extends TError ? DefaultError : TError
       >
     : // Part 2: responsible for mapping explicit type parameter to function result, if object
       T extends { queryFnData: any; error?: infer TError; data: infer TData }
@@ -142,7 +131,9 @@ type GetResults<T> =
                 ? GetDefinedOrUndefinedQueryResult<T, TQueryFnData>
                 : // Part 4: responsible for mapping inferred type to results, if no explicit parameter was provided
                   T extends {
-                      queryFn?: QueryFunction<infer TQueryFnData, any>
+                      queryFn?:
+                        | QueryFunction<infer TQueryFnData, any>
+                        | SkipTokenForUseQueries
                       select?: (data: any) => infer TData
                       throwOnError?: ThrowOnError<any, infer TError, any, any>
                     }
@@ -151,17 +142,8 @@ type GetResults<T> =
                       unknown extends TData ? TQueryFnData : TData,
                       unknown extends TError ? DefaultError : TError
                     >
-                  : T extends {
-                        queryFn?: QueryFunction<infer TQueryFnData, any>
-                        throwOnError?: ThrowOnError<any, infer TError, any, any>
-                      }
-                    ? GetDefinedOrUndefinedQueryResult<
-                        T,
-                        TQueryFnData,
-                        unknown extends TError ? DefaultError : TError
-                      >
-                    : // Fallback
-                      QueryObserverResult
+                  : // Fallback
+                    QueryObserverResult
 
 /**
  * UseQueriesOptions reducer recursively unwraps function arguments to infer/enforce type param
@@ -182,7 +164,7 @@ export type UseQueriesOptions<
             [...TResult, GetOptions<Head>],
             [...TDepth, 1]
           >
-        : Readonly<unknown> extends T
+        : ReadonlyArray<unknown> extends T
           ? T
           : // If T is *some* array but we couldn't assign unknown[] to it, then it must hold some known/homogenous type!
             // use this to infer the param types in the case of Array.map() argument
@@ -236,7 +218,7 @@ export type UseQueriesResults<
             Array<
               QueryObserverResult<
                 unknown extends TData ? TQueryFnData : TData,
-                TError
+                unknown extends TError ? DefaultError : TError
               >
             >
           : // Fallback

package/src/__tests__/queryClient.type.test.ts

@@ -1,174 +0,0 @@
-import { describe, it } from 'vitest'
-import { QueryClient } from '../queryClient'
-import { doNotExecute } from './test-utils'
-import type { Equal, Expect } from './test-utils'
-import type { DataTag, InfiniteData } from '@tanstack/query-core'
-
-describe('getQueryData', () => {
-  it('should be typed if key is tagged', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as DataTag<Array<string>, number>
-      const queryClient = new QueryClient()
-      const data = queryClient.getQueryData(queryKey)
-
-      const result: Expect<Equal<typeof data, number | undefined>> = true
-      return result
-    })
-  })
-
-  it('should infer unknown if key is not tagged', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as const
-      const queryClient = new QueryClient()
-      const data = queryClient.getQueryData(queryKey)
-
-      const result: Expect<Equal<typeof data, unknown>> = true
-      return result
-    })
-  })
-
-  it('should infer passed generic if passed', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as const
-      const queryClient = new QueryClient()
-      const data = queryClient.getQueryData<number>(queryKey)
-
-      const result: Expect<Equal<typeof data, number | undefined>> = true
-      return result
-    })
-  })
-
-  it('should only allow Arrays to be passed', () => {
-    doNotExecute(() => {
-      const queryKey = 'key' as const
-      const queryClient = new QueryClient()
-      // @ts-expect-error TS2345: Argument of type 'string' is not assignable to parameter of type 'QueryKey'
-      return queryClient.getQueryData(queryKey)
-    })
-  })
-})
-
-describe('setQueryData', () => {
-  it('updater should be typed if key is tagged', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as DataTag<Array<string>, number>
-      const queryClient = new QueryClient()
-      const data = queryClient.setQueryData(queryKey, (prev) => {
-        const result: Expect<Equal<typeof prev, number | undefined>> = true
-        return result ? prev : 1
-      })
-
-      const result: Expect<Equal<typeof data, number | undefined>> = true
-      return result
-    })
-  })
-
-  it('value should be typed if key is tagged', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as DataTag<Array<string>, number>
-      const queryClient = new QueryClient()
-
-      // @ts-expect-error value should be a number
-      queryClient.setQueryData(queryKey, '1')
-
-      // @ts-expect-error value should be a number
-      queryClient.setQueryData(queryKey, () => '1')
-
-      const data = queryClient.setQueryData(queryKey, 1)
-
-      const result: Expect<Equal<typeof data, number | undefined>> = true
-      return result
-    })
-  })
-
-  it('should infer unknown for updater if key is not tagged', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as const
-      const queryClient = new QueryClient()
-      const data = queryClient.setQueryData(queryKey, (prev) => {
-        const result: Expect<Equal<typeof prev, unknown>> = true
-        return result ? prev : 1
-      })
-
-      const result: Expect<Equal<typeof data, unknown>> = true
-      return result
-    })
-  })
-
-  it('should infer unknown for value if key is not tagged', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as const
-      const queryClient = new QueryClient()
-      const data = queryClient.setQueryData(queryKey, 'foo')
-
-      const result: Expect<Equal<typeof data, unknown>> = true
-      return result
-    })
-  })
-
-  it('should infer passed generic if passed', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as const
-      const queryClient = new QueryClient()
-      const data = queryClient.setQueryData<string>(queryKey, (prev) => {
-        const result: Expect<Equal<typeof prev, string | undefined>> = true
-        return result ? prev : '1'
-      })
-
-      const result: Expect<Equal<typeof data, string | undefined>> = true
-      return result
-    })
-  })
-
-  it('should infer passed generic for value', () => {
-    doNotExecute(() => {
-      const queryKey = ['key'] as const
-      const queryClient = new QueryClient()
-      const data = queryClient.setQueryData<string>(queryKey, 'foo')
-
-      const result: Expect<Equal<typeof data, string | undefined>> = true
-      return result
-    })
-  })
-})
-
-describe('fetchInfiniteQuery', () => {
-  it('should allow passing pages', () => {
-    doNotExecute(async () => {
-      const data = await new QueryClient().fetchInfiniteQuery({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve('string'),
-        getNextPageParam: () => 1,
-        initialPageParam: 1,
-        pages: 5,
-      })
-
-      const result: Expect<Equal<typeof data, InfiniteData<string, number>>> =
-        true
-      return result
-    })
-  })
-
-  it('should not allow passing getNextPageParam without pages', () => {
-    doNotExecute(async () => {
-      return new QueryClient().fetchInfiniteQuery({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve('string'),
-        initialPageParam: 1,
-        getNextPageParam: () => 1,
-      })
-    })
-  })
-
-  it('should not allow passing pages without getNextPageParam', () => {
-    doNotExecute(async () => {
-      // @ts-expect-error Property 'getNextPageParam' is missing
-      return new QueryClient().fetchInfiniteQuery({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve('string'),
-        initialPageParam: 1,
-        pages: 5,
-      })
-    })
-  })
-})

package/src/__tests__/queryOptions.types.test.ts

@@ -1,170 +0,0 @@
-import { describe, it } from 'vitest'
-import { reactive, ref } from 'vue-demi'
-import { QueryClient } from '../queryClient'
-import { queryOptions } from '../queryOptions'
-import { useQuery } from '../useQuery'
-import { doNotExecute } from './test-utils'
-import type { dataTagSymbol } from '@tanstack/query-core'
-import type { Equal, Expect } from './test-utils'
-
-describe('queryOptions', () => {
-  it('should not allow excess properties', () => {
-    doNotExecute(() => {
-      return queryOptions({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve(5),
-        // @ts-expect-error this is a good error, because stallTime does not exist!
-        stallTime: 1000,
-      })
-    })
-  })
-  it('should infer types for callbacks', () => {
-    doNotExecute(() => {
-      return queryOptions({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve(5),
-        staleTime: 1000,
-        select: (data) => {
-          const result: Expect<Equal<number, typeof data>> = true
-          return result
-        },
-      })
-    })
-  })
-  it('should work when passed to useQuery', () => {
-    doNotExecute(() => {
-      const options = queryOptions({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve(5),
-      })
-
-      const { data } = reactive(useQuery(options))
-
-      const result: Expect<Equal<typeof data, number | undefined>> = true
-
-      return result
-    })
-  })
-  it('should tag the queryKey with the result type of the QueryFn', () => {
-    doNotExecute(() => {
-      const { queryKey } = queryOptions({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve(5),
-      })
-
-      const result: Expect<
-        Equal<(typeof queryKey)[typeof dataTagSymbol], number>
-      > = true
-      return result
-    })
-  })
-  it('should tag the queryKey even if no promise is returned', () => {
-    doNotExecute(() => {
-      const { queryKey } = queryOptions({
-        queryKey: ['key'],
-        queryFn: () => 5,
-      })
-
-      const result: Expect<
-        Equal<(typeof queryKey)[typeof dataTagSymbol], number>
-      > = true
-      return result
-    })
-  })
-  it('should tag the queryKey with unknown if there is no queryFn', () => {
-    doNotExecute(() => {
-      const { queryKey } = queryOptions({
-        queryKey: ['key'],
-      })
-
-      const result: Expect<
-        Equal<(typeof queryKey)[typeof dataTagSymbol], unknown>
-      > = true
-      return result
-    })
-  })
-  it('should tag the queryKey with the result type of the QueryFn if select is used', () => {
-    doNotExecute(() => {
-      const { queryKey } = queryOptions({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve(5),
-        select: (data) => data.toString(),
-      })
-
-      const result: Expect<
-        Equal<(typeof queryKey)[typeof dataTagSymbol], number>
-      > = true
-      return result
-    })
-  })
-  it('should return the proper type when passed to getQueryData', () => {
-    doNotExecute(() => {
-      const { queryKey } = queryOptions({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve(5),
-      })
-
-      const queryClient = new QueryClient()
-      const data = queryClient.getQueryData(queryKey)
-
-      const result: Expect<Equal<typeof data, number | undefined>> = true
-      return result
-    })
-  })
-  it('should properly type updaterFn when passed to setQueryData', () => {
-    doNotExecute(() => {
-      const { queryKey } = queryOptions({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve(5),
-      })
-
-      const queryClient = new QueryClient()
-      const data = queryClient.setQueryData(queryKey, (prev) => {
-        const result: Expect<Equal<typeof prev, number | undefined>> = true
-        return result ? prev : 1
-      })
-
-      const result: Expect<Equal<typeof data, number | undefined>> = true
-      return result
-    })
-  })
-  it('should properly type value when passed to setQueryData', () => {
-    doNotExecute(() => {
-      const { queryKey } = queryOptions({
-        queryKey: ['key'],
-        queryFn: () => Promise.resolve(5),
-      })
-
-      const queryClient = new QueryClient()
-
-      // @ts-expect-error value should be a number
-      queryClient.setQueryData(queryKey, '5')
-      // @ts-expect-error value should be a number
-      queryClient.setQueryData(queryKey, () => '5')
-
-      const data = queryClient.setQueryData(queryKey, 5)
-
-      const result: Expect<Equal<typeof data, number | undefined>> = true
-      return result
-    })
-  })
-  it('should allow to be passed to QueryClient methods while containing ref in queryKey', () => {
-    doNotExecute(() => {
-      const options = queryOptions({
-        queryKey: ['key', ref(1), { nested: ref(2) }],
-        queryFn: () => Promise.resolve(5),
-      })
-
-      const queryClient = new QueryClient()
-
-      // Should not error
-      const data = queryClient.invalidateQueries(options)
-      // Should not error
-      const data2 = queryClient.fetchQuery(options)
-
-      const result: Expect<Equal<typeof data, Promise<void>>> = true
-      const result2: Expect<Equal<typeof data2, Promise<number>>> = true
-      return result || result2
-    })
-  })
-})