Configure MSW v2 handlers to mock HTTP APIs in Vitest.
npx skills add https://github.com/recca0120/code-quest --skill msw-fetch-mock
Please help me install this Agent Skill. Skill: msw-fetch-mock Source: https://github.com/recca0120/code-quest/tree/main/.claude/skills/msw-fetch-mock Command: npx skills add https://github.com/recca0120/code-quest --skill msw-fetch-mock
This Skill solves flaky, slow, and hard-to-control frontend tests by letting you mock HTTP requests deterministically instead of relying on real network services.
http and return typed HttpResponse objects for JSON and other payload types.server.use(...) to customize handlers for a single test while server.resetHandlers() clears overrides automatically.HttpResponse.error()) to validate error UI and retry logic.Configure your MSW handlers and server for Vitest, then run your component or integration tests while the mocked endpoints respond with the data you specified.
High-intent search queries and answers about installing and using this skill.
Use MSW v2 `http` handlers to intercept fetch requests and return controlled `HttpResponse` objects for deterministic API mocking in Vitest. This prevents flaky and slow frontend tests caused by real network dependencies.
Yes, you can simulate network errors in Vitest by triggering realistic failure modes like `HttpResponse.error()` within your MSW handlers, allowing you to validate error UI states and retry logic deterministically.
Override API mock responses for a single Vitest test using `server.use(...)` to inject custom handlers. The `server.resetHandlers()` lifecycle call automatically clears these overrides for subsequent tests.
MSW v2 supports parsing request bodies via the standard Request API and handling path parameters. This allows your Vitest integration tests to return dynamic JSON payloads and cookie-based responses based on request inputs.
Managing an MSW server in Vitest requires calling `server.listen()` to start intercepting requests, `server.resetHandlers()` to clear per-test overrides, and `server.close()` to clean up after tests finish.
Using MSW for API mocking intercepts requests at the service worker level, providing controlled responses for JSON payloads and network failures without modifying your application's fetch implementation, resulting in more reliable Vitest component tests.
vecearAutomate MSW-based API and service mocks with fixtures and test overrides.
flutterWrite Flutter widget tests using the WidgetTester API to verify UI rendering and interactions.
leocostaTest React or Vue components in isolation with mocked network boundaries.
umbracoMock Umbraco backoffice extension API requests with MSW v2.