pproenca/dot-skills

msw

MSW (Mock Service Worker) best practices for API mocking in tests (formerly test-msw).

소스 보기

사용 방법

  1. 설치 명령을 복사하고 자신의 에이전트 환경에 설치하기 전에 소스 패키지를 확인하세요.
  2. 필요한 도구, 인증 정보, 지원 환경은 원본 문서에서 확인하세요.
  3. 입력과 원하는 산출물을 설명하고 출처와 결과를 대조하세요.
npx skills add https://github.com/pproenca/dot-skills --skill msw

시작 전 확인

  • 설치에는 모델 구독, API 한도, 파일 접근 권한이 포함되지 않습니다.
  • 별점 수와 설치 수는 활동 지표이며 독립적인 품질·보안 검증이 아닙니다.
원본 Skill 문서

원본 저장소의 제목, 예시, 코드, 표, 링크, 이미지를 유지해 표시합니다.

MSW Best Practices

Comprehensive API mocking guide for MSW v2 applications, designed for AI agents and LLMs. Contains 45 rules across 8 categories, prioritized by impact to guide automated refactoring and code generation.

When to Apply

Reference these guidelines when:

  • Setting up MSW for testing or development
  • Writing or organizing request handlers
  • Configuring test environments with MSW
  • Mocking REST or GraphQL APIs
  • Debugging handler matching issues
  • Testing error states and edge cases

Rule Categories by Priority

PriorityCategoryImpactPrefix
1Setup & InitializationCRITICALsetup-
2Handler ArchitectureCRITICALhandler-
3Test IntegrationHIGHtest-
4Response PatternsHIGHresponse-
5Request MatchingMEDIUM-HIGHmatch-
6GraphQL MockingMEDIUMgraphql-
7Advanced PatternsMEDIUMadvanced-
8Debugging & PerformanceLOWdebug-

Quick Reference

1. Setup & Initialization (CRITICAL)

  • setup-server-node-entrypoint - Use correct entrypoint for Node.js (msw/node)
  • setup-lifecycle-hooks - Configure server lifecycle in test setup
  • setup-worker-script-commit - Commit worker script to version control
  • setup-node-version - Require Node.js 18+ for MSW v2
  • setup-unhandled-requests - Configure unhandled request behavior
  • setup-typescript-config - Configure TypeScript for MSW v2

2. Handler Architecture (CRITICAL)

  • handler-happy-path-first - Define happy path handlers as baseline
  • handler-domain-grouping - Group handlers by domain
  • handler-absolute-urls - Use absolute URLs in handlers
  • handler-shared-resolvers - Extract shared response logic into resolvers
  • handler-v2-response-syntax - Use MSW v2 response syntax
  • handler-request-body-parsing - Explicitly parse request bodies
  • handler-resolver-argument - Destructure resolver arguments correctly
  • handler-reusability-environments - Share handlers across environments

3. Test Integration (HIGH)

  • test-reset-handlers - Reset handlers after each test
  • test-avoid-request-assertions - Avoid direct request assertions
  • test-concurrent-boundary - Use server.boundary() for concurrent tests
  • test-fake-timers-config - Configure fake timers to preserve queueMicrotask
  • test-async-utilities - Use async testing utilities for mock responses
  • test-clear-request-cache - Clear request library caches between tests
  • test-jsdom-environment - Use correct JSDOM environment for Jest

4. Response Patterns (HIGH)

  • response-http-response-helpers - Use HttpResponse static methods
  • response-delay-realistic - Add realistic response delays
  • response-error-simulation - Simulate error responses correctly
  • response-one-time-handlers - Use one-time handlers for sequential scenarios
  • response-custom-headers - Set response headers correctly
  • response-streaming - Mock streaming responses with ReadableStream

5. Request Matching (MEDIUM-HIGH)

  • match-url-patterns - Use URL path parameters correctly
  • match-query-params - Access query parameters from request URL
  • match-custom-predicate - Use custom predicates for complex matching
  • match-http-methods - Match HTTP methods explicitly
  • match-handler-order - Order handlers from specific to general

6. GraphQL Mocking (MEDIUM)

  • graphql-operation-handlers - Use operation name for GraphQL matching
  • graphql-error-responses - Return GraphQL errors in correct format
  • graphql-batched-queries - Handle batched GraphQL queries
  • graphql-variables-access - Access GraphQL variables correctly

7. Advanced Patterns (MEDIUM)

  • advanced-bypass-requests - Use bypass() for passthrough requests
  • advanced-cookies-auth - Handle cookies and authentication
  • advanced-dynamic-scenarios - Implement dynamic mock scenarios
  • advanced-vitest-browser - Configure MSW for Vitest browser mode
  • advanced-file-uploads - Mock file upload endpoints

8. Debugging & Performance (LOW)

  • debug-lifecycle-events - Use lifecycle events for debugging
  • debug-verify-interception - Verify request interception is working
  • debug-common-issues - Know common MSW issues and fixes
  • debug-request-logging - Log request details for debugging

How to Use

Read individual reference files for detailed explanations and code examples:

Related Skills

  • For generating MSW mocks from OpenAPI, see orval skill
  • For consuming mocked APIs, see tanstack-query skill
  • For test methodology, see test-vitest or test-tdd skills

Full Compiled Document

For the complete guide with all rules expanded: AGENTS.md

같은 저장소의 Skills

더 많은 Skills

모든 Skills
pproenca
커뮤니티

audio-voice-recovery

Audio forensics and voice recovery guidelines for CSI-level audio analysis. This skill should be used when recovering voice from low-quality or low-volume audio, enhancing degraded recordings, performing forensic audio analysis, or transcribing difficult audio. Triggers on tasks involving audio enhancement, noise reduction, voice isolation, forensic authentication, or audio transcription.

설치 수
1
GitHub Stars
218
업데이트
8월 15일
pproenca
커뮤니티

zod

Zod schema validation best practices for type safety, parsing, and error handling. This skill should be used when defining z.object schemas, using z.string validations, safeParse, or z.infer. This skill does NOT cover React Hook Form integration patterns (use react-hook-form skill) or OpenAPI client generation (use orval skill).

설치 수
2
GitHub Stars
218
업데이트
8월 15일
pproenca
커뮤니티

react-hook-form

React Hook Form performance optimization for client-side form validation using useForm, useWatch, useController, useFieldArray, the subscribe() API, and the Watch / FormStateSubscribe / FieldArray render-prop components. Covers RHF 7.82 additions including resetDefaultValues() and the disabled field-array option. This skill should be used when building client-side controlled forms with React Hook Form library. This skill does NOT cover React 19 Server Actions, useActionState, or server-side form

설치 수
15
GitHub Stars
217
업데이트
8월 15일
pproenca
커뮤니티

vitest

Vitest testing framework patterns for test setup, async testing, mocking with vi., snapshots, and test performance (formerly test-vitest). This skill should be used when writing or debugging Vitest tests. This skill does NOT cover TDD methodology (use test-tdd skill), API mocking with MSW (use test-msw skill), or Jest-specific APIs.

설치 수
16
GitHub Stars
215
업데이트
8월 15일