Skip to main content
skill CX Codex

vitest · pproenca — Claude Code skill: what it does, how to install

Equips your coding agent with 44 prioritized rules for writing, debugging, and speeding up Vitest suites. Covers async patterns, mocks, and test isolation.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add pproenca/dot-skills --skill vitest -a claude-code
Open on GitHub

What vitest does

The skill organizes 44 rules into 8 categories ranked by impact. The highest priority covers asynchronous assertions and state isolation across test runs. Rules offer direct guidance: awaiting promises, using vi.waitFor for polling conditions, and replacing jsdom with happy-dom to reduce execution time.

It addresses common test suite issues like shared mutable state and uncleaned mocks. Your agent learns when to prefer vi.spyOn over vi.mock, how to handle fake timers, and how to configure CI sharding for parallel runs.

This guide does not cover TDD workflow or API mocking with MSW: those practices belong to the standalone test-tdd and test-msw skills. Jest-specific APIs are also outside its scope.

What it helps with

  • eliminate flaky failures in async Vitest assertions
  • isolate state and reset mocks between tests
  • speed up CI test runs with happy-dom and sharding
  • review Vitest test suites against structured best practices

Example prompts for the agent

  • Debug this flaky async Vitest test that fails on fake timers
  • Review my Vitest configuration to optimize CI run time
  • Write isolated unit tests for this service using vi.spyOn mocks

How to install vitest

1Skills CLI (Vercel)

npx skills add pproenca/dot-skills --skill vitest -a claude-code

2Manually: put the files in place

~/.claude/skills/vitest/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/vitest/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about vitest

How do I install the vitest skill in Claude Code?

Run npx skills add pproenca/dot-skills --skill vitest -a claude-code in your terminal.

What does the vitest skill do?

It provides coding agents with 44 prioritized rules across 8 categories for Vitest. The guidelines help agents write stable async tests, configure mock cleanup, and optimize test suite performance.

Does this skill cover TDD or MSW mocking?

No, TDD methodology and MSW network mocking are excluded. The author provides separate test-tdd and test-msw skills for those use cases.

Source text

SKILL.md · MIT
---
name: vitest
description: 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.
---

# Vitest Best Practices

Comprehensive performance optimization and best practices guide for Vitest testing framework. Contains 44 rules across 8 categories, prioritized by impact to guide test writing, refactoring, and code review.

## When to Apply

Reference these guidelines when:
- Writing new Vitest tests
- Debugging flaky or slow tests
- Setting up test configuration
- Reviewing test code in PRs
- Migrating from Jest to Vitest
- Optimizing CI/CD test performance

## Rule Categories by Priority

| Priority | Category | Impact | Prefix |
|----------|----------|--------|--------|
| 1 | Async Patterns | CRITICAL | `async-` |
| 2 | Test Setup & Isolation | CRITICAL | `setup-` |
| 3 | Mocking Patterns | HIGH | `mock-` |
| 4 | Performance | HIGH | `perf-` |
| 5 | Snapshot Testing | MEDIUM | `snap-` |
| 6 | Environment | MEDIUM | `env-` |
| 7 | Assertions | LOW-MEDIUM | `assert-` |
| 8 | Test Organization | LOW | `org-` |

## Quick Reference

### 1. Async Patterns (CRITICAL)

- `async-await-assertions` - Await async assertions to prevent false positives
- `async-return-promises` - Return promises from test functions
- `async-fake-timers` - Use fake timers for time-dependent code
- `async-waitfor-polling` - Use vi.waitFor for async conditions
- `async-concurrent-expect` - Use test context expect in concurrent tests
- `async-act-wrapper` - Await user events to avoid act warnings
- `async-error-handling` - Test async error handling properly

### 2. Test Setup & Isolation (CRITICAL)

- `setup-beforeeach-cleanup` - Clean up state in afterEach hooks
- `setup-restore-mocks` - Restore mocks after each test
- `setup-avoid-shared-state` - Avoid shared mutable state between tests
- `setup-beforeall-expensive` - Use beforeAll for expensive one-time setup
- `setup-reset-modules` - Reset modules when testing module state
- `setup-test-factories` - Use test factories for complex test data

### 3. Mocking Patterns (HIGH)

- `mock-vi-mock-hoisting` - Understand vi.mock hoisting behavior
- `mock-spyon-vs-mock` - Choose vi.spyOn vs vi.mock appropriately
- `mock-implementation-not-value` - Use mockImplementation for dynamic mocks
- `mock-msw-network` - Use MSW for network request mocking
- `mock-avoid-overmocking` - Avoid over-mocking
- `mock-type-safety` - Maintain type safety in mocks
- `mock-clear-between-tests` - Clear mock state between tests

### 4. Performance (HIGH)

- `perf-pool-selection` - Choose the right pool for performance
- `perf-disable-isolation` - Disable test isolation when safe
- `perf-happy-dom` - Use happy-dom over jsdom when possible
- `perf-sharding` - Use sharding for CI parallelization
- `perf-run-mode-ci` - Use run mode in CI environments
- `perf-bail-fast-fail` - Use bail for fast failure in CI

