msw 2.11.0 → 2.11.2

package/src/browser/utils/workerChannel.ts

@@ -0,0 +1,146 @@
+import { Emitter, TypedEvent } from 'rettime'
+import { isObject } from '~/core/utils/internal/isObject'
+import type { StringifiedResponse } from '../setupWorker/glossary'
+
+export interface WorkerChannelOptions {
+  worker: Promise<ServiceWorker>
+}
+
+export type WorkerChannelEventMap = {
+  REQUEST: WorkerEvent<IncomingWorkerRequest>
+  RESPONSE: WorkerEvent<IncomingWorkerResponse>
+  MOCKING_ENABLED: WorkerEvent<{
+    client: {
+      id: string
+      frameType: string
+    }
+  }>
+  INTEGRITY_CHECK_RESPONSE: WorkerEvent<{
+    packageVersion: string
+    checksum: string
+  }>
+  KEEPALIVE_RESPONSE: TypedEvent<never>
+}
+
+/**
+ * Request representation received from the worker message event.
+ */
+export interface IncomingWorkerRequest
+  extends Omit<
+    Request,
+    | 'text'
+    | 'body'
+    | 'json'
+    | 'blob'
+    | 'arrayBuffer'
+    | 'formData'
+    | 'clone'
+    | 'signal'
+    | 'isHistoryNavigation'
+    | 'isReloadNavigation'
+  > {
+  /**
+   * Unique ID of the request generated once the request is
+   * intercepted by the "fetch" event in the Service Worker.
+   */
+  id: string
+  interceptedAt: number
+  body?: ArrayBuffer | null
+}
+
+type IncomingWorkerResponse = {
+  isMockedResponse: boolean
+  request: IncomingWorkerRequest
+  response: Pick<
+    Response,
+    'type' | 'ok' | 'status' | 'statusText' | 'body' | 'headers' | 'redirected'
+  >
+}
+
+export type WorkerEventResponse = {
+  MOCK_RESPONSE: [
+    data: StringifiedResponse,
+    transfer?: [ReadableStream<Uint8Array>],
+  ]
+  PASSTHROUGH: []
+}
+
+export class WorkerEvent<
+  DataType,
+  ReturnType = any,
+  EventType extends string = string,
+> extends TypedEvent<DataType, ReturnType, EventType> {
+  #workerEvent: MessageEvent
+
+  constructor(workerEvent: MessageEvent) {
+    const type = workerEvent.data.type as EventType
+    const data = workerEvent.data.payload as DataType
+
+    /**
+     * @note This is the only place we're mapping { type, payload }
+     * message structure of the worker. The client references the
+     * payload via `event.data`.
+     */
+    super(
+      // @ts-expect-error Troublesome `TypedEvent` extension.
+      type,
+      { data },
+    )
+    this.#workerEvent = workerEvent
+  }
+
+  get ports() {
+    return this.#workerEvent.ports
+  }
+
+  /**
+   * Reply directly to this event using its `MessagePort`.
+   */
+  public postMessage<Type extends keyof WorkerEventResponse>(
+    type: Type,
+    ...rest: WorkerEventResponse[Type]
+  ): void {
+    this.#workerEvent.ports[0].postMessage(
+      { type, data: rest[0] },
+      { transfer: rest[1] },
+    )
+  }
+}
+
+/**
+ * Map of the events that can be sent to the Service Worker
+ * from any execution context.
+ */
+type OutgoingWorkerEvents =
+  | 'MOCK_ACTIVATE'
+  | 'INTEGRITY_CHECK_REQUEST'
+  | 'KEEPALIVE_REQUEST'
+  | 'CLIENT_CLOSED'
+
+export class WorkerChannel extends Emitter<WorkerChannelEventMap> {
+  constructor(protected readonly options: WorkerChannelOptions) {
+    super()
+
+    navigator.serviceWorker.addEventListener('message', async (event) => {
+      const worker = await this.options.worker
+
+      if (event.source != null && event.source !== worker) {
+        return
+      }
+
+      if (event.data && isObject(event.data) && 'type' in event.data) {
+        this.emit(new WorkerEvent<any, any, any>(event))
+      }
+    })
+  }
+
+  /**
+   * Send data to the Service Worker controlling this client.
+   * This triggers the `message` event listener on ServiceWorkerGlobalScope.
+   */
+  public postMessage(type: OutgoingWorkerEvents): void {
+    this.options.worker.then((worker) => {
+      worker.postMessage(type)
+    })
+  }
+}

package/src/core/HttpResponse.ts

