test(react-query): use vitest typecheck correctly with *.test-d.ts (#6978)

Author: manudeli

package.json

@@ -50,7 +50,7 @@
     "@types/react-dom": "^18.2.19",
     "@typescript-eslint/eslint-plugin": "^6.20.0",
     "@typescript-eslint/parser": "^6.20.0",
-    "@vitest/coverage-istanbul": "^1.2.2",
+    "@vitest/coverage-istanbul": "^1.3.1",
     "cpy-cli": "^5.0.0",
     "esbuild-plugin-file-path-extensions": "^2.0.0",
     "eslint": "^8.56.0",
@@ -73,7 +73,7 @@
     "tsup": "^8.0.1",
     "typescript": "5.2.2",
     "vite": "^5.1.1",
-    "vitest": "^1.2.2"
+    "vitest": "^1.3.1"
   },
   "pnpm": {
     "overrides": {

packages/react-query/src/__tests__/infiniteQueryOptions.test-d.tsx

@@ -0,0 +1,142 @@
+import { describe, expectTypeOf, it } from 'vitest'
+import { QueryClient } from '@tanstack/query-core'
+import { infiniteQueryOptions } from '../infiniteQueryOptions'
+import { useInfiniteQuery } from '../useInfiniteQuery'
+import { useSuspenseInfiniteQuery } from '../useSuspenseInfiniteQuery'
+import type { InfiniteData, dataTagSymbol } from '@tanstack/query-core'
+
+describe('queryOptions', () => {
+  it('should not allow excess properties', () => {
+    infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('data'),
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+      // @ts-expect-error this is a good error, because stallTime does not exist!
+      stallTime: 1000,
+    })
+  })
+  it('should infer types for callbacks', () => {
+    infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('data'),
+      staleTime: 1000,
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+      select: (data) => {
+        expectTypeOf(data).toEqualTypeOf<InfiniteData<string, number>>()
+      },
+    })
+  })
+  it('should work when passed to useInfiniteQuery', () => {
+    const options = infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('string'),
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+    })
+
+    const { data } = useInfiniteQuery(options)
+
+    // known issue: type of pageParams is unknown when returned from useInfiniteQuery
+    expectTypeOf(data).toEqualTypeOf<
+      InfiniteData<string, unknown> | undefined
+    >()
+  })
+  it('should work when passed to useSuspenseInfiniteQuery', () => {
+    const options = infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('string'),
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+    })
+
+    const { data } = useSuspenseInfiniteQuery(options)
+
+    expectTypeOf(data).toEqualTypeOf<InfiniteData<string, unknown>>()
+  })
+  it('should work when passed to fetchInfiniteQuery', async () => {
+    const options = infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('string'),
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+    })
+
+    const data = await new QueryClient().fetchInfiniteQuery(options)
+
+    expectTypeOf(data).toEqualTypeOf<InfiniteData<string, number>>()
+  })
+  it('should tag the queryKey with the result type of the QueryFn', () => {
+    const { queryKey } = infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('string'),
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+    })
+
+    expectTypeOf<(typeof queryKey)[typeof dataTagSymbol]>().toEqualTypeOf<
+      InfiniteData<string>
+    >()
+  })
+  it('should tag the queryKey even if no promise is returned', () => {
+    const { queryKey } = infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => 'string',
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+    })
+
+    expectTypeOf<(typeof queryKey)[typeof dataTagSymbol]>().toEqualTypeOf<
+      InfiniteData<string>
+    >()
+  })
+  it('should tag the queryKey with the result type of the QueryFn if select is used', () => {
+    const { queryKey } = infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('string'),
+      select: (data) => data.pages,
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+    })
+
+    expectTypeOf<(typeof queryKey)[typeof dataTagSymbol]>().toEqualTypeOf<
+      InfiniteData<string>
+    >()
+  })
+  it('should return the proper type when passed to getQueryData', () => {
+    const { queryKey } = infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('string'),
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+    })
+
+    const queryClient = new QueryClient()
+    const data = queryClient.getQueryData(queryKey)
+
+    expectTypeOf(data).toEqualTypeOf<
+      InfiniteData<string, unknown> | undefined
+    >()
+  })
+  it('should properly type when passed to setQueryData', () => {
+    const { queryKey } = infiniteQueryOptions({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve('string'),
+      getNextPageParam: () => 1,
+      initialPageParam: 1,
+    })
+
+    const queryClient = new QueryClient()
+    const data = queryClient.setQueryData(queryKey, (prev) => {
+      expectTypeOf(prev).toEqualTypeOf<
+        InfiniteData<string, unknown> | undefined
+      >()
+      return prev
+    })
+
+    expectTypeOf(data).toEqualTypeOf<
+      InfiniteData<string, unknown> | undefined
+    >()
+  })
+})