skills.rest
sathishssj3
sathishssj3COMMUNITY
Explore all skills by this author →
GitHub

api-mock-server

Creates mock API servers using MSW, json-server, and custom handlers for testing.

2|Updated Jun 5, 2026
Search Tags:#GraphQL#Playwright#test fixtures#MSW#API mocking#mock server#json-server
One-click install
npx skills add https://github.com/sathishssj3/NexVR-Engine --skill api-mock-server-sathishssj3
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: api-mock-server
Source: https://github.com/sathishssj3/NexVR-Engine/tree/main/.agents/skills/api-mock-server
Command: npx skills add https://github.com/sathishssj3/NexVR-Engine --skill api-mock-server-sathishssj3

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires msw, json-server, @faker-js/faker, @playwright/test, vitest.

What problem does it solve? Frontend and test development often stalls when backend APIs are unavailable, unstable, or slow. This Skill sets up realistic mock API servers so you can develop and test against predictable endpoints without depending on live services. ## Core Features & Use Cases - MSW Handler Setup: Defines request handlers for REST and GraphQL endpoints, with browser service worker and Node test server configurations. - Json-Server & Custom Routes: Spins up file-backed mock APIs with custom middleware, authentication simulation, and route rewriting. - Fixtures, Factories & Scenarios: Generates realistic test data with faker factories and reusable scenarios for empty, error, loading, and slow-network states, plus Playwright route interception for E2E tests. - Use Case: While building a user management dashboard, mock the /api/users endpoints with MSW, then test empty states, 500 errors, and network failures in Vitest without touching a real backend. ## Quick Start Set up an MSW mock server with handlers for my REST API endpoints and integrate it into my Vitest test suite.

Frequently Asked Questions about api-mock-server

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I mock API requests in tests with MSW?▼

MSW mocks API requests by defining handlers with http.get or http.post that return HttpResponse objects. Set up a Node server with setupServer, then start it in your test setup file using server.listen before tests and server.close after.

MSW vs json-server for API mocking?▼

MSW intercepts requests at the network level and works in both browser and Node test environments, making it ideal for unit and integration tests. Json-server runs a standalone file-backed REST API from a db.json file, better suited for quick development servers.

Does MSW support GraphQL mocking?▼

Yes, MSW supports GraphQL through graphql.query and graphql.mutation handlers that match operation names. You can return mocked data or error responses, including conditional logic based on query variables.

How do I test error and loading states with mock APIs?▼

Use server.use in individual tests to override default handlers with error responses like status 500 or HttpResponse.error for network failures. For loading states, add delay or delay('infinite') to keep requests pending.

Can I mock API calls in Playwright end-to-end tests?▼

Yes, Playwright mocks API calls using page.route to intercept URL patterns and route.fulfill to return custom status codes, headers, and JSON bodies. This works independently of MSW and supports delayed responses for testing loading UI.

Related Skills

Explore More Software Engineering Skills→
gridi-aigridi-ai
1

be-spec

Generate OpenAPI 3.0 specifications from tech specs for REST APIs.

Official
Advanced
FriendlyInternetFriendlyInternet
10

crouton-validation-reality

Validate test coverage and CI workflow enforcement in nuxt-crouton.

Official
Advanced
WhaleylawWhaleylaw

mock-data-specialist

Generate Faker-based mock data and MSW API responses for testing environments.

Community
Advanced
microsoftmicrosoft
4.9k

testing-anti-patterns

Detects and corrects common testing anti-patterns involving mocks and test-only production code.

Official
Intermediate