msw 0.20.5 → 0.21.3

package/CHANGELOG.md

@@ -0,0 +1,4 @@
+# Change Log
+
+This project adheres to [Semantic Versioning](https://semver.org/).
+Every release, along with the migration instructions, is documented on the Github [Releases](https://github.com/mswjs/msw/releases) page.

package/README.md

@@ -61,7 +61,7 @@ Browser usage is what sets Mock Service Worker apart from other tools. Utilizing
 ### How is it different?
 
 - Intercepts requests on the network level, not the application level.
-- If your think of your application as a box, Mock Service Worker lives in its own box next to yours, instead of opening and altering it for the purpose of mocking.
+- If you think of your application as a box, Mock Service Worker lives in its own box next to yours, instead of opening and altering it for the purpose of mocking.
 - Agnostic of request-issuing libraries, so you can use it with `fetch`, `axios`, `react-query`, you-name-it.
 - The same mock definition can be reused for unit, integration, E2E testing, and debugging.
 

package/lib/esm/fetch-deps.js

@@ -82,11 +82,11 @@ var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof win
 
 function createCommonjsModule(fn, basedir, module) {
 	return module = {
-	  path: basedir,
-	  exports: {},
-	  require: function (path, base) {
-      return commonjsRequire(path, (base === undefined || base === null) ? module.path : base);
-    }
+		path: basedir,
+		exports: {},
+		require: function (path, base) {
+			return commonjsRequire(path, (base === undefined || base === null) ? module.path : base);
+		}
 	}, fn(module, module.exports), module.exports;
 }
 
@@ -350,16 +350,16 @@ function set(...args) {
 
 /**
  * Returns a boolean indicating if the current process is running in NodeJS environment.
+ * @see https://github.com/mswjs/msw/pull/255
  */
-// Please see https://github.com/mswjs/msw/pull/255
 function isNodeProcess() {
+    // Check browser environment.
     if (typeof global !== 'object') {
-        // check browser environment
         return false;
     }
+    // Check nodejs or React Native environment.
     if (Object.prototype.toString.call(global.process) === '[object process]' ||
         navigator.product === 'ReactNative') {
-        // check nodejs or react native environment
         return true;
     }
 }
@@ -388,9 +388,11 @@ const delay = (durationMs) => {
 };
 
 /**
- * Sets the given Object as the JSON body of the response.
+ * Sets the given value as the JSON body of the response.
  * @example
- * res(json({ foo: 'bar' }))
+ * res(json({ key: 'value' }))
+ * res(json('Some string'))
+ * res(json([1, '2', false, { ok: true }]))
  */
 const json = (body) => {
     return (res) => {
@@ -401,20 +403,21 @@ const json = (body) => {
 };
 
 const useFetch = isNodeProcess() ? require('node-fetch') : window.fetch;
-const gracefully = (promise) => {
-    return promise.then((res) => {
-        var _a;
-        if ((_a = res.headers.get('content-type')) === null || _a === void 0 ? void 0 : _a.includes('json')) {
-            return res.json();
-        }
-        return res.text();
-    });
-};
 const augmentRequestInit = (requestInit) => {
     const headers = new lib.Headers(requestInit.headers);
     headers.set('x-msw-bypass', 'true');
     return Object.assign(Object.assign({}, requestInit), { headers: headers.getAllHeaders() });
 };
+const createFetchRequestParameters = (input) => {
+    const { body, method } = input;
+    const requestParameters = Object.assign(Object.assign({}, input), { body: undefined });
+    if (['GET', 'HEAD'].includes(method)) {
+        return requestParameters;
+    }
+    requestParameters.body =
+        typeof body === 'object' ? JSON.stringify(body) : body;
+    return requestParameters;
+};
 /**
  * Wrapper around the native `window.fetch()` function that performs
  * a request bypassing MSW. Requests performed using
@@ -423,11 +426,11 @@ const augmentRequestInit = (requestInit) => {
 const fetch = (input, requestInit = {}) => {
     // Keep the default `window.fetch()` call signature
     if (typeof input === 'string') {
-        return gracefully(useFetch(input, augmentRequestInit(requestInit)));
+        return useFetch(input, augmentRequestInit(requestInit));
     }
-    const { body } = input;
-    const compliantReq = augmentRequestInit(Object.assign(Object.assign({}, input), { body: typeof body === 'object' ? JSON.stringify(body) : body }));
-    return gracefully(useFetch(input.url.href, compliantReq));
+    const requestParameters = createFetchRequestParameters(input);
+    const compliantRequest = augmentRequestInit(requestParameters);
+    return useFetch(input.url.href, compliantRequest);
 };
 
 export { set as a, commonjsGlobal as b, createCommonjsModule as c, delay as d, fetch as f, isNodeProcess as i, json as j, lib as l, status as s };

package/lib/esm/graphql.js

@@ -1,6 +1,6 @@
 import { a as set, s as status, d as delay, f as fetch } from './fetch-deps.js';
 import { d as data, e as errors } from './errors-deps.js';
-import { j as jsonParse, m as matchRequestUrl, p as prepareRequest, a as prepareResponse, b as getTimestamp, c as getStatusCodeColor } from './matchRequest-deps.js';
+import { j as jsonParse, m as matchRequestUrl, a as prepareRequest, b as prepareResponse, c as getTimestamp, d as getStatusCodeColor } from './matchRequestUrl-deps.js';
 
 // istanbul ignore next (See: 'https://github.com/graphql/graphql-js/issues/2317')
 var nodejsCustomInspectSymbol = typeof Symbol === 'function' && typeof Symbol.for === 'function' ? Symbol.for('nodejs.util.inspect.custom') : undefined;
@@ -3009,98 +3009,111 @@ const graphqlContext = {
 function parseQuery(query, definitionOperation = 'query') {
     var _a;
     const ast = parse(query);
-    const operationDef = ast.definitions.find((def) => def.kind === 'OperationDefinition' &&
-        def.operation === definitionOperation);
+    const operationDef = ast.definitions.find((def) => {
+        return (def.kind === 'OperationDefinition' &&
+            (definitionOperation === 'all' || def.operation === definitionOperation));
+    });
     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,
     };
 }
-const createGraphQLHandler = (operationType, mask) => {
-    return (expectedOperation, resolver) => {
-        return {
-            resolver,
-            parse(req) {
-                var _a;
-                // According to the GraphQL specification, a GraphQL request can be issued
-                // using both "GET" and "POST" methods.
-                switch (req.method) {
-                    case 'GET': {
-                        const query = req.url.searchParams.get('query');
-                        const variablesString = req.url.searchParams.get('variables') || '';
-                        if (!query) {
-                            return null;
-                        }
-                        const variables = variablesString
-                            ? jsonParse(variablesString)
-                            : {};
-                        const { operationName } = parseQuery(query, operationType);
-                        return {
-                            operationType,
-                            operationName,
-                            variables,
-                        };
-                    }
-                    case 'POST': {
-                        if (!((_a = req.body) === null || _a === void 0 ? void 0 : _a.query)) {
-                            return null;
-                        }
-                        const { query, variables } = req.body;
-                        const { operationName } = parseQuery(query, operationType);
-                        return {
-                            operationType,
-                            operationName,
-                            variables,
-                        };
-                    }
-                    default:
+function graphQLRequestHandler(expectedOperationType, expectedOperationName, mask, resolver) {
+    return {
+        resolver,
+        parse(req) {
+            var _a;
+            // According to the GraphQL specification, a GraphQL request can be issued
+            // using both "GET" and "POST" methods.
+            switch (req.method) {
+                case 'GET': {
+                    const query = req.url.searchParams.get('query');
+                    const variablesString = req.url.searchParams.get('variables') || '';
+                    if (!query) {
                         return null;
+                    }
+                    const variables = variablesString
+                        ? jsonParse(variablesString)
+                        : {};
+                    const { operationType, operationName } = parseQuery(query, expectedOperationType);
+                    return {
+                        operationType,
+                        operationName,
+                        variables,
+                    };
                 }
-            },
-            getPublicRequest(req, parsed) {
-                return Object.assign(Object.assign({}, req), { variables: parsed.variables || {} });
-            },
-            predicate(req, parsed) {
-                if (!parsed || !parsed.operationName) {
-                    return false;
+                case 'POST': {
+                    if (!((_a = req.body) === null || _a === void 0 ? void 0 : _a.query)) {
+                        return null;
+                    }
+                    const { query, variables } = req.body;
+                    const { operationType, operationName } = parseQuery(query, expectedOperationType);
+                    return {
+                        operationType,
+                        operationName,
+                        variables,
+                    };
                 }
-                // Match the request URL against a given mask,
-                // in case of an endpoint-specific request handler.
-                const hasMatchingMask = matchRequestUrl(req.url, mask);
-                const isMatchingOperation = expectedOperation instanceof RegExp
-                    ? expectedOperation.test(parsed.operationName)
-                    : expectedOperation === parsed.operationName;
-                return isMatchingOperation && hasMatchingMask.matches;
-            },
-            defineContext() {
-                return graphqlContext;
-            },
-            log(req, res, handler, parsed) {
-                const { operationName } = parsed;
-                const loggedRequest = prepareRequest(req);
-                const loggedResponse = prepareResponse(res);
-                console.groupCollapsed('[MSW] %s %s (%c%s%c)', getTimestamp(), operationName, `color:${getStatusCodeColor(res.status)}`, res.status, 'color:inherit');
-                console.log('Request:', loggedRequest);
-                console.log('Handler:', {
-                    operationType,
-                    operationName: expectedOperation,
-                    predicate: handler.predicate,
-                });
-                console.log('Response:', loggedResponse);
-                console.groupEnd();
-            },
-        };
+                default:
+                    return null;
+            }
+        },
+        getPublicRequest(req, parsed) {
+            return Object.assign(Object.assign({}, req), { variables: parsed.variables || {} });
+        },
+        predicate(req, parsed) {
+            if (!parsed || !parsed.operationName) {
+                return false;
+            }
+            // Match the request URL against a given mask,
+            // in case of an endpoint-specific request handler.
+            const hasMatchingMask = matchRequestUrl(req.url, mask);
+            const isMatchingOperation = expectedOperationName instanceof RegExp
+                ? expectedOperationName.test(parsed.operationName)
+                : expectedOperationName === parsed.operationName;
+            return hasMatchingMask.matches && isMatchingOperation;
+        },
+        defineContext() {
+            return graphqlContext;
+        },
+        log(req, res, handler, parsed) {
+            const { operationType, operationName } = parsed;
+            const loggedRequest = prepareRequest(req);
+            const loggedResponse = prepareResponse(res);
+            console.groupCollapsed('[MSW] %s %s (%c%s%c)', getTimestamp(), operationName, `color:${getStatusCodeColor(res.status)}`, res.status, 'color:inherit');
+            console.log('Request:', loggedRequest);
+            console.log('Handler:', {
+                operationType,
+                operationName: expectedOperationName,
+                predicate: handler.predicate,
+            });
+            console.log('Response:', loggedResponse);
+            console.groupEnd();
+        },
+    };
+}
+const createGraphQLScopedHandler = (expectedOperationType, mask) => {
+    return (expectedOperationName, resolver) => {
+        return graphQLRequestHandler(expectedOperationType, expectedOperationName, mask, resolver);
+    };
+};
+const createGraphQLOperationHandler = (mask) => {
+    return (resolver) => {
+        return graphQLRequestHandler('all', new RegExp('.*'), mask, resolver);
     };
 };
 const graphqlStandardHandlers = {
-    query: createGraphQLHandler('query', '*'),
-    mutation: createGraphQLHandler('mutation', '*'),
+    operation: createGraphQLOperationHandler('*'),
+    query: createGraphQLScopedHandler('query', '*'),
+    mutation: createGraphQLScopedHandler('mutation', '*'),
 };
 function createGraphQLLink(uri) {
     return {
-        query: createGraphQLHandler('query', uri),
-        mutation: createGraphQLHandler('mutation', uri),
+        operation: createGraphQLOperationHandler(uri),
+        query: createGraphQLScopedHandler('query', uri),
+        mutation: createGraphQLScopedHandler('mutation', uri),
     };
 }
 const graphql = Object.assign(Object.assign({}, graphqlStandardHandlers), { link: createGraphQLLink });
 
-export { graphql, graphqlContext, parseQuery };
+export { graphql, graphqlContext };

package/lib/esm/index.js

@@ -2,25 +2,25 @@ import { c as createCommonjsModule, s as status, a as set, d as delay, f as fetc
 import { p as parse_1 } from './xml-deps.js';
 import './errors-deps.js';
 export { i as context } from './index-deps.js';
-import { g as getJsonBody } from './matchRequest-deps.js';
-export { m as matchRequestUrl } from './matchRequest-deps.js';
-import { i as isStringEqual } from './rest-deps.js';
+import { g as getPublicUrlFromRequest, i as isStringEqual } from './rest-deps.js';
 export { R as RESTMethods, r as rest, a as restContext } from './rest-deps.js';
+import { p as parseBody } from './matchRequestUrl-deps.js';
+export { m as matchRequestUrl } from './matchRequestUrl-deps.js';
 export { graphql, graphqlContext } from './graphql.js';
 
 /*! *****************************************************************************
-Copyright (c) Microsoft Corporation. All rights reserved.
-Licensed under the Apache License, Version 2.0 (the "License"); you may not use
-this file except in compliance with the License. You may obtain a copy of the
-License at http://www.apache.org/licenses/LICENSE-2.0
+Copyright (c) Microsoft Corporation.
 
-THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
-WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
-MERCHANTABLITY OR NON-INFRINGEMENT.
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
 
-See the Apache Version 2.0 License for specific language governing permissions
-and limitations under the License.
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
 ***************************************************************************** */
 
 function __awaiter(thisArg, _arguments, P, generator) {
@@ -63,7 +63,7 @@ exports.until = until.until;
  * Attempts to resolve a Service Worker instance from a given registration,
  * regardless of its state (active, installing, waiting).
  */
-const getWorkerByRegistration = (registration, absoluteWorkerUrl) => {
+const getWorkerByRegistration = (registration, absoluteWorkerUrl, findWorker) => {
     const allStates = [
         registration.active,
         registration.installing,
@@ -71,7 +71,7 @@ const getWorkerByRegistration = (registration, absoluteWorkerUrl) => {
     ];
     const existingStates = allStates.filter(Boolean);
     const mockWorker = existingStates.find((worker) => {
-        return worker.scriptURL === absoluteWorkerUrl;
+        return findWorker(worker.scriptURL, absoluteWorkerUrl);
     });
     return mockWorker || null;
 };
@@ -88,13 +88,13 @@ function getAbsoluteWorkerUrl(relativeUrl) {
  * Returns an active Service Worker instance.
  * When not found, registers a new Service Worker.
  */
-const getWorkerInstance = (url, options) => __awaiter(void 0, void 0, void 0, function* () {
-    // Resolve the absolute Service Worker URL
+const getWorkerInstance = (url, options = {}, findWorker) => __awaiter(void 0, void 0, void 0, function* () {
+    // Resolve the absolute Service Worker URL.
     const absoluteWorkerUrl = getAbsoluteWorkerUrl(url);
     const [, mockRegistrations] = yield lib.until(() => __awaiter(void 0, void 0, void 0, function* () {
         const registrations = yield navigator.serviceWorker.getRegistrations();
         return registrations.filter((registration) => {
-            return getWorkerByRegistration(registration, absoluteWorkerUrl);
+            return getWorkerByRegistration(registration, absoluteWorkerUrl, findWorker);
         });
     }));
     if (!navigator.serviceWorker.controller && mockRegistrations.length > 0) {
@@ -108,23 +108,25 @@ const getWorkerInstance = (url, options) => __awaiter(void 0, void 0, void 0, fu
     }
     const [existingRegistration] = mockRegistrations;
     if (existingRegistration) {
-        // Update existing service worker to ensure it's up-to-date
+        // When the Service Worker is registered, update it and return the reference.
         return existingRegistration.update().then(() => {
             return [
-                getWorkerByRegistration(existingRegistration, absoluteWorkerUrl),
+                getWorkerByRegistration(existingRegistration, absoluteWorkerUrl, findWorker),
                 existingRegistration,
             ];
         });
     }
+    // When the Service Worker wasn't found, register it anew and return the reference.
     const [error, instance] = yield lib.until(() => __awaiter(void 0, void 0, void 0, function* () {
         const registration = yield navigator.serviceWorker.register(url, options);
         return [
             // Compare existing worker registration by its worker URL,
             // to prevent irrelevant workers to resolve here (such as Codesandbox worker).
-            getWorkerByRegistration(registration, absoluteWorkerUrl),
+            getWorkerByRegistration(registration, absoluteWorkerUrl, findWorker),
             registration,
         ];
     }));
+    // Handle Service Worker registration errors.
     if (error) {
         const isWorkerMissing = error.message.includes('(404)');
         // Produce a custom error message when given a non-existing Service Worker url.
@@ -307,7 +309,14 @@ function onUnhandledRequest(request, onUnhandledRequest = 'bypass') {
         onUnhandledRequest(request);
         return;
     }
-    const message = `captured a ${request.method} ${request.url} request without a corresponding request handler.`;
+    const publicUrl = getPublicUrlFromRequest(request);
+    const message = `captured a ${request.method} ${request.url} request without a corresponding request handler.
+
+  If you wish to intercept this request, consider creating a request handler for it:
+
+  rest.${request.method.toLowerCase()}('${publicUrl}', (req, res, ctx) => {
+    return res(ctx.text('body'))
+  })`;
     switch (onUnhandledRequest) {
         case 'error': {
             throw new Error(`[MSW] Error: ${message}`);
@@ -320,21 +329,6 @@ function onUnhandledRequest(request, onUnhandledRequest = 'bypass') {
     }
 }
 
-function parseRequestBody(body, headers) {
-    var _a;
-    if (body) {
-        // If the intercepted request's body has a JSON Content-Type
-        // parse it into an object, otherwise leave as-is.
-        const hasJsonContent = (_a = headers === null || headers === void 0 ? void 0 : headers.get('content-type')) === null || _a === void 0 ? void 0 : _a.includes('json');
-        if (hasJsonContent && typeof body !== 'object') {
-            return getJsonBody(body);
-        }
-        return body;
-    }
-    // Return whatever falsey body value is given.
-    return body;
-}
-
 function getAllCookies() {
     return parse_1(document.cookie);
 }
@@ -389,7 +383,7 @@ const handleRequestWith = (context, options) => {
                 return null;
             }
             // Parse the request's body based on the "Content-Type" header.
-            req.body = parseRequestBody(req.body, req.headers);
+            req.body = parseBody(req.body, req.headers);
             // Set document cookies on the request.
             req.cookies = getRequestCookies(req);
             const { response, handler, publicRequest, parsedRequest, } = yield getResponse(req, context.requestHandlers);
@@ -452,8 +446,8 @@ function requestIntegrityCheck(context, serviceWorker) {
         const { payload: actualChecksum } = yield context.events.once('INTEGRITY_CHECK_RESPONSE');
         // Compare the response from the Service Worker and the
         // global variable set by webpack upon build.
-        if (actualChecksum !== "ca2c3cd7453d8c614e2c19db63ede1a1") {
-            throw new Error(`Currently active Service Worker (${actualChecksum}) is behind the latest published one (${"ca2c3cd7453d8c614e2c19db63ede1a1"}).`);
+        if (actualChecksum !== "d1e0e502f550d40a34bee90822e4bf98") {
+            throw new Error(`Currently active Service Worker (${actualChecksum}) is behind the latest published one (${"d1e0e502f550d40a34bee90822e4bf98"}).`);
         }
         return serviceWorker;
     });
@@ -465,15 +459,17 @@ function requestIntegrityCheck(context, serviceWorker) {
  * Must only be used in a browser.
  */
 function deferNetworkRequestsUntil(predicatePromise) {
-    // Defer `XMLHttpRequest` until the Service Worker is ready.
+    // Defer any `XMLHttpRequest` requests until the Service Worker is ready.
     const originalXhrSend = window.XMLHttpRequest.prototype.send;
     window.XMLHttpRequest.prototype.send = function (...args) {
+        // Keep this function synchronous to comply with `XMLHttpRequest.prototype.send`,
+        // because that method is always synchronous.
         lib.until(() => predicatePromise).then(() => {
             window.XMLHttpRequest.prototype.send = originalXhrSend;
             this.send(...args);
         });
     };
-    // Defer `fetch` requests until the Service Worker is ready.
+    // Defer any `fetch` requests until the Service Worker is ready.
     const originalFetch = window.fetch;
     window.fetch = (...args) => __awaiter(this, void 0, void 0, function* () {
         yield lib.until(() => predicatePromise);
@@ -482,6 +478,30 @@ function deferNetworkRequestsUntil(predicatePromise) {
     });
 }
 
+function isObject(obj) {
+    return typeof obj === 'object';
+}
+/**
+ * Deeply merges two given objects with the right one
+ * having a priority during property assignment.
+ */
+function mergeRight(a, b) {
+    const result = Object.assign({}, a);
+    Object.entries(b).forEach(([key, value]) => {
+        const existingValue = result[key];
+        if (Array.isArray(existingValue) && Array.isArray(value)) {
+            result[key] = existingValue.concat(value);
+            return;
+        }
+        if (isObject(existingValue) && isObject(value)) {
+            result[key] = mergeRight(existingValue, value);
+            return;
+        }
+        result[key] = value;
+    });
+    return result;
+}
+
 const DEFAULT_START_OPTIONS = {
     serviceWorker: {
         url: '/mockServiceWorker.js',
@@ -490,13 +510,14 @@ const DEFAULT_START_OPTIONS = {
     quiet: false,
     waitUntilReady: true,
     onUnhandledRequest: 'bypass',
+    findWorker: (scriptURL, mockServiceWorkerUrl) => scriptURL === mockServiceWorkerUrl,
 };
 const createStart = (context) => {
     /**
      * Registers and activates the mock Service Worker.
      */
     return function start(options) {
-        const resolvedOptions = Object.assign({}, DEFAULT_START_OPTIONS, options);
+        const resolvedOptions = mergeRight(DEFAULT_START_OPTIONS, options || {});
         const startWorkerInstance = () => __awaiter(this, void 0, void 0, function* () {
             if (!('serviceWorker' in navigator)) {
                 console.error(`[MSW] Failed to register a Service Worker: this browser does not support Service Workers (see https://caniuse.com/serviceworkers), or your application is running on an insecure host (consider using HTTPS for custom hostnames).`);
@@ -507,12 +528,28 @@ const createStart = (context) => {
             // of the application's code.
             context.events.removeAllListeners();
             context.events.addListener(navigator.serviceWorker, 'message', handleRequestWith(context, resolvedOptions));
-            const [, instance] = yield lib.until(() => getWorkerInstance(resolvedOptions.serviceWorker.url, resolvedOptions.serviceWorker.options));
+            const [, instance] = yield lib.until(() => getWorkerInstance(resolvedOptions.serviceWorker.url, resolvedOptions.serviceWorker.options, resolvedOptions.findWorker));
             if (!instance) {
                 return null;
             }
             const [worker, registration] = instance;
             if (!worker) {
+                if (options === null || options === void 0 ? void 0 : options.findWorker) {
+                    console.error(`\
+[MSW] Failed to locate the Service Worker registration using a custom "findWorker" predicate.
+
+Please ensure that the custom predicate properly locates the Service Worker registration at "${resolvedOptions.serviceWorker.url}".
+More details: https://mswjs.io/docs/api/setup-worker/start#findworker
+`);
+                }
+                else {
+                    console.error(`\
+[MSW] Failed to locate the Service Worker registration.
+
+This most likely means that the worker script URL "${resolvedOptions.serviceWorker.url}" cannot resolve against the actual public hostname (${location.host}). This may happen if your application runs behind a proxy, or has a dynamic hostname.
+
+Please consider using a custom "serviceWorker.url" option to point to the actual worker script location, or a custom "findWorker" option to resolve the Service Worker registration manually. More details: https://mswjs.io/docs/api/setup-worker/start`);
+                }
                 return null;
             }
             context.worker = worker;
@@ -525,6 +562,9 @@ const createStart = (context) => {
                     // the Service Worker when there are no open clients.
                     worker.postMessage('CLIENT_CLOSED');
                 }
+                // Make sure we're always clearing the interval - there are reports that not doing this can
+                // cause memory leaks in headless browser environments.
+                window.clearInterval(context.keepAliveInterval);
             });
             // Check if the active Service Worker is the latest published one
             const [integrityError] = yield lib.until(() => requestIntegrityCheck(context, worker));
@@ -546,6 +586,7 @@ If this message still persists after updating, please report an issue: https://g
                 console.error('Failed to enable mocking', activationError);
                 return null;
             }
+            context.keepAliveInterval = window.setInterval(() => worker.postMessage('KEEPALIVE_REQUEST'), 5000);
             return registration;
         });
         const workerRegistration = startWorkerInstance();
@@ -569,6 +610,7 @@ const createStop = (context) => {
         var _a;
         (_a = context.worker) === null || _a === void 0 ? void 0 : _a.postMessage('MOCK_DEACTIVATE');
         context.events.removeAllListeners();
+        window.clearInterval(context.keepAliveInterval);
     };
 };
 
@@ -590,6 +632,10 @@ function resetHandlers(initialHandlers, ...nextHandlers) {
 // so it persists between Fash refreshes of the application's code.
 let listeners = [];
 function setupWorker(...requestHandlers) {
+    requestHandlers.forEach((handler) => {
+        if (Array.isArray(handler))
+            throw new Error(`[MSW] Failed to call "setupWorker" given an Array of request handlers (setupWorker([a, b])), expected to receive each handler individually: setupWorker(a, b).`);
+    });
     const context = {
         worker: null,
         registration: null,