msw 0.33.1 → 0.35.0

package/lib/umd/mockServiceWorker.js

@@ -2,13 +2,13 @@
 /* tslint:disable */
 
 /**
- * Mock Service Worker (0.33.1).
+ * Mock Service Worker (0.35.0).
  * @see https://github.com/mswjs/msw
  * - Please do NOT modify this file.
  * - Please do NOT serve this file on production.
  */
 
-const INTEGRITY_CHECKSUM = 'a615cd395ea10f948a628bce3857a385'
+const INTEGRITY_CHECKSUM = 'f0a916b13c8acc2b526a03a6d26df85f'
 const bypassHeaderName = 'x-msw-bypass'
 const activeClientIds = new Set()
 
@@ -221,13 +221,11 @@ async function getResponse(event, client, requestId) {
 
       console.error(
         `\
-[MSW] Request handler function for "%s %s" has thrown the following exception:
+[MSW] Uncaught exception in the request handler for "%s %s":
 
-${parsedBody.errorType}: ${parsedBody.message}
-(see more detailed error stack trace in the mocked response body)
+${parsedBody.location}
 
-This exception has been gracefully handled as a 500 response, however, it's strongly recommended to resolve this error.
-If you wish to mock an error response, please refer to this guide: https://mswjs.io/docs/recipes/mocking-error-responses\
+This exception has been gracefully handled as a 500 response, however, it's strongly recommended to resolve this error, as it indicates a mistake in your code. If you wish to mock an error response, please see this guide: https://mswjs.io/docs/recipes/mocking-error-responses\
 `,
         request.method,
         request.url,
@@ -271,11 +269,22 @@ self.addEventListener('fetch', function (event) {
 
   return event.respondWith(
     handleRequest(event, requestId).catch((error) => {
+      if (error.name === 'NetworkError') {
+        console.warn(
+          '[MSW] Successfully emulated a network error for the "%s %s" request.',
+          request.method,
+          request.url,
+        )
+        return
+      }
+
+      // At this point, any exception indicates an issue with the original request/response.
       console.error(
-        '[MSW] Failed to mock a "%s" request to "%s": %s',
+        `\
+[MSW] Caught an exception from the "%s %s" request (%s). This is probably not a problem with Mock Service Worker. There is likely an additional logging output above.`,
         request.method,
         request.url,
-        error,
+        `${error.name}: ${error.message}`,
       )
     }),
   )

package/native/lib/index.js

@@ -1511,6 +1511,65 @@ var lib = {};
 
 var invariant$2 = {};
 
+var format$1 = {};
+
+Object.defineProperty(format$1, "__esModule", { value: true });
+format$1.format = void 0;
+var POSITIONALS_EXP = /(%?)(%([sdjo]))/g;
+function serializePositional(positional, flag) {
+    switch (flag) {
+        // Strings.
+        case 's':
+            return positional;
+        // Digits.
+        case 'd':
+        case 'i':
+            return Number(positional);
+        // JSON.
+        case 'j':
+            return JSON.stringify(positional);
+        // Objects.
+        case 'o': {
+            // Preserve stings to prevent extra quotes around them.
+            if (typeof positional === 'string') {
+                return positional;
+            }
+            var json = JSON.stringify(positional);
+            // If the positional isn't serializable, return it as-is.
+            if (json === '{}' || json === '[]' || /^\[object .+?\]$/.test(json)) {
+                return positional;
+            }
+            return json;
+        }
+    }
+}
+function format(message) {
+    var positionals = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        positionals[_i - 1] = arguments[_i];
+    }
+    if (positionals.length === 0) {
+        return message;
+    }
+    var positionalIndex = 0;
+    var formattedMessage = message.replace(POSITIONALS_EXP, function (match, isEscaped, _, flag) {
+        var positional = positionals[positionalIndex];
+        var value = serializePositional(positional, flag);
+        if (!isEscaped) {
+            positionalIndex++;
+            return value;
+        }
+        return match;
+    });
+    // Append unresolved positionals to string as-is.
+    if (positionalIndex < positionals.length) {
+        formattedMessage += " " + positionals.slice(positionalIndex).join(' ');
+    }
+    formattedMessage = formattedMessage.replace(/%{2,2}/g, '%');
+    return formattedMessage;
+}
+format$1.format = format;
+
 var __extends = (commonjsGlobal && commonjsGlobal.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -1532,21 +1591,9 @@ var __spreadArray = (commonjsGlobal && commonjsGlobal.__spreadArray) || function
     return to;
 };
 Object.defineProperty(invariant$2, "__esModule", { value: true });
-invariant$2.invariant = invariant$2.InvariantError = invariant$2.interpolate = void 0;
+invariant$2.invariant = invariant$2.InvariantError = void 0;
+var format_1 = format$1;
 var STACK_FRAMES_TO_IGNORE = 2;
-function interpolate(message) {
-    var positionals = [];
-    for (var _i = 1; _i < arguments.length; _i++) {
-        positionals[_i - 1] = arguments[_i];
-    }
-    var index = 0;
-    return message.replace(/%[s|d|o]/g, function (match) {
-        var _a;
-        var value = (_a = positionals[index++]) !== null && _a !== void 0 ? _a : match;
-        return typeof value === 'object' ? JSON.stringify(value) : value;
-    });
-}
-invariant$2.interpolate = interpolate;
 var InvariantError = /** @class */ (function (_super) {
     __extends(InvariantError, _super);
     function InvariantError(message) {
@@ -1556,7 +1603,7 @@ var InvariantError = /** @class */ (function (_super) {
         }
         var _this = _super.call(this, message) || this;
         _this.name = 'Invariant Violation';
-        _this.message = interpolate.apply(void 0, __spreadArray([message], positionals));
+        _this.message = format_1.format.apply(void 0, __spreadArray([message], positionals));
         if (_this.stack) {
             var prevStack = _this.stack;
             _this.stack = prevStack
@@ -1593,6 +1640,7 @@ var __exportStar = (commonjsGlobal && commonjsGlobal.__exportStar) || function(m
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(invariant$2, exports);
+__exportStar(format$1, exports);
 }(lib));
 
 const LIBRARY_PREFIX = '[MSW]';
@@ -1600,7 +1648,7 @@ const LIBRARY_PREFIX = '[MSW]';
  * Formats a given message by appending the library's prefix string.
  */
 function formatMessage(message, ...positionals) {
-    const interpolatedMessage = lib.interpolate(message, ...positionals);
+    const interpolatedMessage = lib.format(message, ...positionals);
     return `${LIBRARY_PREFIX} ${interpolatedMessage}`;
 }
 /**
@@ -4861,17 +4909,20 @@ const getPublicUrlFromRequest = (request) => {
         : new URL(request.url.pathname, `${request.url.protocol}//${request.url.host}`).href;
 };
 
-function parseQuery(query) {
+function parseDocumentNode(node) {
     var _a;
+    const operationDef = node.definitions.find((def) => {
+        return def.kind === 'OperationDefinition';
+    });
+    return {
+        operationType: operationDef === null || operationDef === void 0 ? void 0 : operationDef.operation,
+        operationName: (_a = operationDef === null || operationDef === void 0 ? void 0 : operationDef.name) === null || _a === void 0 ? void 0 : _a.value,
+    };
+}
+function parseQuery(query) {
     try {
         const ast = parse(query);
-        const operationDef = ast.definitions.find((def) => {
-            return def.kind === 'OperationDefinition';
-        });
-        return {
-            operationType: operationDef === null || operationDef === void 0 ? void 0 : operationDef.operation,
-            operationName: (_a = operationDef === null || operationDef === void 0 ? void 0 : operationDef.name) === null || _a === void 0 ? void 0 : _a.value,
-        };
+        return parseDocumentNode(ast);
     }
     catch (error) {
         return error;
@@ -4951,7 +5002,7 @@ function parseGraphQLRequest(request) {
     const parsedResult = parseQuery(query);
     if (parsedResult instanceof Error) {
         const requestPublicUrl = getPublicUrlFromRequest(request);
-        throw new Error(devUtils.formatMessage('Failed to intercept a GraphQL request to "%s %s": cannot parse query. See the error message from the parser below.\n\n%o', request.method, requestPublicUrl, parsedResult.message));
+        throw new Error(devUtils.formatMessage('Failed to intercept a GraphQL request to "%s %s": cannot parse query. See the error message from the parser below.\n\n%s', request.method, requestPublicUrl, parsedResult.message));
     }
     return {
         operationType: parsedResult.operationType,
@@ -5295,17 +5346,23 @@ const xml = (body) => {
     };
 };
 
+var StatusCodeColor;
+(function (StatusCodeColor) {
+    StatusCodeColor["Success"] = "#69AB32";
+    StatusCodeColor["Warning"] = "#F0BB4B";
+    StatusCodeColor["Danger"] = "#E95F5D";
+})(StatusCodeColor || (StatusCodeColor = {}));
 /**
  * Returns a HEX color for a given response status code number.
  */
 function getStatusCodeColor(status) {
     if (status < 300) {
-        return '#69AB32';
+        return StatusCodeColor.Success;
     }
     if (status < 400) {
-        return '#F0BB4B';
+        return StatusCodeColor.Warning;
     }
-    return '#E95F5D';
+    return StatusCodeColor.Danger;
 }
 
 /**
@@ -5411,7 +5468,10 @@ function getAbsoluteUrl(path, baseUrl) {
     // Resolve a relative request URL against a given custom "baseUrl"
     // or the current location (in the case of browser/browser-like environments).
     const origin = baseUrl || (typeof location !== 'undefined' && location.origin);
-    return origin ? new URL(path, origin).href : path;
+    return origin
+        ? // Encode and decode the path to preserve escaped characters.
+            decodeURI(new URL(encodeURI(path), origin).href)
+        : path;
 }
 
 /**
@@ -5691,7 +5751,8 @@ ${queryParams
         const publicUrl = getPublicUrlFromRequest(request);
         const loggedRequest = prepareRequest(request);
         const loggedResponse = prepareResponse(response);
-        console.groupCollapsed(devUtils.formatMessage('%s %s %s (%c%s%c)'), getTimestamp(), request.method, publicUrl, `color:${getStatusCodeColor(response.status)} %s`, response.status, response.statusText, 'color:inherit');
+        const statusColor = getStatusCodeColor(response.status);
+        console.groupCollapsed(devUtils.formatMessage('%s %s %s (%c%s%c)'), getTimestamp(), request.method, publicUrl, `color:${statusColor}`, `${response.status} ${response.statusText}`, 'color:inherit');
         console.log('Request', loggedRequest);
         console.log('Handler:', {
             mask: this.info.path,
@@ -5721,16 +5782,33 @@ const graphqlContext = {
     errors,
     cookie,
 };
+function isDocumentNode(value) {
+    if (value == null) {
+        return false;
+    }
+    return typeof value === 'object' && 'kind' in value && 'definitions' in value;
+}
 class GraphQLHandler extends RequestHandler {
     constructor(operationType, operationName, endpoint, resolver) {
+        let resolvedOperationName = operationName;
+        if (isDocumentNode(operationName)) {
+            const parsedNode = parseDocumentNode(operationName);
+            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 header = operationType === 'all'
             ? `${operationType} (origin: ${endpoint.toString()})`
-            : `${operationType} ${operationName} (origin: ${endpoint.toString()})`;
+            : `${operationType} ${resolvedOperationName} (origin: ${endpoint.toString()})`;
         super({
             info: {
                 header,
                 operationType,
-                operationName,
+                operationName: resolvedOperationName,
             },
             ctx: graphqlContext,
             resolver,
@@ -5769,7 +5847,8 @@ Consider naming this operation or using "graphql.operation" request handler to i
     log(request, response, handler, parsedRequest) {
         const loggedRequest = prepareRequest(request);
         const loggedResponse = prepareResponse(response);
-        console.groupCollapsed(devUtils.formatMessage('%s %s (%c%s%c)'), getTimestamp(), `${parsedRequest === null || parsedRequest === void 0 ? void 0 : parsedRequest.operationType} ${parsedRequest === null || parsedRequest === void 0 ? void 0 : parsedRequest.operationName}`, `color:${getStatusCodeColor(response.status)} %s`, response.status, response.statusText, 'color:inherit');
+        const statusColor = getStatusCodeColor(response.status);
+        console.groupCollapsed(devUtils.formatMessage('%s %s (%c%s%c)'), getTimestamp(), `${parsedRequest === null || parsedRequest === void 0 ? void 0 : parsedRequest.operationType} ${parsedRequest === null || parsedRequest === void 0 ? void 0 : parsedRequest.operationName}`, `color:${statusColor}`, `${response.status} ${response.statusText}`, 'color:inherit');
         console.log('Request:', loggedRequest);
         console.log('Handler:', this);
         console.log('Response:', loggedResponse);
@@ -5883,8 +5962,10 @@ Read more: https://mswjs.io/docs/getting-started/mocks\
     const message = messageTemplate.join('\n\n');
     switch (strategy) {
         case 'error': {
+            // Print a developer-friendly error.
             devUtils.error('Error: %s', message);
-            break;
+            // Throw an exception to halt request processing and not perform the original request.
+            throw new Error('Cannot bypass a request when using the "error" strategy for the "onUnhandledRequest" option.');
         }
         case 'warn': {
             devUtils.warn('Warning: %s', message);
@@ -5951,6 +6032,23 @@ function handleRequest(request, handlers, options, emitter, handleRequestOptions
     });
 }
 
+/**
+ * Pipes all emitted events from one emitter to another.
+ */
+function pipeEvents(source, destination) {
+    const rawEmit = source.emit;
+    // @ts-ignore
+    if (rawEmit._isPiped) {
+        return;
+    }
+    source.emit = function (event, ...data) {
+        destination.emit(event, ...data);
+        return rawEmit.call(this, event, ...data);
+    };
+    // @ts-ignore
+    source.emit._isPiped = true;
+}
+
 const DEFAULT_LISTEN_OPTIONS = {
     onUnhandledRequest: 'warn',
 };
@@ -5960,6 +6058,8 @@ const DEFAULT_LISTEN_OPTIONS = {
  */
 function createSetupServer(...interceptors$1) {
     const emitter = new lib$3.StrictEventEmitter();
+    const publicEmitter = new lib$3.StrictEventEmitter();
+    pipeEvents(emitter, publicEmitter);
     return function setupServer(...requestHandlers) {
         requestHandlers.forEach((handler) => {
             if (Array.isArray(handler))
@@ -6029,11 +6129,20 @@ ${chalk.bold(`${pragma} ${header}`)}
 `);
                 });
             },
-            on(eventType, listener) {
-                emitter.addListener(eventType, listener);
+            events: {
+                on(...args) {
+                    return publicEmitter.on(...args);
+                },
+                removeListener(...args) {
+                    return publicEmitter.removeListener(...args);
+                },
+                removeAllListeners(...args) {
+                    return publicEmitter.removeAllListeners(...args);
+                },
             },
             close() {
                 emitter.removeAllListeners();
+                publicEmitter.removeAllListeners();
                 interceptor.restore();
             },
         };

package/node/lib/index.js

@@ -3397,6 +3397,65 @@ var lib = {};
 
 var invariant$2 = {};
 
+var format$1 = {};
+
+Object.defineProperty(format$1, "__esModule", { value: true });
+format$1.format = void 0;
+var POSITIONALS_EXP = /(%?)(%([sdjo]))/g;
+function serializePositional(positional, flag) {
+    switch (flag) {
+        // Strings.
+        case 's':
+            return positional;
+        // Digits.
+        case 'd':
+        case 'i':
+            return Number(positional);
+        // JSON.
+        case 'j':
+            return JSON.stringify(positional);
+        // Objects.
+        case 'o': {
+            // Preserve stings to prevent extra quotes around them.
+            if (typeof positional === 'string') {
+                return positional;
+            }
+            var json = JSON.stringify(positional);
+            // If the positional isn't serializable, return it as-is.
+            if (json === '{}' || json === '[]' || /^\[object .+?\]$/.test(json)) {
+                return positional;
+            }
+            return json;
+        }
+    }
+}
+function format(message) {
+    var positionals = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        positionals[_i - 1] = arguments[_i];
+    }
+    if (positionals.length === 0) {
+        return message;
+    }
+    var positionalIndex = 0;
+    var formattedMessage = message.replace(POSITIONALS_EXP, function (match, isEscaped, _, flag) {
+        var positional = positionals[positionalIndex];
+        var value = serializePositional(positional, flag);
+        if (!isEscaped) {
+            positionalIndex++;
+            return value;
+        }
+        return match;
+    });
+    // Append unresolved positionals to string as-is.
+    if (positionalIndex < positionals.length) {
+        formattedMessage += " " + positionals.slice(positionalIndex).join(' ');
+    }
+    formattedMessage = formattedMessage.replace(/%{2,2}/g, '%');
+    return formattedMessage;
+}
+format$1.format = format;
+
 var __extends = (commonjsGlobal && commonjsGlobal.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -3418,21 +3477,9 @@ var __spreadArray = (commonjsGlobal && commonjsGlobal.__spreadArray) || function
     return to;
 };
 Object.defineProperty(invariant$2, "__esModule", { value: true });
-invariant$2.invariant = invariant$2.InvariantError = invariant$2.interpolate = void 0;
+invariant$2.invariant = invariant$2.InvariantError = void 0;
+var format_1 = format$1;
 var STACK_FRAMES_TO_IGNORE = 2;
-function interpolate(message) {
-    var positionals = [];
-    for (var _i = 1; _i < arguments.length; _i++) {
-        positionals[_i - 1] = arguments[_i];
-    }
-    var index = 0;
-    return message.replace(/%[s|d|o]/g, function (match) {
-        var _a;
-        var value = (_a = positionals[index++]) !== null && _a !== void 0 ? _a : match;
-        return typeof value === 'object' ? JSON.stringify(value) : value;
-    });
-}
-invariant$2.interpolate = interpolate;
 var InvariantError = /** @class */ (function (_super) {
     __extends(InvariantError, _super);
     function InvariantError(message) {
@@ -3442,7 +3489,7 @@ var InvariantError = /** @class */ (function (_super) {
         }
         var _this = _super.call(this, message) || this;
         _this.name = 'Invariant Violation';
-        _this.message = interpolate.apply(void 0, __spreadArray([message], positionals));
+        _this.message = format_1.format.apply(void 0, __spreadArray([message], positionals));
         if (_this.stack) {
             var prevStack = _this.stack;
             _this.stack = prevStack
@@ -3479,6 +3526,7 @@ var __exportStar = (commonjsGlobal && commonjsGlobal.__exportStar) || function(m
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(invariant$2, exports);
+__exportStar(format$1, exports);
 }(lib));
 
 const LIBRARY_PREFIX = '[MSW]';
@@ -3486,7 +3534,7 @@ const LIBRARY_PREFIX = '[MSW]';
  * Formats a given message by appending the library's prefix string.
  */
 function formatMessage(message, ...positionals) {
-    const interpolatedMessage = lib.interpolate(message, ...positionals);
+    const interpolatedMessage = lib.format(message, ...positionals);
     return `${LIBRARY_PREFIX} ${interpolatedMessage}`;
 }
 /**
@@ -6747,17 +6795,20 @@ const getPublicUrlFromRequest = (request) => {
         : new URL(request.url.pathname, `${request.url.protocol}//${request.url.host}`).href;
 };
 
-function parseQuery(query) {
+function parseDocumentNode(node) {
     var _a;
+    const operationDef = node.definitions.find((def) => {
+        return def.kind === 'OperationDefinition';
+    });
+    return {
+        operationType: operationDef === null || operationDef === void 0 ? void 0 : operationDef.operation,
+        operationName: (_a = operationDef === null || operationDef === void 0 ? void 0 : operationDef.name) === null || _a === void 0 ? void 0 : _a.value,
+    };
+}
+function parseQuery(query) {
     try {
         const ast = parse(query);
-        const operationDef = ast.definitions.find((def) => {
-            return def.kind === 'OperationDefinition';
-        });
-        return {
-            operationType: operationDef === null || operationDef === void 0 ? void 0 : operationDef.operation,
-            operationName: (_a = operationDef === null || operationDef === void 0 ? void 0 : operationDef.name) === null || _a === void 0 ? void 0 : _a.value,
-        };
+        return parseDocumentNode(ast);
     }
     catch (error) {
         return error;
@@ -6837,7 +6888,7 @@ function parseGraphQLRequest(request) {
     const parsedResult = parseQuery(query);
     if (parsedResult instanceof Error) {
         const requestPublicUrl = getPublicUrlFromRequest(request);
-        throw new Error(devUtils.formatMessage('Failed to intercept a GraphQL request to "%s %s": cannot parse query. See the error message from the parser below.\n\n%o', request.method, requestPublicUrl, parsedResult.message));
+        throw new Error(devUtils.formatMessage('Failed to intercept a GraphQL request to "%s %s": cannot parse query. See the error message from the parser below.\n\n%s', request.method, requestPublicUrl, parsedResult.message));
     }
     return {
         operationType: parsedResult.operationType,
@@ -7181,17 +7232,23 @@ const xml = (body) => {
     };
 };
 
+var StatusCodeColor;
+(function (StatusCodeColor) {
+    StatusCodeColor["Success"] = "#69AB32";
+    StatusCodeColor["Warning"] = "#F0BB4B";
+    StatusCodeColor["Danger"] = "#E95F5D";
+})(StatusCodeColor || (StatusCodeColor = {}));
 /**
  * Returns a HEX color for a given response status code number.
  */
 function getStatusCodeColor(status) {
     if (status < 300) {
-        return '#69AB32';
+        return StatusCodeColor.Success;
     }
     if (status < 400) {
-        return '#F0BB4B';
+        return StatusCodeColor.Warning;
     }
-    return '#E95F5D';
+    return StatusCodeColor.Danger;
 }
 
 /**
@@ -7297,7 +7354,10 @@ function getAbsoluteUrl(path, baseUrl) {
     // Resolve a relative request URL against a given custom "baseUrl"
     // or the current location (in the case of browser/browser-like environments).
     const origin = baseUrl || (typeof location !== 'undefined' && location.origin);
-    return origin ? new URL(path, origin).href : path;
+    return origin
+        ? // Encode and decode the path to preserve escaped characters.
+            decodeURI(new URL(encodeURI(path), origin).href)
+        : path;
 }
 
 /**
@@ -7577,7 +7637,8 @@ ${queryParams
         const publicUrl = getPublicUrlFromRequest(request);
         const loggedRequest = prepareRequest(request);
         const loggedResponse = prepareResponse(response);
-        console.groupCollapsed(devUtils.formatMessage('%s %s %s (%c%s%c)'), getTimestamp(), request.method, publicUrl, `color:${getStatusCodeColor(response.status)} %s`, response.status, response.statusText, 'color:inherit');
+        const statusColor = getStatusCodeColor(response.status);
+        console.groupCollapsed(devUtils.formatMessage('%s %s %s (%c%s%c)'), getTimestamp(), request.method, publicUrl, `color:${statusColor}`, `${response.status} ${response.statusText}`, 'color:inherit');
         console.log('Request', loggedRequest);
         console.log('Handler:', {
             mask: this.info.path,
@@ -7607,16 +7668,33 @@ const graphqlContext = {
     errors,
     cookie,
 };
+function isDocumentNode(value) {
+    if (value == null) {
+        return false;
+    }
+    return typeof value === 'object' && 'kind' in value && 'definitions' in value;
+}
 class GraphQLHandler extends RequestHandler {
     constructor(operationType, operationName, endpoint, resolver) {
+        let resolvedOperationName = operationName;
+        if (isDocumentNode(operationName)) {
+            const parsedNode = parseDocumentNode(operationName);
+            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 header = operationType === 'all'
             ? `${operationType} (origin: ${endpoint.toString()})`
-            : `${operationType} ${operationName} (origin: ${endpoint.toString()})`;
+            : `${operationType} ${resolvedOperationName} (origin: ${endpoint.toString()})`;
         super({
             info: {
                 header,
                 operationType,
-                operationName,
+                operationName: resolvedOperationName,
             },
             ctx: graphqlContext,
             resolver,
@@ -7655,7 +7733,8 @@ Consider naming this operation or using "graphql.operation" request handler to i
     log(request, response, handler, parsedRequest) {
         const loggedRequest = prepareRequest(request);
         const loggedResponse = prepareResponse(response);
-        console.groupCollapsed(devUtils.formatMessage('%s %s (%c%s%c)'), getTimestamp(), `${parsedRequest === null || parsedRequest === void 0 ? void 0 : parsedRequest.operationType} ${parsedRequest === null || parsedRequest === void 0 ? void 0 : parsedRequest.operationName}`, `color:${getStatusCodeColor(response.status)} %s`, response.status, response.statusText, 'color:inherit');
+        const statusColor = getStatusCodeColor(response.status);
+        console.groupCollapsed(devUtils.formatMessage('%s %s (%c%s%c)'), getTimestamp(), `${parsedRequest === null || parsedRequest === void 0 ? void 0 : parsedRequest.operationType} ${parsedRequest === null || parsedRequest === void 0 ? void 0 : parsedRequest.operationName}`, `color:${statusColor}`, `${response.status} ${response.statusText}`, 'color:inherit');
         console.log('Request:', loggedRequest);
         console.log('Handler:', this);
         console.log('Response:', loggedResponse);
@@ -7769,8 +7848,10 @@ Read more: https://mswjs.io/docs/getting-started/mocks\
     const message = messageTemplate.join('\n\n');
     switch (strategy) {
         case 'error': {
+            // Print a developer-friendly error.
             devUtils.error('Error: %s', message);
-            break;
+            // Throw an exception to halt request processing and not perform the original request.
+            throw new Error('Cannot bypass a request when using the "error" strategy for the "onUnhandledRequest" option.');
         }
         case 'warn': {
             devUtils.warn('Warning: %s', message);
@@ -7837,6 +7918,23 @@ function handleRequest(request, handlers, options, emitter, handleRequestOptions
     });
 }
 
+/**
+ * Pipes all emitted events from one emitter to another.
+ */
+function pipeEvents(source, destination) {
+    const rawEmit = source.emit;
+    // @ts-ignore
+    if (rawEmit._isPiped) {
+        return;
+    }
+    source.emit = function (event, ...data) {
+        destination.emit(event, ...data);
+        return rawEmit.call(this, event, ...data);
+    };
+    // @ts-ignore
+    source.emit._isPiped = true;
+}
+
 const DEFAULT_LISTEN_OPTIONS = {
     onUnhandledRequest: 'warn',
 };
@@ -7846,6 +7944,8 @@ const DEFAULT_LISTEN_OPTIONS = {
  */
 function createSetupServer(...interceptors$1) {
     const emitter = new lib$3.StrictEventEmitter();
+    const publicEmitter = new lib$3.StrictEventEmitter();
+    pipeEvents(emitter, publicEmitter);
     return function setupServer(...requestHandlers) {
         requestHandlers.forEach((handler) => {
             if (Array.isArray(handler))
@@ -7915,11 +8015,20 @@ ${source.bold(`${pragma} ${header}`)}
 `);
                 });
             },
-            on(eventType, listener) {
-                emitter.addListener(eventType, listener);
+            events: {
+                on(...args) {
+                    return publicEmitter.on(...args);
+                },
+                removeListener(...args) {
+                    return publicEmitter.removeListener(...args);
+                },
+                removeAllListeners(...args) {
+                    return publicEmitter.removeAllListeners(...args);
+                },
             },
             close() {
                 emitter.removeAllListeners();
+                publicEmitter.removeAllListeners();
                 interceptor.restore();
             },
         };