Does it provide mock data management?

Yes, it implements a Factory pattern that allows you to create valid default mock data with simple overrides for specific test cases.

Can I use this for unit testing?

Absolutely. It covers the testing pyramid, including unit testing for pure functions, validation logic, and data mappers.

What testing stack does this skill support?

The skill is optimized for Vitest, React Testing Library (RTL), and Mock Service Worker (MSW) within a React ecosystem.

Does it include GraphQL support?

Yes, it provides specialized patterns for Apollo Client and MSW handlers, including specific examples for OMS/WMS GraphQL endpoints.

How does this differ from E2E testing?

While E2E testing (like Playwright) covers the full browser flow, this skill focuses on integration tests that mock external APIs for faster, more reliable TDD cycles.

Integration Test Patterns

Name: Integration Test Patterns
Author: xxziiko

byxxziiko

0•

セキュリティとテスト

Implements professional integration testing workflows using Vitest, React Testing Library, and MSW for robust React applications.

This skill provides a comprehensive framework for React integration testing, centered on the Red-Green-Refactor TDD cycle and the testing pyramid. It offers standardized templates for Vitest configuration, MSW (Mock Service Worker) handlers for GraphQL/REST, and test data factories. By focusing on user-centric testing patterns for components, custom hooks, and Apollo Client, it enables developers to build maintainable test suites that verify complex business logic and API interactions without the overhead of full E2E testing.

主な機能

01Domain-driven test file structures and co-location principles

02Test-Driven Development (TDD) workflow implementation guides

03Reusable test data factories and custom render utility functions

04Vitest and React Testing Library (RTL) configuration templates

050 GitHub stars

06Mock Service Worker (MSW) patterns for GraphQL and REST APIs

ユースケース

01Mocking complex GraphQL API responses for isolated component testing

02Establishing a standardized integration testing environment for React projects

03Testing business-critical custom hooks and utility functions using TDD

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add xxziiko/subagent integration-test-patterns

For use in Claude.ai and ChatGPT

主な機能

01Domain-driven test file structures and co-location principles

02Test-Driven Development (TDD) workflow implementation guides

03Reusable test data factories and custom render utility functions

04Vitest and React Testing Library (RTL) configuration templates

050 GitHub stars

06Mock Service Worker (MSW) patterns for GraphQL and REST APIs

ユースケース

01Mocking complex GraphQL API responses for isolated component testing

02Establishing a standardized integration testing environment for React projects

03Testing business-critical custom hooks and utility functions using TDD

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add xxziiko/subagent integration-test-patterns

For use in Claude.ai and ChatGPT