analyzing-test-coverage

Generate and analyze Vitest-based tests with MSW-driven network mocks.

29|5|Updated Jan 21, 2025

Search Tags:#vitest #testing #mocks #msw #integration-tests #test-builders

Ready to run

npx skills add https://github.com/saleor/configurator --skill analyzing-test-coverage

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: analyzing-test-coverage
Source: https://github.com/saleor/configurator/tree/main/.claude/skills/analyzing-test-coverage
Command: npx skills add https://github.com/saleor/configurator --skill analyzing-test-coverage

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Provides a structured approach to writing and analyzing tests with Vitest and MSW, including test builders, mocks, and organization for unit, integration, and E2E tests.

Core Features & Use Cases

Test organization patterns: Clear layout for service, repository, and integration tests.
MSW-based mocks: Mock network interactions for reliable tests.
Test data builders: Fluent builders and fixtures to generate realistic test data.
Comprehensive patterns: Guidance for service, repository, and comparator tests.

Quick Start

Define test builders and mock setups, then run pnpm test to verify coverage and test quality.

Frequently Asked Questions about analyzing-test-coverage

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

FAQPage Schema

How do I analyze test coverage with Vitest?▼

Test coverage analysis with Vitest involves running tests with the --coverage flag to measure code execution, then interpreting results to identify untested branches. Use pnpm test --coverage to generate coverage reports and identify gaps in your unit, integration, and end-to-end tests.

What's the best way to structure Vitest tests with mocks and MSW?▼

Organize Vitest tests by layer: service tests mock dependencies with vi.mock and vi.fn, repository tests use fixtures, and integration tests use MSW to mock network interactions. This layered structure ensures consistent coverage across unit, integration, and E2E workflows.

How do I build realistic test data for Vitest?▼

Test data builders provide fluent, reusable fixtures to generate consistent test objects across unit and integration tests. Builders reduce duplication, improve maintainability, and ensure test data evolves with your domain models.

Can I use MSW with Vitest for network mocking?▼

MSW integrates with Vitest to mock HTTP requests at the network level, enabling reliable integration and end-to-end tests without external dependencies. Configure MSW handlers in your test setup to intercept and respond to network calls consistently.

Why should I organize tests into service, repository, and integration layers?▼

Layered test organization clarifies dependencies and test scope: service tests verify business logic, repository tests validate data access patterns, and integration tests confirm components work together. This structure improves test clarity and coverage accuracy.

What patterns work best for Vitest mock utilities like vi.fn and vi.mock?▼

Use vi.fn for spy assertions and return values on isolated functions, and vi.mock for module-level replacements in service tests. Combine both patterns with test builders to create predictable, verifiable test scenarios across your Vitest suite.