vitest

Codify Vitest setup, async testing, mocking, and performance patterns.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/TheBoomerDev/feedback_proyect --skill vitest-theboomerdev
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vitest
Source: https://github.com/TheBoomerDev/feedback_proyect/tree/main/.agents/skills/vitest
Command: npx skills add https://github.com/TheBoomerDev/feedback_proyect --skill vitest-theboomerdev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and assets (resource) components.

What problem does it solve?

Vitest best practices provide a curated set of patterns to reduce flaky tests, speed up CI, and improve maintainability by standardizing setup, async testing, mocking, and performance across Vitest-based projects.

Core Features & Use Cases

  • Async patterns: awaiting assertions, using waitFor, and avoiding act warnings.
  • Test Setup & Isolation: proper cleanup in afterEach, mock restoration, and module reset.
  • Mocking Patterns: targeted mocking with vi.spyOn, MSW network mocks, and avoiding over-mocking.
  • Performance guidance: pool selection, DOM environment choices (happy-dom vs jsdom), and test sharding strategies.
  • Snapshot best practices: inline vs file snapshots, descriptive naming, and review workflows.
  • Environment and setup: per-file environments, setup files, and global configuration.

Quick Start

Run the Vitest best-practices skill to audit and apply testing patterns across your project.

Frequently Asked Questions about vitest

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

FAQPage Schema
How do I fix flaky Vitest tests caused by improper async handling?

Fix flaky Vitest tests by properly awaiting assertions, utilizing waitFor for dynamic elements, and avoiding act warnings. These async patterns ensure reliable test execution and eliminate race conditions in your test suites.

What is the best way to isolate tests and manage mock cleanup in Vitest?

The best way to isolate tests is using afterEach for cleanup, restoring mocks, and resetting modules. Proper test setup and isolation prevent state leakage between tests, ensuring maintainable and reliable test suites.

How do I configure Vitest mocking without over-mocking my modules?

Configure Vitest mocking by using targeted approaches like vi.spyOn for specific functions and MSW for network mocks. Avoiding over-mocking keeps tests maintainable and focused on actual module behavior rather than implementation details.

Does Vitest test performance improve with happy-dom or jsdom environments?

Vitest test performance improves significantly with happy-dom compared to jsdom due to faster DOM execution. Choosing the right DOM environment and optimizing pool selection accelerates local development and CI pipeline execution.

How do I manage inline versus file snapshots in Vitest effectively?

Manage Vitest snapshots by choosing inline for small values and file snapshots for larger objects. Use descriptive naming and establish review workflows to maintain snapshot integrity and prevent outdated test baselines.

Can I apply Vitest best practices across React, Vue, and vanilla projects?

Yes, you can apply Vitest best practices across React, Vue, and vanilla projects. The patterns for setup, mocking, and performance guidelines standardize testing workflows universally across different frameworks and CI pipelines.