msw 2.0.12 → 2.0.13

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

@@ -0,0 +1,215 @@
+/**
+ * @vitest-environment jsdom
+ */
+import {
+  onUnhandledRequest,
+  UnhandledRequestCallback,
+} from './onUnhandledRequest'
+import { HttpHandler, HttpMethods } from '../../handlers/HttpHandler'
+import { ResponseResolver } from '../../handlers/RequestHandler'
+
+const resolver: ResponseResolver = () => void 0
+
+const fixtures = {
+  warningWithoutSuggestions: `\
+[MSW] Warning: intercepted a request without a matching request handler:
+
+  • GET /api
+
+If you still wish to intercept this unhandled request, please create a request handler for it.
+Read more: https://mswjs.io/docs/getting-started/mocks`,
+
+  errorWithoutSuggestions: `\
+[MSW] Error: intercepted a request without a matching request handler:
+
+  • GET /api
+
+If you still wish to intercept this unhandled request, please create a request handler for it.
+Read more: https://mswjs.io/docs/getting-started/mocks`,
+
+  warningWithSuggestions: (suggestions: string) => `\
+[MSW] Warning: intercepted a request without a matching request handler:
+
+  • GET /api
+
+Did you mean to request one of the following resources instead?
+
+${suggestions}
+
+If you still wish to intercept this unhandled request, please create a request handler for it.
+Read more: https://mswjs.io/docs/getting-started/mocks`,
+}
+
+beforeEach(() => {
+  vi.spyOn(console, 'warn').mockImplementation(() => void 0)
+  vi.spyOn(console, 'error').mockImplementation(() => void 0)
+})
+
+afterEach(() => {
+  vi.restoreAllMocks()
+})
+
+test('supports the "bypass" request strategy', async () => {
+  await onUnhandledRequest(
+    new Request(new URL('http://localhost/api')),
+    [],
+    'bypass',
+  )
+
+  expect(console.warn).not.toHaveBeenCalled()
+  expect(console.error).not.toHaveBeenCalled()
+})
+
+test('supports the "warn" request strategy', async () => {
+  await onUnhandledRequest(
+    new Request(new URL('http://localhost/api')),
+    [],
+    'warn',
+  )
+
+  expect(console.warn).toHaveBeenCalledWith(fixtures.warningWithoutSuggestions)
+})
+
+test('supports the "error" request strategy', async () => {
+  await expect(
+    onUnhandledRequest(
+      new Request(new URL('http://localhost/api')),
+      [],
+      'error',
+    ),
+  ).rejects.toThrow(
+    '[MSW] Cannot bypass a request when using the "error" strategy for the "onUnhandledRequest" option.',
+  )
+
+  expect(console.error).toHaveBeenCalledWith(fixtures.errorWithoutSuggestions)
+})
+
+test('supports a custom callback function', async () => {
+  const callback = vi.fn<Parameters<UnhandledRequestCallback>>((request) => {
+    console.warn(`callback: ${request.method} ${request.url}`)
+  })
+  const request = new Request(new URL('/user', 'http://localhost:3000'))
+  await onUnhandledRequest(request, [], callback)
+
+  expect(callback).toHaveBeenCalledTimes(1)
+  expect(callback).toHaveBeenCalledWith(request, {
+    warning: expect.any(Function),
+    error: expect.any(Function),
+  })
+
+  // Check that the custom logic in the callback was called.
+  expect(console.warn).toHaveBeenCalledWith(
+    `callback: GET http://localhost:3000/user`,
+  )
+})
+
+test('supports calling default strategies from the custom callback function', async () => {
+  const callback = vi.fn<Parameters<UnhandledRequestCallback>>(
+    (request, print) => {
+      // Call the default "error" strategy.
+      print.error()
+    },
+  )
+  const request = new Request(new URL('http://localhost/api'))
+  await expect(onUnhandledRequest(request, [], callback)).rejects.toThrow(
+    `[MSW] Cannot bypass a request when using the "error" strategy for the "onUnhandledRequest" option.`,
+  )
+
+  expect(callback).toHaveBeenCalledTimes(1)
+  expect(callback).toHaveBeenCalledWith(request, {
+    warning: expect.any(Function),
+    error: expect.any(Function),
+  })
+
+  // Check that the default strategy was called.
+  expect(console.error).toHaveBeenCalledWith(fixtures.errorWithoutSuggestions)
+})
+
+test('does not print any suggestions given no handlers to suggest', async () => {
+  await onUnhandledRequest(
+    new Request(new URL('http://localhost/api')),
+    [],
+    'warn',
+  )
+
+  expect(console.warn).toHaveBeenCalledWith(fixtures.warningWithoutSuggestions)
+})
+
+test('does not print any suggestions given no handlers are similar', async () => {
+  await onUnhandledRequest(
+    new Request(new URL('http://localhost/api')),
+    [
+      // None of the defined request handlers match the actual request URL
+      // to be used as suggestions.
+      new HttpHandler(HttpMethods.GET, 'https://api.github.com', resolver),
+      new HttpHandler(HttpMethods.GET, 'https://api.stripe.com', resolver),
+    ],
+    'warn',
+  )
+
+  expect(console.warn).toHaveBeenCalledWith(fixtures.warningWithoutSuggestions)
+})
+
+test('respects RegExp as a request handler method', async () => {
+  await onUnhandledRequest(
+    new Request(new URL('http://localhost/api')),
+    [new HttpHandler(/^GE/, 'http://localhost/api', resolver)],
+    'warn',
+  )
+
+  expect(console.warn).toHaveBeenCalledWith(fixtures.warningWithoutSuggestions)
+})
+
+test('sorts the suggestions by relevance', async () => {
+  await onUnhandledRequest(
+    new Request(new URL('http://localhost/api')),
+    [
+      new HttpHandler(HttpMethods.GET, '/', resolver),
+      new HttpHandler(HttpMethods.GET, 'https://api.example.com/api', resolver),
+      new HttpHandler(HttpMethods.POST, '/api', resolver),
+    ],
+    'warn',
+  )
+
+  expect(console.warn).toHaveBeenCalledWith(
+    fixtures.warningWithSuggestions(`\
+  • POST /api
+  • GET /`),
+  )
+})
+
+test('does not print more than 4 suggestions', async () => {
+  await onUnhandledRequest(
+    new Request(new URL('http://localhost/api')),
+    [
+      new HttpHandler(HttpMethods.GET, '/ap', resolver),
+      new HttpHandler(HttpMethods.GET, '/api', resolver),
+      new HttpHandler(HttpMethods.GET, '/api-1', resolver),
+      new HttpHandler(HttpMethods.GET, '/api-2', resolver),
+      new HttpHandler(HttpMethods.GET, '/api-3', resolver),
+      new HttpHandler(HttpMethods.GET, '/api-4', resolver),
+    ],
+    'warn',
+  )
+
+  expect(console.warn).toHaveBeenCalledWith(
+    fixtures.warningWithSuggestions(`\
+  • GET /api
+  • GET /ap
+  • GET /api-1
+  • GET /api-2`),
+  )
+})
+
+test('throws an exception given unknown request strategy', async () => {
+  await expect(
+    onUnhandledRequest(
+      new Request(new URL('http://localhost/api')),
+      [],
+      // @ts-expect-error Intentional unknown strategy.
+      'invalid-strategy',
+    ),
+  ).rejects.toThrow(
+    '[MSW] Failed to react to an unhandled request: unknown strategy "invalid-strategy". Please provide one of the supported strategies ("bypass", "warn", "error") or a custom callback function as the value of the "onUnhandledRequest" option.',
+  )
+})

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

