FAQ

How is it different than library XYZ?

Please see the Comparison page for detailed technical and conceptual comparison between Mock Service Worker and other popular API mocking libraries.

In a nutshell, most solutions provide requests interception on the application level, while Mock Service Worker intercepts requests on the network level. It also allows you to use the same mock definition not only for testing, but for development and debugging as well, integrating across different tools without configurations, adapters, or plugins.

Does it support request library XYZ?

Yes. Mock Service Worker supports all request libraries, both existing and those about to be released in the future. This is one of the benefits you get by mocking your API at the network level.

Can I use it in Node.js?

Yes. Although there’s no Service Worker in Node.js, MSW provides you with a designated API to reuse the same request handlers in Node.js. Follow the integration below to learn how to use MSW in Node.js:

Can I use it in React Native?

Yes, you can use MSW while developing and testing your React Native application. The setup would be similar to that in Node.js, and you can learn more about it following this guide:

ReferenceError: fetch is not defined in Node.js

This error means that the version of Node.js you’re using doesn’t support the global Fetch API.

Resolve this by upgrading to Node.js version 18 or higher. MSW does not support Node.js versions below version 18.

ReferenceError: Request is not defined in Jest

This error means that the global Request class is not available in your current environment.

First, make sure you’re running Node.js version 18 or higher:

node -v
# v18.14.0

Once you do, you have to explicitly tell Jest to allow Fetch API globals in your test run:

// jest.config.js
module.exports = {
  globals: {
    Request,
    Response,
    Headers,
    Blob,
    FormData,
  },
}

You don’t have to import any of those globals—they ship with Node.js.

Why should I drop query parameters from the request handler URL?

Query parameters do not describe RESTful resources. Instead, they provide additional data to the server. Query parameters will be automatically stripped by MSW during the request matching and will have no effect.

It’s easier to understand this by thinking of request handlers as server-side route handlers: you do not include query parameters when routing on the server, so neither should you when routing with MSW.

Note that you can access query parameters in the request handler by using the URL API:

// Describe the resource path: "/post".
http.get('/post', ({ request }) => {
  // Convert the request URL string to a URL instance
  // so the browser would parse query parameters for you.
  const url = new URL(request.url)
 
  // Access the query parameters from the URL instance.
  // For example: GET /post/id=abc-123 → id: "abc-123"
  const id = url.searchParams.get('id')
 
  return HttpResponse.json({
    id,
    title: 'The Empowering Limitation',
  })
})

Why do I get stale responses with react-query/SWR/Apollo/etc.?

Caching mechanism of some request clients may produce stale responses in your tests. Make sure you clear the cache before/after each test suite for your tests to remain predictable.

react-query

import { QueryCache } from 'react-query'
 
const queryCache = new QueryCache()
 
afterEach(() => {
  queryCache.clear()
})

SWR

import { cache } from 'swr'
 
beforeEach(() => {
  cache.clear()
})

Apollo Client

import { client } from './apolloClient'
 
beforeEach(() => {
  return client.cache.reset()
})

Light theme when?

Whenever you have time to open a pull request.