vitest_skill

Overview

This skill specializes in Vitest, the fast unit test framework built on Vite, with a focus on TypeScript-friendly, in-source testing and native ESM support. It helps configure, migrate, and optimize tests while preserving Jest-like APIs using vi.* globals. The skill also includes guidance for dotfiles and install scripts to make Vitest part of your developer environment.

How this skill works

It inspects project layout for vitest.config.ts or vite.config.ts to detect global settings, test environment (jsdom/node), and alias resolution. It suggests migration steps from Jest by replacing jest.* usages with vi.* and ensuring ESM imports and proper export styles. It checks for common pitfalls like CommonJS require, module.exports, or unnecessary tsc test steps and suggests fixes and performant configs.

When to use it

• Setting up fast unit tests for TypeScript projects using Vite
• Migrating a codebase from Jest to Vitest while keeping similar test APIs
• Running in-source tests (tests colocated with source files) for rapid feedback
• Configuring test environment (jsdom vs node) or enabling globals in vitest.config.ts
• Integrating Vitest into dotfiles or developer install scripts for consistent setups

Best practices

• Prefer vi.fn, vi.mock, and vi.spyOn instead of any jest.* globals
• Use import/export and ESM module syntax; avoid require and module.exports
• Reuse vite.config.ts for shared build/test resolution and aliases
• Avoid adding tsc compilation to test runner — rely on Vitest's esbuild path for speed
• Run vitest in watch during dev and vitest run in CI; enable coverage only in CI to save local cycles

Example use cases

• Add vitest.config.ts to a TypeScript repo and enable globals and jsdom for DOM tests
• Convert existing Jest tests by replacing jest.mock/jest.fn with vi.mock/vi.fn and switching require to import
• Bundle Vitest setup into dotfiles and install scripts to provision consistent developer environments
• Use in-source tests (.test.ts next to implementation) for faster edit-test loops with vitest watch mode
• Enable vitest ui for a browser-based test runner during manual QA