From da1888b8489dba2d028ee170e3317d506af50385 Mon Sep 17 00:00:00 2001 From: Muneeb Date: Tue, 21 Apr 2026 23:27:53 +0200 Subject: [PATCH 1/3] fix(client): preserve Request headers in csrfFetch When csrfFetch was called with a Request object as the first argument, any headers on the Request were stripped because only init?.headers were read. Merge Request headers, then init headers, then CSRF headers so existing headers survive and CSRF headers always take precedence. Fixes #49 --- packages/nextjs/src/client/client.ts | 11 +++++--- packages/nextjs/tests/client.test.ts | 34 +++++++++++++++++++++++ packages/nuxt/src/runtime/utils/client.ts | 11 +++++--- 3 files changed, 48 insertions(+), 8 deletions(-) diff --git a/packages/nextjs/src/client/client.ts b/packages/nextjs/src/client/client.ts index 440e769..94c5678 100644 --- a/packages/nextjs/src/client/client.ts +++ b/packages/nextjs/src/client/client.ts @@ -149,10 +149,13 @@ export function csrfFetch( init?: RequestInit, config?: CsrfClientConfig ): Promise { - const headers = new Headers(init?.headers); - const csrfHeaders = createCsrfHeaders(config); - - for (const [key, value] of Object.entries(csrfHeaders)) { + const headers = new Headers( + input instanceof Request ? input.headers : undefined + ); + for (const [key, value] of new Headers(init?.headers)) { + headers.set(key, value); + } + for (const [key, value] of Object.entries(createCsrfHeaders(config))) { headers.set(key, value); } diff --git a/packages/nextjs/tests/client.test.ts b/packages/nextjs/tests/client.test.ts index 8d6ec72..d079765 100644 --- a/packages/nextjs/tests/client.test.ts +++ b/packages/nextjs/tests/client.test.ts @@ -158,6 +158,40 @@ describe('Client utilities', () => { expect(headers.get('Content-Type')).toBe('application/json'); }); + it('should preserve headers when input is a Request object', async () => { + document.cookie = 'csrf-token=req-token'; + const req = new Request('https://example.com/api/data', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'X-Custom': 'keep-me', + }, + }); + await csrfFetch(req); + + const callArgs = (globalThis.fetch as ReturnType).mock + .calls[0]; + const headers = callArgs[1].headers as Headers; + expect(headers.get('x-csrf-token')).toBe('req-token'); + expect(headers.get('Content-Type')).toBe('application/json'); + expect(headers.get('X-Custom')).toBe('keep-me'); + }); + + it('should let init headers override Request headers', async () => { + document.cookie = 'csrf-token=override-token'; + const req = new Request('https://example.com/api/data', { + method: 'POST', + headers: { 'X-Custom': 'original' }, + }); + await csrfFetch(req, { headers: { 'X-Custom': 'overridden' } }); + + const callArgs = (globalThis.fetch as ReturnType).mock + .calls[0]; + const headers = callArgs[1].headers as Headers; + expect(headers.get('X-Custom')).toBe('overridden'); + expect(headers.get('x-csrf-token')).toBe('override-token'); + }); + it('should work without a token', async () => { await csrfFetch('/api/data'); diff --git a/packages/nuxt/src/runtime/utils/client.ts b/packages/nuxt/src/runtime/utils/client.ts index f4d4f10..b4365dd 100644 --- a/packages/nuxt/src/runtime/utils/client.ts +++ b/packages/nuxt/src/runtime/utils/client.ts @@ -67,10 +67,13 @@ export function csrfFetch( init?: RequestInit, config?: CsrfClientConfig ): Promise { - const headers = new Headers(init?.headers); - const csrfHeaders = createCsrfHeaders(config); - - for (const [key, value] of Object.entries(csrfHeaders)) { + const headers = new Headers( + input instanceof Request ? input.headers : undefined + ); + for (const [key, value] of new Headers(init?.headers)) { + headers.set(key, value); + } + for (const [key, value] of Object.entries(createCsrfHeaders(config))) { headers.set(key, value); } From e3eac7d3f4acd6e439d69cf974a7a464ab8a167e Mon Sep 17 00:00:00 2001 From: Muneeb Date: Tue, 21 Apr 2026 23:35:06 +0200 Subject: [PATCH 2/3] chore: add changeset for #49 fix --- .changeset/fix-csrf-fetch-request-headers.md | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 .changeset/fix-csrf-fetch-request-headers.md diff --git a/.changeset/fix-csrf-fetch-request-headers.md b/.changeset/fix-csrf-fetch-request-headers.md new file mode 100644 index 0000000..c4e14ac --- /dev/null +++ b/.changeset/fix-csrf-fetch-request-headers.md @@ -0,0 +1,10 @@ +--- +"@csrf-armor/nextjs": patch +"@csrf-armor/nuxt": patch +--- + +fix(client): preserve headers when `csrfFetch` is called with a `Request` object + +`csrfFetch` previously only read headers from the `init` argument, so when it was called with a full `Request` object (e.g. `csrfFetch(new Request(url, { headers }))`), the Request's headers were stripped. It now merges headers from the Request, then the `init` argument, then the CSRF headers (CSRF headers always take precedence), making `csrfFetch` a drop-in replacement for `fetch`. + +Fixes #49 From 79f41167ad1135e27c642e4556cc0808541d589e Mon Sep 17 00:00:00 2001 From: Muneeb Date: Tue, 21 Apr 2026 23:40:23 +0200 Subject: [PATCH 3/3] test(nuxt): add csrfFetch Request header merge tests --- packages/nuxt/test/client.test.ts | 68 +++++++++++++++++++++++++++++++ 1 file changed, 68 insertions(+) create mode 100644 packages/nuxt/test/client.test.ts diff --git a/packages/nuxt/test/client.test.ts b/packages/nuxt/test/client.test.ts new file mode 100644 index 0000000..1a49152 --- /dev/null +++ b/packages/nuxt/test/client.test.ts @@ -0,0 +1,68 @@ +/** + * @vitest-environment jsdom + * + * Note: `getCsrfToken` returns null in this test environment because + * `import.meta.client` is only defined by Nuxt at build time, so the CSRF + * header is not injected. These tests cover the Request/init header merge + * behavior that issue #49 exposed. The CSRF-precedence assertion is + * covered by the Next.js client tests, which exercise the same merge logic. + */ +import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'; + +import { csrfFetch } from '../src/runtime/utils/client'; + +describe('csrfFetch (nuxt)', () => { + beforeEach(() => { + vi.spyOn(globalThis, 'fetch').mockResolvedValue( + new Response('ok', { status: 200 }) + ); + }); + + afterEach(() => { + vi.restoreAllMocks(); + }); + + it('preserves headers when input is a Request object', async () => { + const req = new Request('https://example.com/api/data', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'X-Custom': 'keep-me', + }, + }); + await csrfFetch(req); + + const callArgs = (globalThis.fetch as ReturnType).mock + .calls[0]; + const headers = callArgs[1].headers as Headers; + expect(headers.get('Content-Type')).toBe('application/json'); + expect(headers.get('X-Custom')).toBe('keep-me'); + }); + + it('lets init headers override Request headers', async () => { + const req = new Request('https://example.com/api/data', { + method: 'POST', + headers: { 'X-Custom': 'original' }, + }); + await csrfFetch(req, { headers: { 'X-Custom': 'overridden' } }); + + const callArgs = (globalThis.fetch as ReturnType).mock + .calls[0]; + const headers = callArgs[1].headers as Headers; + expect(headers.get('X-Custom')).toBe('overridden'); + }); + + it('merges init headers alongside Request headers', async () => { + const req = new Request('https://example.com/api/data', { + method: 'POST', + headers: { 'X-From-Request': 'req' }, + }); + await csrfFetch(req, { headers: { 'X-From-Init': 'init' } }); + + const callArgs = (globalThis.fetch as ReturnType).mock + .calls[0]; + const headers = callArgs[1].headers as Headers; + expect(headers.get('X-From-Request')).toBe('req'); + expect(headers.get('X-From-Init')).toBe('init'); + }); +});