Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: parse "Set-Cookie" response header with commas correctly #2075

Merged
merged 8 commits into from
Mar 15, 2024
Merged

fix: parse "Set-Cookie" response header with commas correctly #2075

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
62c1626
fix: add test for cookies containing commas
Mar 6, 2024
2c94166
fix: getting response cookies
Mar 6, 2024
52eaf0d
Merge branch 'main' into feature/getting-response-cookies
ushiboy Mar 9, 2024
a395407
Merge branch 'mswjs:main' into feature/getting-response-cookies
ushiboy Mar 13, 2024
71702da
fix: changed to a temporary process with polyfill
Mar 13, 2024
2ff9dfe
fix: comment typo
Mar 14, 2024
66e9e58
fix: change comment to indicate the reason
Mar 15, 2024
91802bb
Merge branch 'main' into feature/getting-response-cookies
ushiboy Mar 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 8 additions & 4 deletions src/core/utils/HttpResponse/decorators.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import statuses from '@bundled-es-modules/statuses'
import type { HttpResponseInit } from '../../HttpResponse'
import { Headers as HeadersPolyfill } from 'headers-polyfill'

const { message } = statuses

Expand Down Expand Up @@ -40,10 +41,13 @@ export function decorateResponse(
// Cookie forwarding is only relevant in the browser.
if (typeof document !== 'undefined') {
// Write the mocked response cookies to the document.
// Note that Fetch API Headers will concatenate multiple "Set-Cookie"
// headers into a single comma-separated string, just as it does
// with any other multi-value headers.
const responseCookies = init.headers.get('Set-Cookie')?.split(',') || []
// Use `headers-polyfill` to get the Set-Cookie header value correctly.
// This is an alternative until TypeScript 5.2
// and Node.js v20 become the minimum supported version
// and getSetCookie in Headers can be used directly.
const responseCookies = HeadersPolyfill.prototype.getSetCookie.call(
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We shouldn't tailor to technologies that violate standard support. We should rely on .getSetCookie() because it's a supported method. If the underlying environment doesn't support it, it's the underlying environment that should be fixing it (i.e. including any necessary polyfills). We mustn't rely on headers-polyfill anymore. It's used only for its utilities around transforming headers.

The only concern is what @mattcosta7 raised about the TypeScript supporting this method. It doesn't exist on earlier versions of TS:

And seems to only land in 5.2.

The Headers.prototype.getSetCookie can also be used only since Node.js 19 (which translates to v20 for stable releases) while MSW supports v18.

With this in mind, we cannot ship .getSetCookie() method as a part of MSW—it will break for a lot of people because it won't exist type-wise and runtime-wise.

We need to implement the logic/fix ourselves until TS 5.2 and Node.js v20 become the minimal supported versions, which is years in the future.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

TL;DR

What you're doing is fine. Just the reasoning should be mentioned more prominently above this line.

Can you please include a comment above this HeadersPolyfill usage briefly describing why we rely on a polyfill here? Thanks!

Copy link
Contributor

@mattcosta7 mattcosta7 Mar 15, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

FWIW - typescript not supporting this in 4.7-5.1 shouldn't matter for consumers using those versions, because this call is encapsulated from their tooling (it's internal and generally node_modules aren't typechecked except at their .d.ts level which shouldn't contain any information about this call to getSetCookie

But with neither node18, jest not vitest able to support this correctly, we'd basically break everyone's tests the second we shipped it which would be unideal.

I'm very much onboard that jsdom needs to support this - although maybe one day people will test browser code in a browser....one day

We could also inline logic from the headerpolyfill here instead of using that directly, as another option to get away from the polyfill - it's just implemented there already

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

FWIW - typescript not supporting this in 4.7-5.1 shouldn't matter for consumers using those versions, because this call is encapsulated from their tooling

This is only true if they have skipLibCheck: true, which is not the default and many people still have it disabled, which will cause compilation problems. Granted, easy to fix but creates an unnecessary stress for consumers.

I'm very much onboard that jsdom needs to support this - although maybe one day people will test browser code in a browser....one day

Fingers crossed!

We could also inline logic from the headerpolyfill here instead of using that directly, as another option to get away from the polyfill - it's just implemented there already

See no reason to duplicate code. We depend on headers-polyfill anyway right now, its implementation is tested, we should use it.

init.headers,
)

for (const cookieString of responseCookies) {
// No need to parse the cookie headers because it's defined
Expand Down
1 change: 1 addition & 0 deletions test/browser/rest-api/cookies.mocks.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ const worker = setupWorker(
headers: [
['Set-Cookie', 'firstCookie=yes'],
['Set-Cookie', 'secondCookie=no; Max-Age=1000'],
['Set-Cookie', 'thirdCookie=1,2,3'],
],
},
)
Expand Down
1 change: 1 addition & 0 deletions test/browser/rest-api/cookies.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,5 +48,6 @@ test('allows setting multiple response cookies', async ({
expect(allCookies).toEqual({
firstCookie: 'yes',
secondCookie: 'no',
thirdCookie: '1,2,3',
})
})
Loading