@@ -0,0 +1,247 @@
+import jsLevenshtein from '@bundled-es-modules/js-levenshtein'
+import { RequestHandler, HttpHandler, GraphQLHandler } from '../..'
+import {
+  ParsedGraphQLQuery,
+  ParsedGraphQLRequest,
+  parseGraphQLRequest,
+} from '../internal/parseGraphQLRequest'
+import { getPublicUrlFromRequest } from './getPublicUrlFromRequest'
+import { isStringEqual } from '../internal/isStringEqual'
+import { devUtils } from '../internal/devUtils'
+
+const getStringMatchScore = jsLevenshtein
+
+const MAX_MATCH_SCORE = 3
+const MAX_SUGGESTION_COUNT = 4
+const TYPE_MATCH_DELTA = 0.5
+
+export interface UnhandledRequestPrint {
+  warning(): void
+  error(): void
+}
+
+export type UnhandledRequestCallback = (
+  request: Request,
+  print: UnhandledRequestPrint,
+) => void
+
+export type UnhandledRequestStrategy =
+  | 'bypass'
+  | 'warn'
+  | 'error'
+  | UnhandledRequestCallback
+
+interface RequestHandlerGroups {
+  http: Array<HttpHandler>
+  graphql: Array<GraphQLHandler>
+}
+
+function groupHandlersByType(
+  handlers: Array<RequestHandler>,
+): RequestHandlerGroups {
+  return handlers.reduce<RequestHandlerGroups>(
+    (groups, handler) => {
+      if (handler instanceof HttpHandler) {
+        groups.http.push(handler)
+      }
+
+      if (handler instanceof GraphQLHandler) {
+        groups.graphql.push(handler)
+      }
+
+      return groups
+    },
+    {
+      http: [],
+      graphql: [],
+    },
+  )
+}
+
+type RequestHandlerSuggestion = [number, RequestHandler]
+
+type ScoreGetterFn<RequestHandlerType extends RequestHandler> = (
+  request: Request,
+  handler: RequestHandlerType,
+) => number
+
+function getHttpHandlerScore(): ScoreGetterFn<HttpHandler> {
+  return (request, handler) => {
+    const { path, method } = handler.info
+
+    if (path instanceof RegExp || method instanceof RegExp) {
+      return Infinity
+    }
+
+    const hasSameMethod = isStringEqual(request.method, method)
+
+    // Always treat a handler with the same method as a more similar one.
+    const methodScoreDelta = hasSameMethod ? TYPE_MATCH_DELTA : 0
+    const requestPublicUrl = getPublicUrlFromRequest(request)
+    const score = getStringMatchScore(requestPublicUrl, path)
+
+    return score - methodScoreDelta
+  }
+}
+
+function getGraphQLHandlerScore(
+  parsedQuery: ParsedGraphQLQuery,
+): ScoreGetterFn<GraphQLHandler> {
+  return (_, handler) => {
+    if (typeof parsedQuery.operationName === 'undefined') {
+      return Infinity
+    }
+
+    const { operationType, operationName } = handler.info
+
+    if (typeof operationName !== 'string') {
+      return Infinity
+    }
+
+    const hasSameOperationType = parsedQuery.operationType === operationType
+    // Always treat a handler with the same operation type as a more similar one.
+    const operationTypeScoreDelta = hasSameOperationType ? TYPE_MATCH_DELTA : 0
+    const score = getStringMatchScore(parsedQuery.operationName, operationName)
+
+    return score - operationTypeScoreDelta
+  }
+}
+
+function getSuggestedHandler(
+  request: Request,
+  handlers: Array<HttpHandler> | Array<GraphQLHandler>,
+  getScore: ScoreGetterFn<HttpHandler> | ScoreGetterFn<GraphQLHandler>,
+): Array<RequestHandler> {
+  const suggestedHandlers = (handlers as Array<RequestHandler>)
+    .reduce<Array<RequestHandlerSuggestion>>((suggestions, handler) => {
+      const score = getScore(request, handler as any)
+      return suggestions.concat([[score, handler]])
+    }, [])
+    .sort(([leftScore], [rightScore]) => leftScore - rightScore)
+    .filter(([score]) => score <= MAX_MATCH_SCORE)
+    .slice(0, MAX_SUGGESTION_COUNT)
+    .map(([, handler]) => handler)
+
+  return suggestedHandlers
+}
+
+function getSuggestedHandlersMessage(handlers: RequestHandler[]) {
+  if (handlers.length > 1) {
+    return `\
+Did you mean to request one of the following resources instead?
+
+${handlers.map((handler) => `  • ${handler.info.header}`).join('\n')}`
+  }
+
+  return `Did you mean to request "${handlers[0].info.header}" instead?`
+}
+
+export async function onUnhandledRequest(
+  request: Request,
+  handlers: Array<RequestHandler>,
+  strategy: UnhandledRequestStrategy = 'warn',
+): Promise<void> {
+  const parsedGraphQLQuery = await parseGraphQLRequest(request).catch(
+    () => null,
+  )
+  const publicUrl = getPublicUrlFromRequest(request)
+
+  function generateHandlerSuggestion(): string {
+    /**
+     * @note Ignore exceptions during GraphQL request parsing because at this point
+     * we cannot assume the unhandled request is a valid GraphQL request.
+     * If the GraphQL parsing fails, just don't treat it as a GraphQL request.
+     */
+    const handlerGroups = groupHandlersByType(handlers)
+    const relevantHandlers = parsedGraphQLQuery
+      ? handlerGroups.graphql
+      : handlerGroups.http
+
+    const suggestedHandlers = getSuggestedHandler(
+      request,
+      relevantHandlers,
+      parsedGraphQLQuery
+        ? getGraphQLHandlerScore(parsedGraphQLQuery)
+        : getHttpHandlerScore(),
+    )
+
+    return suggestedHandlers.length > 0
+      ? getSuggestedHandlersMessage(suggestedHandlers)
+      : ''
+  }
+
+  function getGraphQLRequestHeader(
+    parsedGraphQLRequest: ParsedGraphQLRequest<any>,
+  ): string {
+    if (!parsedGraphQLRequest?.operationName) {
+      return `anonymous ${parsedGraphQLRequest?.operationType} (${request.method} ${publicUrl})`
+    }
+
+    return `${parsedGraphQLRequest.operationType} ${parsedGraphQLRequest.operationName} (${request.method} ${publicUrl})`
+  }
+
+  function generateUnhandledRequestMessage(): string {
+    const requestHeader = parsedGraphQLQuery
+      ? getGraphQLRequestHeader(parsedGraphQLQuery)
+      : `${request.method} ${publicUrl}`
+    const handlerSuggestion = generateHandlerSuggestion()
+
+    const messageTemplate = [
+      `intercepted a request without a matching request handler:`,
+      `  \u2022 ${requestHeader}`,
+      handlerSuggestion,
+      `\
+If you still wish to intercept this unhandled request, please create a request handler for it.
+Read more: https://mswjs.io/docs/getting-started/mocks\
+`,
+    ].filter(Boolean)
+    return messageTemplate.join('\n\n')
+  }
+
+  function applyStrategy(strategy: UnhandledRequestStrategy) {
+    // Generate handler suggestions only when applying the strategy.
+    // This saves bandwidth for scenarios when developers opt-out
+    // from the default unhandled request handling strategy.
+    const message = generateUnhandledRequestMessage()
+
+    switch (strategy) {
+      case 'error': {
+        // Print a developer-friendly error.
+        devUtils.error('Error: %s', message)
+
+        // Throw an exception to halt request processing and not perform the original request.
+        throw new Error(
+          devUtils.formatMessage(
+            'Cannot bypass a request when using the "error" strategy for the "onUnhandledRequest" option.',
+          ),
+        )
+      }
+
+      case 'warn': {
+        devUtils.warn('Warning: %s', message)
+        break
+      }
+
+      case 'bypass':
+        break
+
+      default:
+        throw new Error(
+          devUtils.formatMessage(
+            'Failed to react to an unhandled request: unknown strategy "%s". Please provide one of the supported strategies ("bypass", "warn", "error") or a custom callback function as the value of the "onUnhandledRequest" option.',
+            strategy,
+          ),
+        )
+    }
+  }
+
+  if (typeof strategy === 'function') {
+    strategy(request, {
+      warning: applyStrategy.bind(null, 'warn'),
+      error: applyStrategy.bind(null, 'error'),
+    })
+    return
+  }
+
+  applyStrategy(strategy)
+}

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

