From b4dfced840c47f91c62b59d7370da788b9599534 Mon Sep 17 00:00:00 2001 From: sho Date: Fri, 1 Sep 2023 00:15:57 +0900 Subject: [PATCH 1/2] Support for type definition when using suspense --- packages/client/src/createSWRProxyHooks.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/client/src/createSWRProxyHooks.tsx b/packages/client/src/createSWRProxyHooks.tsx index 2873e81..9dbb3e6 100644 --- a/packages/client/src/createSWRProxyHooks.tsx +++ b/packages/client/src/createSWRProxyHooks.tsx @@ -24,12 +24,15 @@ type DecorateProcedure< TPath extends string > = TProcedure extends AnyQueryProcedure ? { - useSWR: >( + useSWR: < + TData = inferProcedureOutput, + TConfig extends SWRConfiguration = {} + >( input: inferProcedureInput, - opts?: SWRConfiguration & { + opts?: TConfig & { isDisabled?: boolean; } - ) => SWRResponse>; + ) => SWRResponse, TConfig>; preload: (input: inferProcedureInput) => Promise; getKey: GetKey; From b2283bb1182576fcd69d1c895eee7fc9835f8ff7 Mon Sep 17 00:00:00 2001 From: Sanna Jammeh Date: Thu, 5 Oct 2023 13:57:17 +0000 Subject: [PATCH 2/2] test: add typescript test case for Suspense mode --- test/unit/package.json | 2 +- test/unit/tests/query.spec.tsx | 12 ++- test/unit/tests/ssg.spec.ts | 168 ++++++++++++++++----------------- 3 files changed, 96 insertions(+), 86 deletions(-) diff --git a/test/unit/package.json b/test/unit/package.json index 40ed5f9..0eabf8b 100644 --- a/test/unit/package.json +++ b/test/unit/package.json @@ -7,7 +7,7 @@ "private": true, "scripts": { "run-test": "vitest run", - "test": "vitest run 2>&1 | tee tap.txt", + "test": "tsc --noEmit && vitest run 2>&1 | tee tap.txt", "test:ui": "vitest --ui" }, "keywords": [], diff --git a/test/unit/tests/query.spec.tsx b/test/unit/tests/query.spec.tsx index 7ea1406..5c0af2b 100644 --- a/test/unit/tests/query.spec.tsx +++ b/test/unit/tests/query.spec.tsx @@ -1,6 +1,6 @@ import { useState } from "react"; import { act } from "react-dom/test-utils"; -import { expect, it } from "vitest"; +import { expect, expectTypeOf, it } from "vitest"; import { render, screen, trpc, waitFor } from "../utils"; it("makes query without args", async () => { @@ -65,3 +65,13 @@ it("makes conditional query", async () => { expect(screen.getByText("disabled")).toBeInTheDocument(); }); }); + +it("Allows correct types during suspense", async () => { + () => { + const { data } = trpc.hello.useSWR(void 0, { suspense: true}); + + expectTypeOf(data).toBeString(); + + return

{data}

; + }; +}) \ No newline at end of file diff --git a/test/unit/tests/ssg.spec.ts b/test/unit/tests/ssg.spec.ts index 67d0740..552596e 100644 --- a/test/unit/tests/ssg.spec.ts +++ b/test/unit/tests/ssg.spec.ts @@ -4,108 +4,108 @@ import { unstable_serialize as swr_unstable_serialize } from "swr"; import { appRouter } from "../utils"; import { test, describe } from "vitest"; -describe("unstable_serialize", async (t) => { - await test("Should serialize a string key", () => { - assert.equal(unstable_serialize("/api/users"), "/api/users"); - assert.equal( - unstable_serialize("01GXTWZRVVFX1VDV8FC46S9280"), - "01GXTWZRVVFX1VDV8FC46S9280", - ); - }); - - await test("Should serialize an array key", () => { - assert.equal(unstable_serialize(["/api/users"]), `@"/api/users",`); - }); - - await test("Should serialize an object key", () => { - assert.equal(unstable_serialize({ id: 1 }), "#id:1,"); - }); - - await test("Should match SWR serialization for string", () => { - assert.equal( - unstable_serialize("/api/users"), - swr_unstable_serialize("/api/users"), - ); - }); - - await test("Should match SWR serialization for array", () => { - assert.equal( - unstable_serialize(["/api/users"]), - swr_unstable_serialize(["/api/users"]), - ); - }); - - await test("Should match SWR serialization for object", () => { - assert.equal( - unstable_serialize({ id: 1 }), - swr_unstable_serialize({ id: 1 }), - ); - }); - - await test("Should match SWR serialization for object with array", () => { - assert.equal( - unstable_serialize({ id: 1, arr: [1, 2, 3] }), - swr_unstable_serialize({ id: 1, arr: [1, 2, 3] }), - ); - }); - - await test("Should match SWR serialization for array with object and string", () => { - assert.equal( - unstable_serialize([1, { id: 1 }, "test"]), - swr_unstable_serialize([1, { id: 1 }, "test"]), - ); - }); +describe("unstable_serialize", async () => { + await test("Should serialize a string key", () => { + assert.equal(unstable_serialize("/api/users"), "/api/users"); + assert.equal( + unstable_serialize("01GXTWZRVVFX1VDV8FC46S9280"), + "01GXTWZRVVFX1VDV8FC46S9280" + ); + }); + + await test("Should serialize an array key", () => { + assert.equal(unstable_serialize(["/api/users"]), `@"/api/users",`); + }); + + await test("Should serialize an object key", () => { + assert.equal(unstable_serialize({ id: 1 }), "#id:1,"); + }); + + await test("Should match SWR serialization for string", () => { + assert.equal( + unstable_serialize("/api/users"), + swr_unstable_serialize("/api/users") + ); + }); + + await test("Should match SWR serialization for array", () => { + assert.equal( + unstable_serialize(["/api/users"]), + swr_unstable_serialize(["/api/users"]) + ); + }); + + await test("Should match SWR serialization for object", () => { + assert.equal( + unstable_serialize({ id: 1 }), + swr_unstable_serialize({ id: 1 }) + ); + }); + + await test("Should match SWR serialization for object with array", () => { + assert.equal( + unstable_serialize({ id: 1, arr: [1, 2, 3] }), + swr_unstable_serialize({ id: 1, arr: [1, 2, 3] }) + ); + }); + + await test("Should match SWR serialization for array with object and string", () => { + assert.equal( + unstable_serialize([1, { id: 1 }, "test"]), + swr_unstable_serialize([1, { id: 1 }, "test"]) + ); + }); }); const createSSG = () => { - return createProxySSGHelpers({ - router: appRouter, - ctx: {} as any, - }); + return createProxySSGHelpers({ + router: appRouter, + ctx: {} as any, + }); }; -describe("createProxySSGHelpers", async (t) => { - await test("Should return a proxy object", () => { - const ssg = createSSG(); +describe("createProxySSGHelpers", async () => { + await test("Should return a proxy object", () => { + const ssg = createSSG(); - assert.equal(typeof ssg, "function"); - }); + assert.equal(typeof ssg, "function"); + }); - await test("Should access route", async () => { - const ssg = createSSG(); - const expected_key = '@"hello",'; - assert.equal(typeof ssg.hello, "function"); + await test("Should access route", async () => { + const ssg = createSSG(); + const expected_key = '@"hello",'; + assert.equal(typeof ssg.hello, "function"); - assert.equal(ssg.hello.getKey(), expected_key); - }); + assert.equal(ssg.hello.getKey(), expected_key); + }); - await test("Should fetch from procedure", async () => { - const ssg = createSSG(); + await test("Should fetch from procedure", async () => { + const ssg = createSSG(); - const result = await ssg.hello.fetch(); + const result = await ssg.hello.fetch(); - assert.equal(result, "world"); - }); + assert.equal(result, "world"); + }); - await test("Should dehydrate from procedure when paralell fetch", async () => { - const ssg = createSSG(); + await test("Should dehydrate from procedure when paralell fetch", async () => { + const ssg = createSSG(); - ssg.hello.fetch(); + ssg.hello.fetch(); - const result = await ssg.dehydrate(); + const result = await ssg.dehydrate(); - assert.deepEqual(result, { [ssg.hello.getKey()]: "world" }); - }); + assert.deepEqual(result, { [ssg.hello.getKey()]: "world" }); + }); - await test("Should dehydrate from procedure", async () => { - const ssg = createSSG(); + await test("Should dehydrate from procedure", async () => { + const ssg = createSSG(); - const fetchResult = await ssg.hello.fetch(); + const fetchResult = await ssg.hello.fetch(); - assert.equal(fetchResult, "world"); + assert.equal(fetchResult, "world"); - const result = await ssg.dehydrate(); + const result = await ssg.dehydrate(); - assert.deepEqual(result, { [ssg.hello.getKey()]: "world" }); - }); + assert.deepEqual(result, { [ssg.hello.getKey()]: "world" }); + }); });