메뉴
Vitest (Vite-powered) testing — Jest-compatible API, vi mocks, coverage, environments, projects/workspaces. Use when writing or fixing tests, vitest.config.ts, coverage, or monorepo test commands in AFENDA-HYBRID (@afenda/db, @afenda/ui-core, view-engine, erp-view-pack). Prefer https://vitest.dev for Vitest 4.x when reference snippets disagree.
Accessibility for React UIs in AFENDA-HYBRID: semantic HTML, ARIA, keyboard support, focus management, and testing. Use for grids, dialogs, bulk selection, notifications, and command surfaces.
React and Next.js App Router architecture for AFENDA-HYBRID: Server vs Client Components, composition, state placement, package layering (ui-core → view-engine → erp-view-pack → apps/web). Use when designing components, fixing import/layer violations, or RSC boundaries.
Implementation patterns for AFENDA-HYBRID React code: custom hooks, compound components, error boundaries / error.tsx, forms, server actions, and optimistic updates.
React performance for AFENDA-HYBRID: runtime rendering (re-renders, keys, virtualization) and build-time delivery (bundles, tree-shaking, code splitting, compiler directives). Use when fixing slow lists, grids, or large client bundles.
Meta-skill: React Quality Orchestrator for AFENDA-HYBRID. Coordinates architecture, performance, accessibility, and design-pattern skills for audits, scoring (Component Quality Index), and confidence-tiered refactors. Use for full-route reviews, legacy refactors, and governance checks.
Official Storybook AI workflow — MCP server, manifests, MCP toolsets (development, docs, testing), and documentation best practices. Use when writing or fixing stories, connecting agents to Storybook, using design-system components without guessing props, or running Storybook tests from an agent. Sources are linked inline.
| name | vitest |
| description | Vitest (Vite-powered) testing — Jest-compatible API, vi mocks, coverage, environments, projects/workspaces. Use when writing or fixing tests, vitest.config.ts, coverage, or monorepo test commands in AFENDA-HYBRID (@afenda/db, @afenda/ui-core, view-engine, erp-view-pack). Prefer https://vitest.dev for Vitest 4.x when reference snippets disagree. |
| metadata | {"author":"Anthony Fu","version":"2026.1.28","source":"Generated from https://github.com/vitest-dev/vitest, scripts located at https://github.com/antfu/skills","official_docs":"https://vitest.dev"} |
Vitest is a next-generation testing framework powered by Vite. It provides a Jest-compatible API with native ESM, TypeScript, and JSX support out of the box. Vitest shares the same config, transformers, resolvers, and plugins with your Vite app.
Key Features:
Reference material was generated from Vitest docs (see GENERATION.md); wording may reflect an older minor series.
Version alignment (this repo): pnpm-workspace.yaml catalogs Vitest ^4.1.0. For new options, breaking changes, or browser mode, confirm against the official Vitest guide and config reference.
| Topic | Description | Reference |
|---|---|---|
| Configuration | Vitest and Vite config integration, defineConfig usage | core-config |
| CLI | Command line interface, commands and options | core-cli |
| Test API | test/it function, modifiers like skip, only, concurrent | core-test-api |
| Describe API | describe/suite for grouping tests and nested suites | core-describe |
| Expect API | Assertions with toBe, toEqual, matchers and asymmetric matchers | core-expect |
| Hooks | beforeEach, afterEach, beforeAll, afterAll, aroundEach | core-hooks |
| Topic | Description | Reference |
|---|---|---|
| Mocking | Mock functions, modules, timers, dates with vi utilities | features-mocking |
| Snapshots | Snapshot testing with toMatchSnapshot and inline snapshots | features-snapshots |
| Coverage | Code coverage with V8 or Istanbul providers | features-coverage |
| Test Context | Test fixtures, context.expect, test.extend for custom fixtures | features-context |
| Concurrency | Concurrent tests, parallel execution, sharding | features-concurrency |
| Filtering | Filter tests by name, file patterns, tags | features-filtering |
| Topic | Description | Reference |
|---|---|---|
| Vi Utilities | vi helper: mock, spyOn, fake timers, hoisted, waitFor | advanced-vi |
| Environments | Test environments: node, jsdom, happy-dom, custom | advanced-environments |
| Type Testing | Type-level testing with expectTypeOf and assertType | advanced-type-testing |
| Projects | Multi-project workspaces, different configs per project | advanced-projects |
Run tests from the repo root with pnpm filters or the root package.json scripts that delegate to @afenda/db.
| Package | Role | Typical command |
|---|---|---|
@afenda/db | PostgreSQL integration tests (Docker test DB, node env, pool: "forks", maxWorkers: 1) | pnpm test:db or pnpm --filter @afenda/db test:db |
@afenda/ui-core | Primitives/patterns (no Vitest script in package; typecheck only) | — |
@afenda/view-engine | React + jsdom, @vitejs/plugin-react | pnpm --filter @afenda/view-engine test |
@afenda/erp-view-pack | Same stack | pnpm --filter @afenda/erp-view-pack test |
Conventions: Vitest is declared as "vitest": "catalog:" in workspace packages so versions stay aligned. Config files live next to each package as vitest.config.ts. Database tests expect DATABASE_URL (default postgresql://postgres:postgres@localhost:5433/afenda_test); use root scripts like docker:test:start / test:db:recreate when the test DB is missing or stale.
Improving tests: Match each package’s existing include/setupFiles patterns; keep DB tests serial where migrations or shared DB state apply; use VITEST_MINIMAL=1 in @afenda/db for quieter CI output (see that package’s vitest.config.ts).
