Getting started

Three steps to get started with Mock Service Worker.

Developers come to MSW for various reasons: to establish proper testing boundaries, to prototype applications, debug network-related issues, or monitor production traffic. This makes it all the more challenging to write a single tutorial that would suit all those needs at the same time. In the end, it is your choice how you utilize the capabilities of the library, and we believe it should be you who decides on the right path to follow in this tutorial.

Step 1: Install

Install MSW as a dependency by running the following command in your project:

npm install msw@latest --save-dev

If you need to, you can also install MSW from a CDN.

Step 2: Write network behavior

To describe the network behavior you need, you have to understand how to intercept requests and how to mock their responses.

Once you are comfortable with those concepts, learn more about the http and graphql namespaces you will be using to describe resources for REST and GraphQL APIs respectively.

MSW fully supports type-safe API mocking with TypeScript.

Step 3: Integrate anywhere

There are many frameworks, libraries, and tools out there but all of them run either in the browser or in Node.js (speaking about the JavaScript ecosystem). You will not find specific instructions on integrating MSW with those tools because there aren’t any. Instead, you will create environment-based integration points that work with any tool you used, are using now, or will use in the future.

Follow the integration guides for the environment(s) you need:

It’s possible and encouraged to have both integration points in your project to so could get a consistent control over the network across the entire stack.

Examples

In the repository below, you can find the functional, complete, and minimalistic examples of how to use Mock Service Worker with tools like Jest, Vitest, Cypress, Playwright, Angular, Svelte, Remix, and others. Use them as a reference whenever integrating MSW with those tools.

Usage examples

Examples of Mock Service Worker usage with various frameworks and libraries.

Turn each usage example into a reproduction repository if you encounter an issue!

Need help?

Starting with a new tool can be difficult but you don’t have go through that alone. Whenever you encounter an issue, the best place to go is our Debugging runbook:

Debugging runbook

Steps to debug common issues with the library.

We are always happy to help you with any questions you might have. There are multiple ways you can reach out to us or other community members to get help:

And remember, there is always a person who’s one problem behind you. Be kind and offer help when you can.