MSW
Mock Service Worker in the editor. It reads the http, rest, and graphql handlers you already write, and the fetch, axios, ky, and ofetch calls next to them.
What you can do
- See every handler in the MSW sidebar. Click one to open it.
- On a request that has a mock, the CodeLens says which handler file and line it hits. Click it.
- Hover a URL for the same match.
- MSW: Show Unhandled Requests lists relative API calls that nothing mocks. It skips images, fonts, and absolute third-party URLs.
- MSW: Add Handler inserts
http.get / http.post / … into your handlers array, and adds the msw import if it is missing. A project still on rest / ctx gets a v1 handler instead.
- A warning appears when a second handler repeats the same method and path. MSW runs the first one.
- Snippets:
mswget, mswpost, mswhandlers.
The extension stays quiet until a package.json in the workspace depends on msw. It does not phone home, and it does not send source anywhere.
How matching works
A handler path like /users/:id matches /users/123 and /users/${id}. * matches the rest of a path, and *.png matches one segment. http.get('/billing') also matches a handler written as https://api.example.com/billing.
String literals and const strings in the same file are followed. A URL built in another file, or a path passed through a variable the extension cannot see, is skipped rather than guessed.
GraphQL handlers are listed. They are not matched against fetch('/graphql'), because that depends on the request body.
Settings
| Setting |
Default |
|
msw.requestCodeLens |
matched |
all also marks calls with no handler. off hides them. |
msw.handlerCodeLens |
true |
Shows how many requests hit each handler. |
msw.diagnostics.duplicates |
true |
Warns on a repeated method and path. |
msw.diagnostics.unhandled |
off |
Set to warning if you want those calls underlined. The command lists them either way. |
Commands
Open the Command Palette and type MSW.
- MSW: Refresh — rescan. Use this after you add
msw to package.json.
- MSW: Show Unhandled Requests
- MSW: Add Handler
- MSW: Focus Handlers
