msw 2.12.5 → 2.12.7

package/lib/mockServiceWorker.js

@@ -7,7 +7,7 @@
  * - Please do NOT modify this file.
  */
 
-const PACKAGE_VERSION = '2.12.5'
+const PACKAGE_VERSION = '2.12.7'
 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.12.5",
+  "version": "2.12.7",
   "description": "Seamless REST/GraphQL API mocking library for browser and Node.js.",
   "type": "commonjs",
   "main": "./lib/core/index.js",
@@ -285,7 +285,7 @@
     "vitest-environment-miniflare": "^2.14.4",
     "webpack": "^5.95.0",
     "webpack-http-server": "^0.5.0",
-    "msw": "2.12.5"
+    "msw": "2.12.7"
   },
   "peerDependencies": {
     "typescript": ">= 4.8.x"

package/src/browser/setupWorker/start/createFallbackRequestListener.ts

@@ -29,6 +29,9 @@ export function createFallbackRequestListener(
       options,
       context.emitter,
       {
+        resolutionContext: {
+          quiet: options.quiet,
+        },
         onMockedResponse(_, { handler, parsedResult }) {
           if (!options.quiet) {
             context.emitter.once('response:mocked', ({ response }) => {

package/src/browser/setupWorker/start/createRequestListener.ts

@@ -46,6 +46,9 @@ export const createRequestListener = (
         options,
         context.emitter,
         {
+          resolutionContext: {
+            quiet: options.quiet,
+          },
           onPassthroughResponse() {
             event.postMessage('PASSTHROUGH')
           },

package/src/core/graphql.ts

@@ -1,4 +1,4 @@
-import type { DocumentNode, OperationTypeNode } from 'graphql'
+import type { OperationTypeNode } from 'graphql'
 import {
   ResponseResolver,
   RequestHandlerOptions,
@@ -7,32 +7,29 @@ import {
   GraphQLHandler,
   GraphQLVariables,
   GraphQLOperationType,
-  GraphQLHandlerNameSelector,
   GraphQLResolverExtras,
   GraphQLResponseBody,
   GraphQLQuery,
-  GraphQLCustomPredicate,
+  GraphQLPredicate,
 } from './handlers/GraphQLHandler'
 import type { Path } from './utils/matching/matchRequestUrl'
 
-export interface TypedDocumentNode<
-  Result = { [key: string]: any },
-  Variables = { [key: string]: any },
-> extends DocumentNode {
-  __apiType?: (variables: Variables) => Result
-  __resultType?: Result
-  __variablesType?: Variables
-}
-
 export type GraphQLRequestHandler = <
   Query extends GraphQLQuery = GraphQLQuery,
   Variables extends GraphQLVariables = GraphQLVariables,
 >(
-  predicate:
-    | GraphQLHandlerNameSelector
-    | DocumentNode
-    | TypedDocumentNode<Query, Variables>
-    | GraphQLCustomPredicate,
+  predicate: GraphQLPredicate<Query, Variables>,
+  resolver: GraphQLResponseResolver<
+    [Query] extends [never] ? GraphQLQuery : Query,
+    Variables
+  >,
+  options?: RequestHandlerOptions,
+) => GraphQLHandler
+
+export type GraphQLOperationHandler = <
+  Query extends GraphQLQuery = GraphQLQuery,
+  Variables extends GraphQLVariables = GraphQLVariables,
+>(
   resolver: GraphQLResponseResolver<
     [Query] extends [never] ? GraphQLQuery : Query,
     Variables
@@ -58,22 +55,28 @@ function createScopedGraphQLHandler(
   }
 }
 
-function createGraphQLOperationHandler(url: Path) {
-  return <
-    Query extends GraphQLQuery = GraphQLQuery,
-    Variables extends GraphQLVariables = GraphQLVariables,
-  >(
-    resolver: ResponseResolver<
-      GraphQLResolverExtras<Variables>,
-      null,
-      GraphQLResponseBody<Query>
-    >,
-  ) => {
-    return new GraphQLHandler('all', new RegExp('.*'), url, resolver)
+function createGraphQLOperationHandler(url: Path): GraphQLOperationHandler {
+  return (resolver, options) => {
+    return new GraphQLHandler('all', new RegExp('.*'), url, resolver, options)
   }
 }
 
-const standardGraphQLHandlers = {
+export interface GraphQLLinkHandlers {
+  query: GraphQLRequestHandler
+  mutation: GraphQLRequestHandler
+  operation: GraphQLOperationHandler
+}
+
+/**
+ * A namespace to intercept and mock GraphQL operations
+ *
+ * @example
+ * graphql.query('GetUser', resolver)
+ * graphql.mutation('DeletePost', resolver)
+ *
+ * @see {@link https://mswjs.io/docs/api/graphql `graphql` API reference}
+ */
+export const graphql = {
   /**
    * Intercepts a GraphQL query by a given name.
    *
@@ -110,27 +113,6 @@ const standardGraphQLHandlers = {
    * @see {@link https://mswjs.io/docs/api/graphql#graphqloperationresolver `graphql.operation()` API reference}
    */
   operation: createGraphQLOperationHandler('*'),
-}
-
-function createGraphQLLink(url: Path): typeof standardGraphQLHandlers {
-  return {
-    operation: createGraphQLOperationHandler(url),
-    query: createScopedGraphQLHandler('query' as OperationTypeNode, url),
-    mutation: createScopedGraphQLHandler('mutation' as OperationTypeNode, url),
-  }
-}
-
-/**
- * A namespace to intercept and mock GraphQL operations
- *
- * @example
- * graphql.query('GetUser', resolver)
- * graphql.mutation('DeletePost', resolver)
- *
- * @see {@link https://mswjs.io/docs/api/graphql `graphql` API reference}
- */
-export const graphql = {
-  ...standardGraphQLHandlers,
 
   /**
    * Intercepts GraphQL operations scoped by the given URL.
@@ -141,5 +123,14 @@ export const graphql = {
    *
    * @see {@link https://mswjs.io/docs/api/graphql#graphqllinkurl `graphql.link()` API reference}
    */
-  link: createGraphQLLink,
+  link(url: Path): GraphQLLinkHandlers {
+    return {
+      operation: createGraphQLOperationHandler(url),
+      query: createScopedGraphQLHandler('query' as OperationTypeNode, url),
+      mutation: createScopedGraphQLHandler(
+        'mutation' as OperationTypeNode,
+        url,
+      ),
+    }
+  },
 }

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

@@ -139,7 +139,7 @@ describe('info', () => {
     expect(
       () => new GraphQLHandler(OperationTypeNode.QUERY, node, '*', resolver),
     ).toThrow(
-      'Failed to create a GraphQL handler: provided a DocumentNode with a mismatched operation type (expected "query", but got "mutation").',
+      'Failed to create a GraphQL handler: provided a DocumentNode with a mismatched operation type (expected "query" but got "mutation").',
     )
   })
 })

package/src/core/handlers/GraphQLHandler.ts

@@ -1,4 +1,9 @@
-import type { DocumentNode, GraphQLError, OperationTypeNode } from 'graphql'
+import {
+  parse,
+  type DocumentNode,
+  type GraphQLError,
+  type OperationTypeNode,
+} from 'graphql'
 import {
   DefaultBodyType,
   RequestHandler,
@@ -16,10 +21,21 @@ import {
   GraphQLMultipartRequestBody,
   parseGraphQLRequest,
   parseDocumentNode,
+  ParsedGraphQLQuery,
 } from '../utils/internal/parseGraphQLRequest'
 import { toPublicUrl } from '../utils/request/toPublicUrl'
 import { devUtils } from '../utils/internal/devUtils'
 import { getAllRequestCookies } from '../utils/request/getRequestCookies'
+import { invariant } from 'outvariant'
+
+export interface DocumentTypeDecoration<
+  Result = { [key: string]: any },
+  Variables = { [key: string]: any },
+> {
+  __apiType?: (variables: Variables) => Result
+  __resultType?: Result
+  __variablesType?: Variables
+}
 
 export type GraphQLOperationType = OperationTypeNode | 'all'
 export type GraphQLHandlerNameSelector = DocumentNode | RegExp | string
@@ -88,8 +104,9 @@ export type GraphQLCustomPredicate = (args: {
 
 export type GraphQLCustomPredicateResult = boolean | { matches: boolean }
 
-export type GraphQLPredicate =
+export type GraphQLPredicate<Query = any, Variables = any> =
   | GraphQLHandlerNameSelector
+  | DocumentTypeDecoration<Query, Variables>
   | GraphQLCustomPredicate
 
 export function isDocumentNode(
@@ -102,6 +119,12 @@ export function isDocumentNode(
   return typeof value === 'object' && 'kind' in value && 'definitions' in value
 }
 
+function isDocumentTypeDecoration(
+  value: any,
+): value is DocumentTypeDecoration<any, any> {
+  return value instanceof String
+}
+
 export class GraphQLHandler extends RequestHandler<
   GraphQLHandlerInfo,
   GraphQLRequestParsedResult,
@@ -114,6 +137,45 @@ export class GraphQLHandler extends RequestHandler<
     ParsedGraphQLRequest<GraphQLVariables>
   >()
 
+  static #parseOperationName(
+    predicate: GraphQLPredicate,
+    operationType: GraphQLOperationType,
+  ): GraphQLHandlerInfo['operationName'] {
+    const getOperationName = (node: ParsedGraphQLQuery): string => {
+      invariant(
+        node.operationType === operationType,
+        'Failed to create a GraphQL handler: provided a DocumentNode with a mismatched operation type (expected "%s" but got "%s").',
+        operationType,
+        node.operationType,
+      )
+
+      invariant(
+        node.operationName,
+        'Failed to create a GraphQL handler: provided a DocumentNode without operation name',
+      )
+
+      return node.operationName
+    }
+
+    if (isDocumentNode(predicate)) {
+      return getOperationName(parseDocumentNode(predicate))
+    }
+
+    if (isDocumentTypeDecoration(predicate)) {
+      const documentNode = parse(predicate.toString())
+
+      invariant(
+        isDocumentNode(documentNode),
+        'Failed to create a GraphQL handler: given TypedDocumentString (%s) does not produce a valid DocumentNode',
+        predicate,
+      )
+
+      return getOperationName(parseDocumentNode(documentNode))
+    }
+
+    return predicate
+  }
+
   constructor(
     operationType: GraphQLOperationType,
     predicate: GraphQLPredicate,
@@ -121,30 +183,13 @@ export class GraphQLHandler extends RequestHandler<
     resolver: ResponseResolver<GraphQLResolverExtras<any>, any, any>,
     options?: RequestHandlerOptions,
   ) {
-    let resolvedOperationName = predicate
-
-    if (isDocumentNode(resolvedOperationName)) {
-      const parsedNode = parseDocumentNode(resolvedOperationName)
-
-      if (parsedNode.operationType !== operationType) {
-        throw new Error(
-          `Failed to create a GraphQL handler: provided a DocumentNode with a mismatched operation type (expected "${operationType}", but got "${parsedNode.operationType}").`,
-        )
-      }
-
-      if (!parsedNode.operationName) {
-        throw new Error(
-          `Failed to create a GraphQL handler: provided a DocumentNode with no operation name.`,
-        )
-      }
-
-      resolvedOperationName = parsedNode.operationName
-    }
+    const operationName = GraphQLHandler.#parseOperationName(
+      predicate,
+      operationType,
+    )
 
     const displayOperationName =
-      typeof resolvedOperationName === 'function'
-        ? '[custom predicate]'
-        : resolvedOperationName
+      typeof operationName === 'function' ? '[custom predicate]' : operationName
 
     const header =
       operationType === 'all'
@@ -155,7 +200,10 @@ export class GraphQLHandler extends RequestHandler<
       info: {
         header,
         operationType,
-        operationName: resolvedOperationName,
+        operationName: GraphQLHandler.#parseOperationName(
+          predicate,
+          operationType,
+        ),
       },
       resolver,
       options,

package/src/core/index.ts

@@ -73,7 +73,12 @@ export type {
   GraphQLOperationType,
   GraphQLCustomPredicate,
 } from './handlers/GraphQLHandler'
-export type { GraphQLRequestHandler, GraphQLResponseResolver } from './graphql'
+export type {
+  GraphQLRequestHandler,
+  GraphQLOperationHandler,
+  GraphQLResponseResolver,
+  GraphQLLinkHandlers,
+} from './graphql'
 
 export type { WebSocketData, WebSocketEventListener } from './ws'
 

package/src/core/sse.ts

@@ -6,6 +6,7 @@ import {
   type HttpRequestResolverExtras,
   type HttpRequestParsedResult,
 } from './handlers/HttpHandler'
+import type { ResponseResolutionContext } from '~/core/utils/executeHandlers'
 import type { Path, PathParams } from './utils/matching/matchRequestUrl'
 import { delay } from './delay'
 import { getTimestamp } from './utils/logging/getTimestamp'
@@ -67,9 +68,19 @@ export const sse: ServerSentEventRequestHandler = (path, resolver) => {
   return new ServerSentEventHandler(path, resolver)
 }
 
+const SSE_RESPONSE_INIT: ResponseInit = {
+  headers: {
+    'content-type': 'text/event-stream',
+    'cache-control': 'no-cache',
+    connection: 'keep-alive',
+  },
+}
+
 class ServerSentEventHandler<
   EventMap extends EventMapConstraint,
 > extends HttpHandler {
+  #emitter: Emitter<ServerSentEventClientEventMap>
+
   constructor(path: Path, resolver: ServerSentEventResolver<EventMap, any>) {
     invariant(
       typeof EventSource !== 'undefined',
@@ -77,37 +88,12 @@ class ServerSentEventHandler<
       path,
     )
 
-    const clientEmitter = new Emitter<ServerSentEventClientEventMap>()
-
     super('GET', path, async (info) => {
-      const responseInit: ResponseInit = {
-        headers: {
-          'content-type': 'text/event-stream',
-          'cache-control': 'no-cache',
-          connection: 'keep-alive',
-        },
-      }
-
-      /**
-       * @note Log the intercepted request early.
-       * Normally, the `this.log()` method is called when the handler returns a response.
-       * For SSE, call that method earlier so the logs are in correct order.
-       */
-      await super.log({
-        request: info.request,
-        /**
-         * @note Construct a placeholder response since SSE response
-         * is being streamed and cannot be cloned/consumed for logging.
-         */
-        response: new Response('[streaming]', responseInit),
-      })
-      this.#attachClientLogger(info.request, clientEmitter)
-
       const stream = new ReadableStream({
-        async start(controller) {
+        start: async (controller) => {
           const client = new ServerSentEventClient<EventMap>({
             controller,
-            emitter: clientEmitter,
+            emitter: this.#emitter,
           })
           const server = new ServerSentEventServer({
             request: info.request,
@@ -122,19 +108,42 @@ class ServerSentEventHandler<
         },
       })
 
-      return new Response(stream, responseInit)
+      return new Response(stream, SSE_RESPONSE_INIT)
     })
+
+    this.#emitter = new Emitter<ServerSentEventClientEventMap>()
   }
 
   async predicate(args: {
     request: Request
     parsedResult: HttpRequestParsedResult
+    resolutionContext?: ResponseResolutionContext
   }) {
     if (args.request.headers.get('accept') !== 'text/event-stream') {
       return false
     }
 
-    return super.predicate(args)
+    const matches = await super.predicate(args)
+
+    if (matches && !args.resolutionContext?.quiet) {
+      /**
+       * @note Log the intercepted request early.
+       * Normally, the `this.log()` method is called when the handler returns a response.
+       * For SSE, call that method earlier so the logs are in correct order.
+       */
+      await super.log({
+        request: args.request,
+        /**
+         * @note Construct a placeholder response since SSE response
+         * is being streamed and cannot be cloned/consumed for logging.
+         */
+        response: new Response('[streaming]', SSE_RESPONSE_INIT),
+      })
+
+      this.#attachClientLogger(args.request, this.#emitter)
+    }
+
+    return matches
   }
 
   async log(_args: { request: Request; response: Response }): Promise<void> {

package/src/core/utils/executeHandlers.ts

@@ -10,7 +10,13 @@ export interface HandlersExecutionResult {
 }
 
 export interface ResponseResolutionContext {
+  /**
+   * A base url to use when resolving relative urls.
+   * @note This is primarily used by the `@mswjs/http-middleware`
+   * to resolve relative urls in the context of the running server
+   */
   baseUrl?: string
+  quiet?: boolean
 }
 
 /**

package/src/core/utils/handleRequest.ts

@@ -3,7 +3,11 @@ import { Emitter } from 'strict-event-emitter'
 import { LifeCycleEventsMap, SharedOptions } from '../sharedOptions'
 import { RequiredDeep } from '../typeUtils'
 import type { RequestHandler } from '../handlers/RequestHandler'
-import { HandlersExecutionResult, executeHandlers } from './executeHandlers'
+import {
+  type HandlersExecutionResult,
+  type ResponseResolutionContext,
+  executeHandlers,
+} from './executeHandlers'
 import { onUnhandledRequest } from './request/onUnhandledRequest'
 import { storeResponseCookies } from './request/storeResponseCookies'
 
@@ -13,14 +17,7 @@ export interface HandleRequestOptions {
    * but is exposed to aid in creating extensions like
    * `@mswjs/http-middleware`.
    */
-  resolutionContext?: {
-    /**
-     * A base url to use when resolving relative urls.
-     * @note This is primarily used by the `@mswjs/http-middleware`
-     * to resolve relative urls in the context of the running server
-     */
-    baseUrl?: string
-  }
+  resolutionContext?: ResponseResolutionContext
 
   /**
    * Invoked whenever a request is performed as-is.