### 5. Snapshot Testing (MEDIUM)

- `snap-inline-over-file` - Prefer inline snapshots for small values
- `snap-avoid-large` - Avoid large snapshots
- `snap-stable-serialization` - Ensure stable snapshot serialization
- `snap-review-updates` - Review snapshot updates before committing
- `snap-describe-intent` - Name snapshot tests descriptively

### 6. Environment (MEDIUM)

- `env-per-file-override` - Override environment per file when needed
- `env-setup-files` - Use setup files for global configuration
- `env-globals-config` - Configure globals consistently
- `env-browser-api-mocking` - Mock browser APIs not available in test environment

### 7. Assertions (LOW-MEDIUM)

- `assert-specific-matchers` - Use specific matchers over generic ones
- `assert-edge-cases` - Test edge cases and boundaries
- `assert-one-assertion-concept` - Test one concept per test
- `assert-expect-assertions` - Use expect.assertions for async tests
- `assert-toequal-vs-tobe` - Choose toBe vs toEqual correctly

### 8. Test Organization (LOW)

- `org-file-colocation` - Colocate test files with source files
- `org-describe-nesting` - Use describe blocks for logical grouping
- `org-test-naming` - Write descriptive test names
- `org-test-skip-only` - Use skip and only appropriately

## How to Use

Read individual reference files for detailed explanations and code examples:

- [Section definitions](references/_sections.md) - Category structure and impact levels
- [Rule template](assets/templates/_template.md) - Template for adding new rules
- [async-await-assertions](references/async-await-assertions.md) - Example rule file
- [mock-vi-mock-hoisting](references/mock-vi-mock-hoisting.md) - Example rule file

## Related Skills

- For TDD methodology, see `test-tdd` skill
- For API mocking with MSW, see `test-msw` skill
- For TypeScript testing patterns, see `typescript` skill

## Full Compiled Document

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

© pproenca · MIT · pproenca/dot-skills

Similar skills

All skills for Testing and QA →

vitest by other authors comes first.

vitest Anthony Fu This skill guides work with Vitest tests, mocks, coverage, filtering, and fixtures. Use it when setting up tests or checking how Vitest fits a Vite project. CX Codex +1 43,800installs vitest jezweb Detects your project type and writes a working Vitest setup: config, test setup file, utilities and a sample test. Useful when a project has no tests yet. CX Codex +1 1,700installs vitest-testing secondsky A skill that teaches your agent to write unit and integration tests with Vitest in TypeScript and JavaScript projects. Handy when you need config, mocks and coverage set up fast. CX Codex +1 1,200installs vitest-skill TestMu AI Generates Vitest unit tests for JavaScript and TypeScript projects. Provides patterns for vi mocking and React component testing. CX Codex +1 448installs writing-tests spencerpauly Inspects existing code, detects your test runner, and drafts unit and integration tests with mocks and edge cases. CX Codex +1 499installs vitest-unit-testing-cursorrules-prompt-file PatrickJS A Cursor rule that turns the agent into a Vitest and TypeScript test writer: it targets business logic and utilities, mocking dependencies with vi.mock. ★ 41,011repo stars pytest-skill TestMu AI An agent skill that writes pytest tests for Python: fixtures, parametrize, markers, mocking and conftest patterns. Useful when you need test coverage without writing boilerplate by hand. CX Codex +1 412installs vitest-midscene-e2e web-infra-dev Connects Vitest with Midscene to build AI-driven UI tests across Web, Android, and iOS using natural language. It scaffolds projects and runs tests without fragile element selectors. CX Codex +1 2,100installs

From the same set46

react-hook-form Optimizes client-side forms using React Hook Form 7.82.0 and prevents unnecessary re-renders across field subscriptions, validation, and controlled UI inputs. CX Codex +1 3,000installs emilkowal-animations A set of 58 web animation rules based on Emil Kowalski's work for React and Framer Motion. Helps tune easing curves, gestures, and UI timing. CX Codex +1 2,800installs nuqs A skill with 39 nuqs rules covering typed parsers, adapters, Server Components and URL update performance. Useful when an agent writes or refactors URL state code. CX Codex +1 2,300installs clean-architecture A skill with 42 rules from Robert C. Martin's book: it tells the agent which way dependencies should point and where layer boundaries belong. CX Codex +1 2,000installs code-simplifier A skill that gives AI agents 47 rules for cleaning up recently changed code without altering what it does. CX Codex +1 1,600installs expo-react-native-performance Performance guidelines with 42 prioritized rules for Expo React Native apps. Helps agents refactor startup bottlenecks, list virtualization, re-renders, and animations. CX Codex +1 1,500installs framer-motion Optimizes React animations using Framer Motion guidelines: slashes bundle size, eliminates unnecessary re-renders, and polishes gesture or scroll transitions. CX Codex +1 1,100installs msw A skill with 45 rules for Mock Service Worker v2: setup, handlers, test integration, GraphQL. Useful when your agent writes or fixes HTTP mocks. CX Codex +1 842installs

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor