authMiddleware() corrupts response cookies, only emits first one in local dev

[Thinkscape]

Preliminary Checks

• I have reviewed the documentation: https://clerk.com/docs

• I have searched for existing issues: https://github.com/clerkinc/javascript/issues

• I have not already reached out to Clerk support via email or Discord (if you have, no need to open an issue here)

• This issue is not a question, general help request, or anything other than a bug report directly related to Clerk. Please ask questions in our Discord community: https://clerk.com/discord.

Reproduction / Replay Link

https://github.com/roev-co/clerk-corrupting-cookies

Publishable key

pk_test_c3VwZXJiLWdob3VsLTEzLmNsZXJrLmFjY291bnRzLmRldiQ

Description

Steps to reproduce

1. Given middleware.ts with authMiddleware() using afterAuth callback
2. Use response.cookies.set() to set 2 or more cookies
3. Start local next dev
4. Open the page, running the middleware.

Expected behavior:

Cookies get set.
Cookies parameters are set.

Actual behavior:

Only the first cookie gets set.
Parameters like sameSite and secure get ignored and not being sent to the browser.

Background

• Only happens in local dev. Tested with older 13.4 and latest canary branches of next.
• Here's a vercel deployment where you can see it working correctly
• Only happens when using authMiddleware() - works fine with vanila Next.js middleware function

Repro app

1. Check out https://github.com/roev-co/clerk-corrupting-cookies
2. Put creds in .env.local
3. npm install
4. Run next dev
5. Open http://localhost:3000
6. You should be seeing cookies first second third, but it will only show first

Environment

System:
    OS: macOS 13.5.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 1.58 GB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.15.0 - ~/.nvm/versions/node/v18.15.0/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 9.5.0 - ~/.nvm/versions/node/v18.15.0/bin/npm
    pnpm: 8.3.1 - /opt/homebrew/bin/pnpm
  Browsers:
    Chrome: 118.0.5993.70
    Safari: 16.6
  npmPackages:
    @clerk/nextjs: ^4.21.8 => 4.21.8
    @types/node: 20.1.4 => 20.1.4
    @types/react: 18.2.6 => 18.2.6
    @types/react-dom: 18.2.4 => 18.2.4
    autoprefixer: 10.4.14 => 10.4.14
    classnames: ^2.3.2 => 2.3.2
    next: 13.4.2 => 13.4.2
    postcss: 8.4.23 => 8.4.23
    react: 18.2.0 => 18.2.0
    react-dom: 18.2.0 => 18.2.0
    tailwindcss: 3.3.2 => 3.3.2
    typescript: 5.0.4 => 5.0.4

[LekoArts]

Hi,

thanks for the issue and the excellent reproduction. This is much appreciated! Cloning your project and running it I see the same behavior.

I'll see what I can find out what the culprit is 👍

[LekoArts]

I found the culprit:

javascript/packages/nextjs/src/utils/response.ts

Line 11 in 0551488

const normalisedResponses = responses.filter(Boolean).map(res => new NextResponse(res!.body, res!));

In this line the cookies get removed:

[LekoArts]

The PR fixing this issue is merged, I'll let you know once it's released.

[LekoArts]

This has been fixed in @clerk/nextjs@4.27.4