@@ -161,10 +161,10 @@ export class HttpResponse<
    *
    * HttpResponse.arrayBuffer(buffer)
    */
-  static arrayBuffer(
-    body?: ArrayBuffer | SharedArrayBuffer,
+  static arrayBuffer<BodyType extends ArrayBuffer | SharedArrayBuffer>(
+    body?: BodyType,
     init?: HttpResponseInit,
-  ): HttpResponse<ArrayBuffer | SharedArrayBuffer> {
+  ): HttpResponse<BodyType> {
     const responseInit = normalizeResponseInit(init)
 
     if (!responseInit.headers.has('Content-Type')) {

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

@@ -602,7 +602,7 @@ describe('predicate', () => {
     ).resolves.toBe(false)
   })
 
-  it('allows anonymous GraphQL opertaions when using "all" expected operation type', async () => {
+  it('allows anonymous GraphQL operations when using "all" expected operation type', async () => {
     const handler = new GraphQLHandler('all', new RegExp('.*'), '*', resolver)
     const request = createPostGraphQLRequest({
       query: `

package/src/core/handlers/GraphQLHandler.ts

@@ -176,7 +176,6 @@ export class GraphQLHandler extends RequestHandler<
       GraphQLHandler.parsedRequestCache.set(
         request,
         await parseGraphQLRequest(request).catch((error) => {
-          // eslint-disable-next-line no-console
           console.error(error)
           return undefined
         }),
@@ -318,7 +317,6 @@ Consider naming this operation or using "graphql.operation()" request handler to
       ? `${args.parsedResult.operationType} ${args.parsedResult.operationName}`
       : `anonymous ${args.parsedResult.operationType}`
 
-    // eslint-disable-next-line no-console
     console.groupCollapsed(
       devUtils.formatMessage(
         `${getTimestamp()} ${requestInfo} (%c${loggedResponse.status} ${
@@ -334,7 +332,6 @@ Consider naming this operation or using "graphql.operation()" request handler to
     console.log('Handler:', this)
     // eslint-disable-next-line no-console
     console.log('Response:', loggedResponse)
-    // eslint-disable-next-line no-console
     console.groupEnd()
   }
 }

package/src/core/handlers/HttpHandler.ts

@@ -201,7 +201,6 @@ export class HttpHandler extends RequestHandler<
     const loggedResponse = await serializeResponse(args.response)
     const statusColor = getStatusCodeColor(loggedResponse.status)
 
-    // eslint-disable-next-line no-console
     console.groupCollapsed(
       devUtils.formatMessage(
         `${getTimestamp()} ${args.request.method} ${publicUrl} (%c${
@@ -217,7 +216,6 @@ export class HttpHandler extends RequestHandler<
     console.log('Handler:', this)
     // eslint-disable-next-line no-console
     console.log('Response', loggedResponse)
-    // eslint-disable-next-line no-console
     console.groupEnd()
   }
 }

package/src/core/utils/cookieStore.ts

@@ -1,230 +1,88 @@
-import { invariant } from 'outvariant'
 import { isNodeProcess } from 'is-node-process'
-import toughCookie, {
-  type Cookie as CookieInstance,
-} from '@bundled-es-modules/tough-cookie'
-
-const { Cookie, CookieJar, Store, MemoryCookieStore, domainMatch, pathMatch } =
-  toughCookie
-
-/**
- * Custom cookie store that uses the Web Storage API.
- * @see https://github.com/expo/tough-cookie-web-storage-store
- */
-class WebStorageCookieStore extends Store {
-  private storage: Storage
-  private storageKey: string
+import { invariant } from 'outvariant'
+import {
+  Cookie,
+  CookieJar,
+  MemoryCookieStore,
+  type MemoryCookieStoreIndex,
+} from 'tough-cookie'
+import { jsonParse } from './internal/jsonParse'
+
+class CookieStore {
+  #storageKey = '__msw-cookie-store__'
+  #jar: CookieJar
+  #memoryStore: MemoryCookieStore
 
   constructor() {
-    super()
-
-    invariant(
-      typeof localStorage !== 'undefined',
-      'Failed to create a WebStorageCookieStore: `localStorage` is not available in this environment. This is likely an issue with MSW. Please report it on GitHub: https://github.com/mswjs/msw/issues',
-    )
-
-    this.synchronous = true
-    this.storage = localStorage
-    this.storageKey = '__msw-cookie-store__'
-  }
-
-  findCookie(
-    domain: string,
-    path: string,
-    key: string,
-    callback: (error: Error | null, cookie: CookieInstance | null) => void,
-  ): void {
-    try {
-      const store = this.getStore()
-      const cookies = this.filterCookiesFromList(store, { domain, path, key })
-      callback(null, cookies[0] || null)
-    } catch (error) {
-      if (error instanceof Error) {
-        callback(error, null)
-      }
-    }
-  }
-
-  findCookies(
-    domain: string,
-    path: string,
-    allowSpecialUseDomain: boolean,
-    callback: (error: Error | null, cookie: Array<CookieInstance>) => void,
-  ): void {
-    if (!domain) {
-      callback(null, [])
-      return
+    if (!isNodeProcess()) {
+      invariant(
+        typeof localStorage !== 'undefined',
+        'Failed to create a CookieStore: `localStorage` is not available in this environment. This is likely an issue with your environment, which has been detected as browser (or browser-like) environment and must implement global browser APIs correctly.',
+      )
     }
 
-    try {
-      const store = this.getStore()
-      const results = this.filterCookiesFromList(store, {
-        domain,
-        path,
-      })
-      callback(null, results)
-    } catch (error) {
-      if (error instanceof Error) {
-        callback(error, [])
-      }
-    }
+    this.#memoryStore = new MemoryCookieStore()
+    this.#memoryStore.idx = this.getCookieStoreIndex()
+    this.#jar = new CookieJar(this.#memoryStore)
   }
 
-  putCookie(
-    cookie: CookieInstance,
-    callback: (error: Error | null) => void,
-  ): void {
-    try {
-      // Never set cookies with `maxAge` of `0`.
-      if (cookie.maxAge === 0) {
-        return
-      }
-
-      const store = this.getStore()
-      store.push(cookie)
-      this.updateStore(store)
-    } catch (error) {
-      if (error instanceof Error) {
-        callback(error)
-      }
-    }
+  public getCookies(url: string): Array<Cookie> {
+    return this.#jar.getCookiesSync(url)
   }
 
-  updateCookie(
-    oldCookie: CookieInstance,
-    newCookie: CookieInstance,
-    callback: (error: Error | null) => void,
-  ): void {
-    /**
-     * If updating a cookie with `maxAge` of `0`, remove it from the store.
-     * Otherwise, two cookie entries will be created.
-     * @see https://github.com/mswjs/msw/issues/2272
-     */
-    if (newCookie.maxAge === 0) {
-      this.removeCookie(
-        newCookie.domain || '',
-        newCookie.path || '',
-        newCookie.key,
-        callback,
-      )
-      return
-    }
-
-    this.putCookie(newCookie, callback)
+  public async setCookie(cookieName: string, url: string): Promise<void> {
+    await this.#jar.setCookie(cookieName, url)
+    this.persist()
   }
 
-  removeCookie(
-    domain: string,
-    path: string,
-    key: string,
-    callback: (error: Error | null) => void,
-  ): void {
-    try {
-      const store = this.getStore()
-      const nextStore = this.deleteCookiesFromList(store, { domain, path, key })
-      this.updateStore(nextStore)
-      callback(null)
-    } catch (error) {
-      if (error instanceof Error) {
-        callback(error)
-      }
+  private getCookieStoreIndex(): MemoryCookieStoreIndex {
+    if (typeof localStorage === 'undefined') {
+      return {}
     }
-  }
 
-  removeCookies(
-    domain: string,
-    path: string,
-    callback: (error: Error | null) => void,
-  ): void {
-    try {
-      const store = this.getStore()
-      const nextStore = this.deleteCookiesFromList(store, { domain, path })
-      this.updateStore(nextStore)
-      callback(null)
-    } catch (error) {
-      if (error instanceof Error) {
-        callback(error)
-      }
+    const cookiesString = localStorage.getItem(this.#storageKey)
+    if (cookiesString == null) {
+      return {}
     }
-  }
 
-  getAllCookies(
-    callback: (error: Error | null, cookie: Array<CookieInstance>) => void,
-  ): void {
-    try {
-      callback(null, this.getStore())
-    } catch (error) {
-      if (error instanceof Error) {
-        callback(error, [])
-      }
+    const rawCookies = jsonParse<Array<Record<string, unknown>>>(cookiesString)
+    if (rawCookies == null) {
+      return {}
     }
-  }
 
-  private getStore(): Array<CookieInstance> {
-    try {
-      const json = this.storage.getItem(this.storageKey)
+    const cookies: MemoryCookieStoreIndex = {}
 
-      if (json == null) {
-        return []
-      }
+    for (const rawCookie of rawCookies) {
+      const cookie = Cookie.fromJSON(rawCookie)
 
-      const rawCookies = JSON.parse(json) as Array<Record<string, any>>
-      const cookies: Array<CookieInstance> = []
-      for (const rawCookie of rawCookies) {
-        const cookie = Cookie.fromJSON(rawCookie)
-        if (cookie != null) {
-          cookies.push(cookie)
-        }
+      if (cookie != null && cookie.domain != null && cookie.path != null) {
+        cookies[cookie.domain] ||= {}
+        cookies[cookie.domain][cookie.path] ||= {}
+        cookies[cookie.domain][cookie.path][cookie.key] = cookie
       }
-      return cookies
-    } catch {
-      return []
     }
-  }
 
-  private updateStore(nextStore: Array<CookieInstance>) {
-    this.storage.setItem(
-      this.storageKey,
-      JSON.stringify(nextStore.map((cookie) => cookie.toJSON())),
-    )
+    return cookies
   }
 
-  private filterCookiesFromList(
-    cookies: Array<CookieInstance>,
-    matches: { domain?: string; path?: string; key?: string },
-  ): Array<CookieInstance> {
-    const result: Array<CookieInstance> = []
-
-    for (const cookie of cookies) {
-      if (matches.domain && !domainMatch(matches.domain, cookie.domain || '')) {
-        continue
-      }
+  private persist(): void {
+    if (typeof localStorage === 'undefined') {
+      return
+    }
 
-      if (matches.path && !pathMatch(matches.path, cookie.path || '')) {
-        continue
-      }
+    const data = []
+    const { idx } = this.#memoryStore
 
-      if (matches.key && cookie.key !== matches.key) {
-        continue
+    for (const domain in idx) {
+      for (const path in idx[domain]) {
+        for (const key in idx[domain][path]) {
+          data.push(idx[domain][path][key].toJSON())
+        }
       }
-
-      result.push(cookie)
     }
 
-    return result
-  }
-
-  private deleteCookiesFromList(
-    cookies: Array<CookieInstance>,
-    matches: { domain?: string; path?: string; key?: string },
-  ) {
-    const matchingCookies = this.filterCookiesFromList(cookies, matches)
-    return cookies.filter((cookie) => !matchingCookies.includes(cookie))
+    localStorage.setItem(this.#storageKey, JSON.stringify(data))
   }
 }
 
-const store = isNodeProcess()
-  ? new MemoryCookieStore()
-  : new WebStorageCookieStore()
-
-export const cookieStore = new CookieJar(store)
+export const cookieStore = new CookieStore()

package/src/core/utils/handleRequest.ts

@@ -105,7 +105,7 @@ export async function handleRequest(
   }
 
   // Store all the received response cookies in the cookie jar.
-  storeResponseCookies(request, response)
+  await storeResponseCookies(request, response)
 
   emitter.emit('request:match', { request, requestId })
 

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

@@ -14,7 +14,6 @@ function formatMessage(message: string, ...positionals: any[]): string {
  * Prints a library-specific warning.
  */
 function warn(message: string, ...positionals: any[]): void {
-  // eslint-disable-next-line no-console
   console.warn(formatMessage(message, ...positionals))
 }
 
@@ -22,7 +21,6 @@ function warn(message: string, ...positionals: any[]): void {
  * Prints a library-specific error.
  */
 function error(message: string, ...positionals: any[]): void {
-  // eslint-disable-next-line no-console
   console.error(formatMessage(message, ...positionals))
 }
 

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

@@ -1,8 +1,8 @@
 // Ignore the source files traces for local testing.
-const SOURCE_FRAME = /[\/\\]msw[\/\\]src[\/\\](.+)/
+const SOURCE_FRAME = /[/\\]msw[/\\]src[/\\](.+)/
 
 const BUILD_FRAME =
-  /(node_modules)?[\/\\]lib[\/\\](core|browser|node|native|iife)[\/\\]|^[^\/\\]*$/
+  /(node_modules)?[/\\]lib[/\\](core|browser|node|native|iife)[/\\]|^[^/\\]*$/
 
 /**
  * Return the stack trace frame of a function's invocation.

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

@@ -168,6 +168,7 @@ async function getGraphQLInput(request: Request): Promise<GraphQLInput | null> {
           variables,
         }
       }
+      return null
     }
 
     default:

package/src/core/utils/matching/matchRequestUrl.ts

@@ -42,13 +42,13 @@ export function coercePath(path: string): string {
        * Escape the port so that "path-to-regexp" can match
        * absolute URLs including port numbers.
        */
-      .replace(/([^\/])(:)(?=\d+)/, '$1\\$2')
+      .replace(/([^/])(:)(?=\d+)/, '$1\\$2')
       /**
        * Escape the protocol so that "path-to-regexp" could match
        * absolute URL.
        * @see https://github.com/pillarjs/path-to-regexp/issues/259
        */
-      .replace(/^([^\/]+)(:)(?=\/\/)/, '$1\\$2')
+      .replace(/^([^/]+)(:)(?=\/\/)/, '$1\\$2')
   )
 }
 

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

@@ -66,7 +66,7 @@ export function getAllRequestCookies(request: Request): Record<string, string> {
     )
   }
 
-  const cookiesFromStore = cookieStore.getCookiesSync(request.url)
+  const cookiesFromStore = cookieStore.getCookies(request.url)
   const storedCookiesObject = Object.fromEntries(
     cookiesFromStore.map((cookie) => [cookie.key, cookie.value]),
   )

package/src/core/utils/request/onUnhandledRequest.test.ts

@@ -17,7 +17,7 @@ Read more: https://mswjs.io/docs/http/intercepting-requests`,
 
   • POST ${url}
 
-  • Request body: {\"variables\":{\"id\":\"abc-123\"},\"query\":\"query UserName($id: String!) { user(id: $id) { name } }\"}
+  • Request body: {"variables":{"id":"abc-123"},"query":"query UserName($id: String!) { user(id: $id) { name } }"}
 
 If you still wish to intercept this unhandled request, please create a request handler for it.
 Read more: https://mswjs.io/docs/http/intercepting-requests`,

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

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

package/src/core/utils/request/toPublicUrl.test.ts

@@ -3,7 +3,7 @@
  */
 import { toPublicUrl } from './toPublicUrl'
 
-test('returns an absolute request URL withouth search params', () => {
+test('returns an absolute request URL without search params', () => {
   expect(toPublicUrl(new URL('https://test.mswjs.io/path'))).toBe(
     'https://test.mswjs.io/path',
   )

package/src/core/utils/url/cleanUrl.ts

@@ -1,4 +1,4 @@
-const REDUNDANT_CHARACTERS_EXP = /[\?|#].*$/g
+const REDUNDANT_CHARACTERS_EXP = /[?|#].*$/g
 
 export function getSearchParams(path: string) {
   return new URL(`/${path}`, 'http://localhost').searchParams

package/src/core/utils/url/isAbsoluteUrl.ts

@@ -2,5 +2,5 @@
  * Determines if the given URL string is an absolute URL.
  */
 export function isAbsoluteUrl(url: string): boolean {
-  return /^([a-z][a-z\d\+\-\.]*:)?\/\//i.test(url)
+  return /^([a-z][a-z\d+\-.]*:)?\/\//i.test(url)
 }

package/src/core/ws/WebSocketClientManager.test.ts

@@ -62,7 +62,7 @@ it('adds multiple clients from this runtime to the list of clients', async () =>
   )
   await manager.addConnection(connectionTwo)
 
-  // Must add the new cilent to the list as well.
+  // Must add the new client to the list as well.
   expect(Array.from(manager.clients.values())).toEqual([
     connectionOne,
     connectionTwo,

package/src/core/ws/WebSocketIndexedDBClientStore.ts

@@ -34,7 +34,6 @@ export class WebSocketIndexedDBClientStore implements WebSocketClientStore {
       promise.resolve()
     }
     request.onerror = () => {
-      // eslint-disable-next-line no-console
       console.error(request.error)
       promise.reject(
         new Error(
@@ -81,7 +80,6 @@ export class WebSocketIndexedDBClientStore implements WebSocketClientStore {
       promise.resolve()
     }
     store.transaction.onerror = () => {
-      // eslint-disable-next-line no-console
       console.error(store.transaction.error)
       promise.reject(
         new Error(
@@ -116,7 +114,6 @@ export class WebSocketIndexedDBClientStore implements WebSocketClientStore {
         promise.resolve(db)
       }
       store.transaction.onerror = () => {
-        // eslint-disable-next-line no-console
         console.error(store.transaction.error)
         promise.reject(
           new Error(
@@ -126,7 +123,6 @@ export class WebSocketIndexedDBClientStore implements WebSocketClientStore {
       }
     }
     request.onerror = () => {
-      // eslint-disable-next-line no-console
       console.error(request.error)
       promise.reject(
         new Error(