@@ -0,0 +1,9 @@
+import { store } from '@mswjs/cookies'
+
+export function readResponseCookies(
+  request: Request,
+  response: Response,
+): void {
+  store.add({ ...request, url: request.url.toString() }, response)
+  store.persist()
+}

package/src/core/utils/toResponseInit.ts

@@ -0,0 +1,7 @@
+export function toResponseInit(response: Response): ResponseInit {
+  return {
+    status: response.status,
+    statusText: response.statusText,
+    headers: Object.fromEntries(response.headers.entries()),
+  }
+}

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

@@ -0,0 +1,17 @@
+import { cleanUrl } from './cleanUrl'
+
+test('removes query parameters from a URL string', () => {
+  expect(cleanUrl('/user?id=123')).toEqual('/user')
+  expect(cleanUrl('/user?id=123&id=456')).toEqual('/user')
+  expect(cleanUrl('/user?id=123&role=admin')).toEqual('/user')
+})
+
+test('removes hashes from a URL string', () => {
+  expect(cleanUrl('/user#hash')).toEqual('/user')
+  expect(cleanUrl('/user#hash-with-dashes')).toEqual('/user')
+})
+
+test('removes both query parameters and hashes from a URL string', () => {
+  expect(cleanUrl('/user?id=123#some')).toEqual('/user')
+  expect(cleanUrl('/user?id=123&role=admin#some')).toEqual('/user')
+})

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

