Getting started

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 --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.

Intercepting requests

Learn about request interception and how to capture REST and GraphQL requests.

Mocking responses

Learn about response resolvers and the different ways to respond to a request.

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.

Describing REST API

Learn about describing RESTful APIs.

Describing GraphQL API

Learn about describing GraphQL APIs.

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:

Browser

Integrate MSW in a browser environment, such as a React application or Storybook.

Node.js

Integrate MSW in Node.js, such as an Express application or a test runner.

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.

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.