remix icon indicating copy to clipboard operation
remix copied to clipboard

`TypeError: headers.getSetCookie is not a function`

Open olros opened this issue 10 months ago • 8 comments

Hi! I'm testing the new Single Fetch behaviour in Remix, but I'm having trouble with headers.getSetCookie which seemingly isn't present when running on Vercel for some reason.

As noted in the changelog, I've enabled nativeFetch in installGlobals but the TypeError is still present. The error I get is this:

TypeError: headers.getSetCookie is not a function or its return value is not iterable
    at proxyResponseToResponseStub (/var/task/node_modules/.pnpm/@[email protected][email protected]/node_modules/@remix-run/server-runtime/dist/single-fetch.js:292:25)
    at /var/task/node_modules/.pnpm/@[email protected][email protected]/node_modules/@remix-run/server-runtime/dist/single-fetch.js:61:9
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Promise.all (index 1)
    at async /var/task/node_modules/.pnpm/@[email protected][email protected]/node_modules/@remix-run/server-runtime/dist/single-fetch.js:39:19
    at async callDataStrategyImpl (/var/task/node_modules/.pnpm/@[email protected]/node_modules/@remix-run/router/dist/router.cjs.js:4169:17)
    at async callDataStrategy (/var/task/node_modules/.pnpm/@[email protected]/node_modules/@remix-run/router/dist/router.cjs.js:3702:19)
    at async loadRouteData (/var/task/node_modules/.pnpm/@[email protected]/node_modules/@remix-run/router/dist/router.cjs.js:3677:19)
    at async queryImpl (/var/task/node_modules/.pnpm/@[email protected]/node_modules/@remix-run/router/dist/router.cjs.js:3522:20)
    at async Object.query (/var/task/node_modules/.pnpm/@[email protected]/node_modules/@remix-run/router/dist/router.cjs.js:3416:18)

To reproduce, simply create a new Remix-project with npx create-remix@latest and put this in the _index.tsx-file:

export const loader = () => {
  return new Response(null, {
    headers: { "set-cookie": "_cookie_name=123; maxAge=1000000; SameSite=Lax" },
  });
};

export default function Index() {
  return <h1>Welcome to Remix</h1>;
}
`vite.config.ts`
import { vitePlugin as remix } from "@remix-run/dev";
import { installGlobals } from "@remix-run/node";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";
import { vercelPreset } from '@vercel/remix/vite';

installGlobals({ nativeFetch: true });

export default defineConfig({
  plugins: [
    remix({
      presets: [vercelPreset()],
      future: {
        unstable_singleFetch: true
      }
    }),
    tsconfigPaths(),
  ],
});

Then deploy to vercel.


Even without the new SingleFetch behaviour, using headers.getSetCookie still doesn't work. This can be reproduced by removing unstable_singleFetch from future in vite.config.ts, and changing the _index.tsx-file to this:

export const loader = () => {
  const res = new Response(null, {
    headers: { "set-cookie": "_cookie_name=123; maxAge=1000000; SameSite=Lax" },
  });
  console.log("getSetCookie", res.headers.getSetCookie); // -> getSetCookie  undefined
  console.log("getSetCookie values", res.headers.getSetCookie()); // -> TypeError: response.headers.getSetCookie is not a function
  return res;
};

export default function Index() {
  return <h1>Welcome to Remix</h1>;
}

Any help appreciated!

olros avatar Apr 26 '24 14:04 olros