@@ -0,0 +1,12 @@
+const REDUNDANT_CHARACTERS_EXP = /[\?|#].*$/g
+
+export function getSearchParams(path: string) {
+  return new URL(`/${path}`, 'http://localhost').searchParams
+}
+
+/**
+ * Removes query parameters and hashes from a given URL string.
+ */
+export function cleanUrl(path: string): string {
+  return path.replace(REDUNDANT_CHARACTERS_EXP, '')
+}

package/src/core/utils/url/getAbsoluteUrl.node.test.ts

@@ -0,0 +1,19 @@
+/**
+ * @vitest-environment node
+ */
+import { getAbsoluteUrl } from './getAbsoluteUrl'
+
+test('returns a given relative URL as-is', () => {
+  expect(getAbsoluteUrl('/reviews')).toBe('/reviews')
+})
+
+test('rebases a relative URL against a custom base URL', () => {
+  expect(getAbsoluteUrl('/user', 'https://api.github.com')).toEqual(
+    'https://api.github.com/user',
+  )
+})
+test('returns a given absolute URL as-is', () => {
+  expect(getAbsoluteUrl('https://api.mswjs.io/users')).toBe(
+    'https://api.mswjs.io/users',
+  )
+})

package/src/core/utils/url/getAbsoluteUrl.test.ts

@@ -0,0 +1,29 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { getAbsoluteUrl } from './getAbsoluteUrl'
+
+test('rebases a relative URL against the current "baseURI" (default)', () => {
+  expect(getAbsoluteUrl('/reviews')).toEqual('http://localhost/reviews')
+})
+
+test('rebases a relative URL against a custom base URL', () => {
+  expect(getAbsoluteUrl('/user', 'https://api.github.com')).toEqual(
+    'https://api.github.com/user',
+  )
+})
+
+test('returns a given absolute URL as-is', () => {
+  expect(getAbsoluteUrl('https://api.mswjs.io/users')).toEqual(
+    'https://api.mswjs.io/users',
+  )
+})
+
+test('returns an absolute URL given a relative path without a leading slash', () => {
+  expect(getAbsoluteUrl('users')).toEqual('http://localhost/users')
+})
+
+test('returns a path with a pattern as-is', () => {
+  expect(getAbsoluteUrl(':api/user')).toEqual('http://localhost/:api/user')
+  expect(getAbsoluteUrl('*/resource/*')).toEqual('*/resource/*')
+})

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

@@ -0,0 +1,26 @@
+import { isAbsoluteUrl } from './isAbsoluteUrl'
+
+/**
+ * Returns an absolute URL based on the given path.
+ */
+export function getAbsoluteUrl(path: string, baseUrl?: string): string {
+  // already absolute URL
+  if (isAbsoluteUrl(path)) {
+    return path
+  }
+
+  // Ignore path with pattern start with *
+  if (path.startsWith('*')) {
+    return path
+  }
+
+  // Resolve a relative request URL against a given custom "baseUrl"
+  // or the document baseURI (in the case of browser/browser-like environments).
+  const origin =
+    baseUrl || (typeof document !== 'undefined' && document.baseURI)
+
+  return origin
+    ? // Encode and decode the path to preserve escaped characters.
+      decodeURI(new URL(encodeURI(path), origin).href)
+    : path
+}

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

@@ -0,0 +1,32 @@
+/**
+ * @vitest-environment node
+ */
+import { isAbsoluteUrl } from './isAbsoluteUrl'
+
+test('returns true for the "http" scheme', () => {
+  expect(isAbsoluteUrl('http://www.domain.com')).toEqual(true)
+})
+
+test('returns true for the "https" scheme', () => {
+  expect(isAbsoluteUrl('https://www.domain.com')).toEqual(true)
+})
+
+test('returns true for the "ws" scheme', () => {
+  expect(isAbsoluteUrl('ws://www.domain.com')).toEqual(true)
+})
+
+test('returns true for the "ftp" scheme', () => {
+  expect(isAbsoluteUrl('ftp://www.domain.com')).toEqual(true)
+})
+
+test('returns true for the custom scheme', () => {
+  expect(isAbsoluteUrl('web+my://www.example.com')).toEqual(true)
+})
+
+test('returns false for the relative URL', () => {
+  expect(isAbsoluteUrl('/test')).toEqual(false)
+})
+
+test('returns false for the relative URL without a leading slash', () => {
+  expect(isAbsoluteUrl('test')).toEqual(false)
+})

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

@@ -0,0 +1,6 @@
+/**
+ * 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)
+}

package/src/iife/index.ts

@@ -0,0 +1,2 @@
+export * from '~/core'
+export * from '../browser'