Skip to content

Commit

Permalink
feat(openapi-react-query): Pass abort signal to fetch
Browse files Browse the repository at this point in the history
  • Loading branch information
zsugabubus committed Aug 30, 2024
1 parent 68b5cb6 commit 0778893
Show file tree
Hide file tree
Showing 3 changed files with 53 additions and 5 deletions.
5 changes: 5 additions & 0 deletions .changeset/signal.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"openapi-react-query": patch
---

Pass down signal to fetch function this way `useQuery` and `useSuspenseQuery` can cancel queries.
8 changes: 4 additions & 4 deletions packages/openapi-react-query/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -70,10 +70,10 @@ export default function createClient<Paths extends {}, Media extends MediaType =
return useQuery(
{
queryKey: [method, path, init],
queryFn: async () => {
queryFn: async ({ signal }) => {
const mth = method.toUpperCase() as keyof typeof client;
const fn = client[mth] as ClientMethod<Paths, typeof method, Media>;
const { data, error } = await fn(path, init as any); // TODO: find a way to avoid as any
const { data, error } = await fn(path, { signal, ...(init as any) }); // TODO: find a way to avoid as any
if (error || !data) {
throw error;
}
Expand All @@ -88,10 +88,10 @@ export default function createClient<Paths extends {}, Media extends MediaType =
return useSuspenseQuery(
{
queryKey: [method, path, init],
queryFn: async () => {
queryFn: async ({ signal }) => {
const mth = method.toUpperCase() as keyof typeof client;
const fn = client[mth] as ClientMethod<Paths, typeof method, Media>;
const { data, error } = await fn(path, init as any); // TODO: find a way to avoid as any
const { data, error } = await fn(path, { signal, ...(init as any) }); // TODO: find a way to avoid as any
if (error || !data) {
throw error;
}
Expand Down
45 changes: 44 additions & 1 deletion packages/openapi-react-query/test/index.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { server, baseUrl, useMockRequestHandler } from "./fixtures/mock-server.j
import type { paths } from "./fixtures/api.js";
import createClient from "../src/index.js";
import createFetchClient from "openapi-fetch";
import { fireEvent, render, renderHook, screen, waitFor } from "@testing-library/react";
import { fireEvent, render, renderHook, screen, waitFor, act } from "@testing-library/react";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { Suspense, type ReactNode } from "react";
import { ErrorBoundary } from "react-error-boundary";
Expand Down Expand Up @@ -109,6 +109,26 @@ describe("client", () => {
expectTypeOf(error).toEqualTypeOf<{ code: number; message: string } | null>();
});

it("passes abort signal to fetch", async () => {
let signalPassedToFetch: AbortSignal | undefined;

const fetchClient = createFetchClient<paths>({
baseUrl,
fetch: async ({ signal }) => {
signalPassedToFetch = signal;
await new Promise(() => {});
return Response.error();
},
});
const client = createClient(fetchClient);

const { unmount } = renderHook(() => client.useQuery("get", "/string-array"), { wrapper });

unmount();

expect(signalPassedToFetch?.aborted).toBeTruthy();
});

describe("params", () => {
it("should be required if OpenAPI schema requires params", async () => {
const fetchClient = createFetchClient<paths>({ baseUrl });
Expand Down Expand Up @@ -258,6 +278,29 @@ describe("client", () => {

await waitFor(() => rendered.findByText("data: Hello"));
});

it("passes abort signal to fetch", async () => {
let signalPassedToFetch: AbortSignal | undefined;

const fetchClient = createFetchClient<paths>({
baseUrl,
fetch: async ({ signal }) => {
signalPassedToFetch = signal;
await new Promise(() => {});
return Response.error();
},
});
const client = createClient(fetchClient);
const queryClient = new QueryClient({});

const { unmount } = renderHook(() => client.useSuspenseQuery("get", "/string-array", {}, {}, queryClient));

unmount();

await act(() => queryClient.cancelQueries());

expect(signalPassedToFetch?.aborted).toBeTruthy();
});
});

describe("useMutation", () => {
Expand Down

0 comments on commit 0778893

Please sign in to comment.