msw 2.13.5 → 2.14.0

package/lib/mockServiceWorker.js

@@ -7,7 +7,7 @@
  * - Please do NOT modify this file.
  */
 
-const PACKAGE_VERSION = '2.13.5'
+const PACKAGE_VERSION = '2.14.0'
 const INTEGRITY_CHECKSUM = '4db4a41e972cec1b64cc569c66952d82'
 const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
 const activeClientIds = new Set()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "msw",
-  "version": "2.13.5",
+  "version": "2.14.0",
   "description": "Seamless REST/GraphQL API mocking library for browser and Node.js.",
   "type": "commonjs",
   "main": "./lib/core/index.js",
@@ -286,7 +286,7 @@
     "vitest-environment-miniflare": "^2.14.4",
     "webpack": "^5.106.2",
     "webpack-http-server": "^0.5.0",
-    "msw": "^2.13.5"
+    "msw": "^2.14.0"
   },
   "peerDependencies": {
     "typescript": ">= 4.8.x"

package/src/core/experimental/frames/http-frame.test.ts

@@ -4,7 +4,8 @@ import { ws } from '../../ws'
 import { bypass } from '../../bypass'
 import type { HttpNetworkFrameEventMap } from './http-frame'
 import { HttpNetworkFrame } from './http-frame'
-import { InMemoryHandlersController } from '#core/experimental/handlers-controller'
+import { InMemoryHandlersController } from '../../experimental/handlers-controller'
+import { getSiblingHandlers } from '../../utils/internal/attachSiblingHandlers'
 
 beforeAll(() => {
   vi.spyOn(console, 'error').mockImplementation(() => {})
@@ -46,6 +47,9 @@ it('filters only request type handlers', async () => {
   const webSocketHandlers = [
     ws.link('ws://localhost').addEventListener('connection', () => {}),
   ]
+  const webSocketSiblingHandlers = webSocketHandlers.flatMap((handler) =>
+    getSiblingHandlers(handler),
+  )
 
   const controller = new InMemoryHandlersController([
     ...httpHandlers,
@@ -55,6 +59,7 @@ it('filters only request type handlers', async () => {
 
   expect(frame.getHandlers(controller)).toEqual([
     ...httpHandlers,
+    ...webSocketSiblingHandlers,
     ...graphqlHandlers,
   ])
   expect(frame.getHandlers(new InMemoryHandlersController([]))).toEqual([])

package/src/core/experimental/frames/http-frame.ts

@@ -251,9 +251,13 @@ export abstract class HttpNetworkFrame extends NetworkFrame<
       return null
     }
 
+    const responseCloneForLogs = resolutionContext?.quiet
+      ? null
+      : response.clone()
+
     await storeResponseCookies(request, response)
 
-    this.respondWith(response.clone())
+    this.respondWith(response)
 
     this.events.emit(
       new RequestEvent('request:end', {
@@ -265,7 +269,7 @@ export abstract class HttpNetworkFrame extends NetworkFrame<
     if (!resolutionContext?.quiet) {
       handler.log({
         request: requestCloneForLogs!,
-        response,
+        response: responseCloneForLogs!,
         parsedResult,
       })
     }

package/src/core/experimental/handlers-controller.test.ts

@@ -1,8 +1,68 @@
 import { http } from '../http'
 import { graphql } from '../graphql'
 import { ws } from '../ws'
+import { getSiblingHandlers } from '../utils/internal/attachSiblingHandlers'
 import { InMemoryHandlersController } from './handlers-controller'
 
+describe('constructor', () => {
+  it('places the sibling in its own kind bucket', () => {
+    const wsHandler = ws.link('*').addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsHandler)
+
+    const controller = new InMemoryHandlersController([wsHandler])
+
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsHandler])
+    expect(controller.getHandlersByKind('request')).toEqual([upgradeHandler])
+  })
+
+  it('interleaves the sibling at the owner position when grouping by kind', () => {
+    const httpOne = http.get('/', () => {})
+    const wsHandler = ws.link('*').addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsHandler)
+    const httpTwo = http.get('/', () => {})
+
+    const controller = new InMemoryHandlersController([
+      httpOne,
+      wsHandler,
+      httpTwo,
+    ])
+
+    expect(controller.getHandlersByKind('request')).toEqual([
+      httpOne,
+      upgradeHandler,
+      httpTwo,
+    ])
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsHandler])
+  })
+
+  it('extracts siblings from every owner in the input list', () => {
+    const wsOne = ws.link('*').addEventListener('connection', () => {})
+    const wsTwo = ws.link('*').addEventListener('connection', () => {})
+    const [upgradeOne] = getSiblingHandlers(wsOne)
+    const [upgradeTwo] = getSiblingHandlers(wsTwo)
+
+    const controller = new InMemoryHandlersController([wsOne, wsTwo])
+
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsOne, wsTwo])
+    expect(controller.getHandlersByKind('request')).toEqual([
+      upgradeOne,
+      upgradeTwo,
+    ])
+  })
+
+  it('dedupes the shared upgrade sibling across multiple handlers from the same link', () => {
+    const chat = ws.link('*')
+    const wsOne = chat.addEventListener('connection', () => {})
+    const wsTwo = chat.addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsOne)
+
+    const controller = new InMemoryHandlersController([wsOne, wsTwo])
+
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsOne, wsTwo])
+    expect(controller.getHandlersByKind('request')).toEqual([upgradeHandler])
+  })
+})
+
 describe(InMemoryHandlersController.prototype.use, () => {
   it('prepends a handler to an empty controller', () => {
     const controller = new InMemoryHandlersController([])
@@ -51,6 +111,44 @@ describe(InMemoryHandlersController.prototype.use, () => {
 
     expect(controller.currentHandlers()).toEqual([graphqlOne, httpTwo, httpOne])
   })
+
+  it('propagates siblings to their kind buckets at runtime', () => {
+    const controller = new InMemoryHandlersController([])
+    const wsHandler = ws.link('*').addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsHandler)
+
+    controller.use([wsHandler])
+
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsHandler])
+    expect(controller.getHandlersByKind('request')).toEqual([upgradeHandler])
+  })
+
+  it('prepends incoming siblings before existing handlers of the same kind', () => {
+    const existingHttp = http.get('/existing', () => {})
+    const controller = new InMemoryHandlersController([existingHttp])
+    const wsHandler = ws.link('*').addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsHandler)
+
+    controller.use([wsHandler])
+
+    expect(controller.getHandlersByKind('request')).toEqual([
+      upgradeHandler,
+      existingHttp,
+    ])
+  })
+
+  it('dedupes the shared upgrade sibling when called with multiple handlers from the same link', () => {
+    const chat = ws.link('*')
+    const wsOne = chat.addEventListener('connection', () => {})
+    const wsTwo = chat.addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsOne)
+
+    const controller = new InMemoryHandlersController([])
+    controller.use([wsOne, wsTwo])
+
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsOne, wsTwo])
+    expect(controller.getHandlersByKind('request')).toEqual([upgradeHandler])
+  })
 })
 
 describe(InMemoryHandlersController.prototype.reset, () => {
@@ -96,6 +194,42 @@ describe(InMemoryHandlersController.prototype.reset, () => {
      */
     expect(controller.currentHandlers()).toEqual([httpTwo])
   })
+
+  it('places siblings into their kind buckets when resetting to next handlers', () => {
+    const controller = new InMemoryHandlersController([])
+    const wsHandler = ws.link('*').addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsHandler)
+
+    controller.reset([wsHandler])
+
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsHandler])
+    expect(controller.getHandlersByKind('request')).toEqual([upgradeHandler])
+  })
+
+  it('restores siblings when resetting to the initial handlers', () => {
+    const wsHandler = ws.link('*').addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsHandler)
+    const controller = new InMemoryHandlersController([wsHandler])
+
+    controller.use([http.get('/runtime', () => {})])
+    controller.reset([])
+
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsHandler])
+    expect(controller.getHandlersByKind('request')).toEqual([upgradeHandler])
+  })
+
+  it('dedupes the shared upgrade sibling when reset with multiple handlers from the same link', () => {
+    const chat = ws.link('*')
+    const wsOne = chat.addEventListener('connection', () => {})
+    const wsTwo = chat.addEventListener('connection', () => {})
+    const [upgradeHandler] = getSiblingHandlers(wsOne)
+
+    const controller = new InMemoryHandlersController([])
+    controller.reset([wsOne, wsTwo])
+
+    expect(controller.getHandlersByKind('websocket')).toEqual([wsOne, wsTwo])
+    expect(controller.getHandlersByKind('request')).toEqual([upgradeHandler])
+  })
 })
 
 describe(InMemoryHandlersController.prototype.getHandlersByKind, () => {
@@ -112,11 +246,10 @@ describe(InMemoryHandlersController.prototype.getHandlersByKind, () => {
       ]).getHandlersByKind('websocket'),
     ).toEqual([])
 
+    const wsHandler = ws.link('*').addEventListener('connection', () => {})
     expect(
-      new InMemoryHandlersController([
-        ws.link('*').addEventListener('connection', () => {}),
-      ]).getHandlersByKind('request'),
-    ).toEqual([])
+      new InMemoryHandlersController([wsHandler]).getHandlersByKind('request'),
+    ).toEqual(getSiblingHandlers(wsHandler))
   })
 
   it('returns all handlers if they all match', () => {
@@ -142,6 +275,7 @@ describe(InMemoryHandlersController.prototype.getHandlersByKind, () => {
     const httpHandler = http.get('/', () => {})
     const graphqlHandler = graphql.query('', () => {})
     const wsHandler = ws.link('*').addEventListener('connection', () => {})
+    const wsHandlerSiblings = getSiblingHandlers(wsHandler)
 
     expect(
       new InMemoryHandlersController([
@@ -149,7 +283,7 @@ describe(InMemoryHandlersController.prototype.getHandlersByKind, () => {
         graphqlHandler,
         wsHandler,
       ]).getHandlersByKind('request'),
-    ).toEqual([httpHandler, graphqlHandler])
+    ).toEqual([httpHandler, graphqlHandler, ...wsHandlerSiblings])
 
     expect(
       new InMemoryHandlersController([

package/src/core/experimental/handlers-controller.ts

@@ -2,6 +2,7 @@ import { invariant } from 'outvariant'
 import { type RequestHandler } from '../handlers/RequestHandler'
 import { type WebSocketHandler } from '../handlers/WebSocketHandler'
 import { devUtils } from '../utils/internal/devUtils'
+import { getSiblingHandlers } from '../utils/internal/attachSiblingHandlers'
 
 export type AnyHandler = RequestHandler | WebSocketHandler
 export type HandlersMap = Partial<Record<AnyHandler['kind'], Array<AnyHandler>>>
@@ -9,11 +10,23 @@ export type HandlersMap = Partial<Record<AnyHandler['kind'], Array<AnyHandler>>>
 export function groupHandlersByKind(handlers: Array<AnyHandler>): HandlersMap {
   const groups: HandlersMap = {}
 
+  const pushUnique = (kind: AnyHandler['kind'], handler: AnyHandler) => {
+    const bucket = (groups[kind] ||= [])
+
+    if (!bucket.includes(handler)) {
+      bucket.push(handler)
+    }
+  }
+
   /**
    * @note `Object.groupBy` is not implemented in Node.js v20.
    */
   for (const handler of handlers) {
-    ;(groups[handler.kind] ||= []).push(handler)
+    pushUnique(handler.kind, handler)
+
+    for (const sibling of getSiblingHandlers(handler)) {
+      pushUnique(sibling.kind, sibling)
+    }
   }
 
   return groups
@@ -69,14 +82,16 @@ export abstract class HandlersController {
     }
 
     const { handlers } = this.getState()
-
-    // Iterate over next handlers and prepend them to their respective lists.
-    // Iterate in a reverse order to the keep the order of the runtime handlers as provided.
-    for (let i = nextHandlers.length - 1; i >= 0; i--) {
-      const handler = nextHandlers[i]
-      handlers[handler.kind] = handlers[handler.kind]
-        ? [handler, ...handlers[handler.kind]!]
-        : [handler]
+    const overrides = groupHandlersByKind(nextHandlers)
+
+    // Prepend overrides to their respective kind buckets so they take
+    // priority over existing handlers while preserving input order.
+    for (const kind in overrides) {
+      const overridesForKind = overrides[kind as AnyHandler['kind']]!
+      const existingForKind = handlers[kind as AnyHandler['kind']]
+      handlers[kind as AnyHandler['kind']] = existingForKind
+        ? [...overridesForKind, ...existingForKind]
+        : overridesForKind
     }
 
     this.setState({ handlers })

package/src/core/handlers/RequestHandler.ts

@@ -1,3 +1,4 @@
+import { Headers as HeadersPolyfill } from 'headers-polyfill'
 import { getCallFrame } from '../utils/internal/getCallFrame'
 import {
   isIterable,
@@ -12,6 +13,7 @@ import {
   type DefaultUnsafeFetchResponse,
 } from '../HttpResponse'
 import type { GraphQLRequestBody } from './GraphQLHandler'
+import { getRawSetCookie } from '../utils/HttpResponse/decorators'
 
 export type DefaultRequestMultipartBody = Record<
   string,
@@ -335,7 +337,7 @@ export abstract class RequestHandler<
         ...resolverExtras,
         requestId: args.requestId,
         request: args.request,
-      }) as Promise<Response>
+      }) as Promise<Response | undefined>
     ).catch((errorOrResponse) => {
       // Allow throwing a Response instance in a response resolver.
       if (errorOrResponse instanceof Response) {
@@ -348,6 +350,10 @@ export abstract class RequestHandler<
 
     const mockedResponse = await mockedResponsePromise
 
+    if (mockedResponse) {
+      forwardResponseCookies(mockedResponse)
+    }
+
     const executionResult = this.createExecutionResult({
       // Pass the cloned request to the result so that logging
       // and other consumers could read its body once more.
@@ -416,3 +422,32 @@ export abstract class RequestHandler<
     }
   }
 }
+
+/**
+ * Forwards the cookies from the given response to `document.cookie`.
+ */
+export function forwardResponseCookies(response: Response): void {
+  // Cookie forwarding is only relevant in the browser.
+  if (typeof document === 'undefined') {
+    return
+  }
+
+  const responseCookies = getRawSetCookie(response)
+
+  if (!responseCookies) {
+    return
+  }
+
+  // Write the mocked response cookies to the document.
+  // 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 versions
+  // and "Headers.prototype.getSetCookie" can be used directly.
+  const allResponseCookies = HeadersPolyfill.prototype.getSetCookie.call(
+    new Headers([['set-cookie', responseCookies]]),
+  )
+
+  for (const cookieString of allResponseCookies) {
+    document.cookie = cookieString
+  }
+}

package/src/core/handlers/WebSocketHandler.test.ts

@@ -125,3 +125,61 @@ describe('parse', () => {
     })
   })
 })
+
+describe('test', () => {
+  it('returns true for a matching string', () => {
+    expect(
+      new WebSocketHandler('ws://localhost/ws').test('ws://localhost/ws'),
+    ).toBe(true)
+  })
+
+  it('returns false for a non-matching string', () => {
+    expect(
+      new WebSocketHandler('ws://localhost/ws').test('ws://localhost/other'),
+    ).toBe(false)
+  })
+
+  it('returns true for a relative matching string', () => {
+    expect(
+      new WebSocketHandler('ws://localhost/ws').test('/ws', {
+        baseUrl: 'ws://localhost',
+      }),
+    ).toBe(true)
+  })
+
+  it('returns false for a relative non-matching string', () => {
+    expect(
+      new WebSocketHandler('ws://localhost/ws').test('/other', {
+        baseUrl: 'ws://localhost',
+      }),
+    ).toBe(false)
+  })
+
+  it('returns true for a matching URL', () => {
+    expect(
+      new WebSocketHandler('ws://localhost/ws').test(
+        new URL('ws://localhost/ws'),
+      ),
+    ).toBe(true)
+  })
+
+  it('returns false for a non-matching URL', () => {
+    expect(
+      new WebSocketHandler('ws://localhost/ws').test(
+        new URL('ws://localhost/other'),
+      ),
+    ).toBe(false)
+  })
+
+  it('returns true for a matching HTTP url string', () => {
+    expect(
+      new WebSocketHandler('ws://localhost/ws').test('http://localhost/ws'),
+    ).toBe(true)
+  })
+
+  it('returns false for a non-matching HTTP url string', () => {
+    expect(
+      new WebSocketHandler('ws://localhost/ws').test('http://localhost/other'),
+    ).toBe(false)
+  })
+})

package/src/core/handlers/WebSocketHandler.ts

@@ -57,7 +57,7 @@ export class WebSocketHandler {
   }
 
   public parse(args: {
-    url: URL
+    url: string | URL
     resolutionContext?: WebSocketResolutionContext
   }): WebSocketHandlerParsedResult {
     const clientUrl = new URL(args.url)
@@ -90,22 +90,26 @@ export class WebSocketHandler {
   }
 
   public predicate(args: {
-    url: URL
+    url: string | URL
     parsedResult: WebSocketHandlerParsedResult
   }): boolean {
     return args.parsedResult.match.matches
   }
 
+  public test(
+    url: string | URL,
+    resolutionContext?: WebSocketResolutionContext & { strict?: boolean },
+  ): boolean {
+    return this.#match(url, resolutionContext) != null
+  }
+
   public async run(
     connection: WebSocketConnectionData,
     resolutionContext?: WebSocketResolutionContext,
   ): Promise<WebSocketHandlerConnection | null> {
-    const parsedResult = this.parse({
-      url: connection.client.url,
-      resolutionContext,
-    })
+    const parsedResult = this.#match(connection.client.url, resolutionContext)
 
-    if (!this.predicate({ url: connection.client.url, parsedResult })) {
+    if (parsedResult == null) {
       return null
     }
 
@@ -114,7 +118,7 @@ export class WebSocketHandler {
       params: parsedResult.match.params || {},
     }
 
-    if (resolutionContext?.[kAutoConnect]) {
+    if (resolutionContext?.[kAutoConnect] ?? true) {
       if (this[kConnect](resolvedConnection)) {
         return resolvedConnection
       }
@@ -125,6 +129,31 @@ export class WebSocketHandler {
     return resolvedConnection
   }
 
+  #match(
+    url: string | URL,
+    resolutionContext?: WebSocketResolutionContext & { strict?: boolean },
+  ): WebSocketHandlerParsedResult | null {
+    const resolvedUrl = this.#resolveWebSocketUrl(
+      url.toString(),
+      resolutionContext?.baseUrl,
+    )
+    const parsedResult = this.parse({
+      url: resolvedUrl,
+      resolutionContext,
+    })
+
+    if (
+      this.predicate({
+        url,
+        parsedResult,
+      })
+    ) {
+      return parsedResult
+    }
+
+    return null
+  }
+
   protected [kConnect](connection: WebSocketHandlerConnection): boolean {
     // Support `event.stopPropagation()` for various client/server events.
     connection.client.addEventListener(

package/src/core/utils/HttpResponse/decorators.ts

@@ -1,10 +1,9 @@
 import statuses from '../../../shims/statuses'
-import { Headers as HeadersPolyfill } from 'headers-polyfill'
 import type { HttpResponseInit } from '../../HttpResponse'
 
 const { message } = statuses
 
-export const kSetCookie = Symbol('kSetCookie')
+const kSetCookie = Symbol('kSetCookie')
 
 export interface HttpResponseDecoratedInit extends HttpResponseInit {
   status: number
@@ -31,7 +30,7 @@ export function decorateResponse(
   response: Response,
   init: HttpResponseDecoratedInit,
 ): Response {
-  // Allow to mock the response type.
+  // Allow mocking the response type.
   if (init.type) {
     Object.defineProperty(response, 'type', {
       value: init.type,
@@ -52,25 +51,11 @@ export function decorateResponse(
       enumerable: false,
       writable: false,
     })
-
-    // Cookie forwarding is only relevant in the browser.
-    if (typeof document !== 'undefined') {
-      // Write the mocked response cookies to the document.
-      // 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 responseCookiePairs = HeadersPolyfill.prototype.getSetCookie.call(
-        init.headers,
-      )
-
-      for (const cookieString of responseCookiePairs) {
-        // No need to parse the cookie headers because it's defined
-        // as the valid cookie string to begin with.
-        document.cookie = cookieString
-      }
-    }
   }
 
   return response
 }
+
+export function getRawSetCookie(response: Response): string | undefined {
+  return Reflect.get(response, kSetCookie)
+}

package/src/core/utils/internal/attachSiblingHandlers.ts

@@ -0,0 +1,28 @@
+import { invariant } from 'outvariant'
+import type { AnyHandler } from '../../experimental/handlers-controller'
+
+const kSiblingHandlers = Symbol('kSiblingHandlers')
+
+export function attachSiblingHandlers<T extends AnyHandler>(
+  owner: T,
+  siblings: Array<AnyHandler>,
+): T {
+  invariant(
+    getSiblingHandlers(owner).length === 0,
+    'Failed to merge handlers: the owner "%s" handler is already merged',
+    owner.kind,
+  )
+
+  Object.defineProperty(owner, kSiblingHandlers, {
+    value: siblings,
+    enumerable: false,
+    writable: false,
+    configurable: false,
+  })
+
+  return owner
+}
+
+export function getSiblingHandlers(owner: AnyHandler): Array<AnyHandler> {
+  return Reflect.get(owner, kSiblingHandlers) || []
+}

package/src/core/utils/request/storeResponseCookies.ts

@@ -1,5 +1,5 @@
 import { cookieStore } from '../cookieStore'
-import { kSetCookie } from '../HttpResponse/decorators'
+import { getRawSetCookie } from '../HttpResponse/decorators'
 
 export async function storeResponseCookies(
   request: Request,
@@ -7,9 +7,7 @@ export async function storeResponseCookies(
 ): Promise<void> {
   // Grab the raw "Set-Cookie" response header provided
   // in the HeadersInit for this mocked response.
-  const responseCookies = Reflect.get(response, kSetCookie) as
-    | string
-    | undefined
+  const responseCookies = getRawSetCookie(response)
 
   if (responseCookies) {
     await cookieStore.setCookie(responseCookies, request.url)