Test headers (#1716)

Author: drwpow

packages/openapi-fetch/examples/react-query/package.json

@@ -6,7 +6,7 @@
     "dev": "vite dev"
   },
   "dependencies": {
-    "@tanstack/react-query": "^5.36.2",
+    "@tanstack/react-query": "^5.45.1",
     "openapi-fetch": "workspace:^",
     "openapi-typescript": "workspace:^",
     "react": "^18.3.1",
@@ -15,8 +15,8 @@
   "devDependencies": {
     "@types/react": "18.3.1",
     "@types/react-dom": "18.3.0",
-    "@vitejs/plugin-react-swc": "^3.6.0",
+    "@vitejs/plugin-react-swc": "^3.7.0",
     "typescript": "^5.4.5",
-    "vite": "^5.2.11"
+    "vite": "^5.3.1"
   }
 }

packages/openapi-fetch/examples/react-query/src/hooks/queries.ts

@@ -15,11 +15,7 @@ type UseQueryOptions<T> = ParamsOption<T> &
 // paths
 const GET_FACT = "/fact";
 
-export function getFact({
-  params,
-  body,
-  reactQuery,
-}: UseQueryOptions<paths[typeof GET_FACT]["get"]>) {
+export function getFact({ params, body, reactQuery }: UseQueryOptions<paths[typeof GET_FACT]["get"]>) {
   return useQuery({
     ...reactQuery,
     queryKey: [

packages/openapi-fetch/examples/sveltekit/package.json

@@ -19,6 +19,6 @@
     "svelte-check": "^3.7.1",
     "tslib": "^2.6.2",
     "typescript": "^5.4.5",
-    "vite": "^5.2.11"
+    "vite": "^5.3.1"
   }
 }

packages/openapi-fetch/examples/vue-3/package.json

@@ -12,16 +12,16 @@
   },
   "dependencies": {
     "openapi-fetch": "workspace:^",
-    "vue": "^3.4.27"
+    "vue": "^3.4.29"
   },
   "devDependencies": {
     "@tsconfig/node20": "^20.1.4",
     "@types/node": "^20.14.6",
-    "@vitejs/plugin-vue": "^5.0.4",
+    "@vitejs/plugin-vue": "^5.0.5",
     "@vue/tsconfig": "^0.5.1",
     "openapi-typescript": "workspace:^",
     "typescript": "^5.4.5",
-    "vite": "^5.2.11",
-    "vue-tsc": "^2.0.19"
+    "vite": "^5.3.1",
+    "vue-tsc": "^2.0.21"
   }
 }

packages/openapi-fetch/test/index.test.ts

@@ -1184,6 +1184,59 @@ describe("client", () => {
         expect(() => client.GET("/blogposts")).not.toThrow();
         expect(called).toBe(false);
       });
+
+      it("preserves (and can safely add) headers", async () => {
+        const { getRequest } = useMockRequestHandler({
+          baseUrl,
+          method: "get",
+          path: "/blogposts",
+          status: 200,
+          body: { success: true },
+        });
+
+        const client = createClient<paths>({
+          baseUrl,
+          headers: {
+            createClient: "exists",
+          },
+        });
+
+        client.use(
+          {
+            onRequest({ request }) {
+              // assert headers are kept in middleware onRequest
+              expect(request.headers.get("createClient")).toBe("exists");
+              expect(request.headers.get("onFetch")).toBe("exists");
+              request.headers.set("onRequest", "exists");
+              return request;
+            },
+            onResponse({ request }) {
+              // assert headers are (still) kept in onResponse
+              expect(request.headers.get("createClient")).toBe("exists");
+              expect(request.headers.get("onFetch")).toBe("exists");
+              expect(request.headers.get("onRequest")).toBe("exists");
+            },
+          },
+          {
+            onRequest({ request }) {
+              // also assert a 2nd middleware (that doesn’t modify request) still sees headers
+              expect(request.headers.get("createClient")).toBe("exists");
+              expect(request.headers.get("onFetch")).toBe("exists");
+              expect(request.headers.get("onRequest")).toBe("exists");
+            },
+          },
+        );
+
+        await client.GET("/blogposts", {
+          headers: { onFetch: "exists" },
+        });
+
+        // assert server received them in final request
+        const req = getRequest();
+        expect(req.headers.get("createClient")).toBe("exists");
+        expect(req.headers.get("onFetch")).toBe("exists");
+        expect(req.headers.get("onRequest")).toBe("exists");
+      });
     });
   });