Vitest per package environments

Skill kjuhwa/skills-hub/skills/testing/vitest-per-package-environments

Self-correcting knowledge corpus for Claude Code — 9 stable shape clusters, bias-correction pipeline baked into contribution flow. 47 papers, 45 techniques, 1.1k skills.

Install

npx -y skills add kjuhwa/skills-hub --skill vitest-per-package-environments

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

0 stars0 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Per-package Vitest configs in a monorepo — node env for logic packages, jsdom env for UI packages, framework-specific mocks only in app packages.

SKILL.md

2.7 KB, as published. Nobody here has run it

When to use

Pnpm/Turborepo monorepo with separate packages for logic, UI, and platform-specific wiring.
You want fast tests for logic (no DOM) and realistic tests for components (jsdom + Testing Library).
You want turbo test to run all of them in one command.

Steps

In each logic-only package (stores, queries, hooks that don't touch DOM):

// packages/core/vitest.config.ts
import { defineConfig } from "vitest/config";
export default defineConfig({
  test: {
    environment: "node",
    include: ["**/*.test.ts"],
  },
});

In each UI package:

// packages/views/vitest.config.ts
import react from "@vitejs/plugin-react";
import { defineConfig } from "vitest/config";
export default defineConfig({
  plugins: [react()],
  test: {
    environment: "jsdom",
    setupFiles: ["./test/setup.ts"],
    include: ["**/*.test.tsx"],
  },
});

test/setup.ts registers @testing-library/jest-dom matchers.

In app packages where you test framework-specific code, mock the framework only there:

// apps/web/test/setup.ts
import { vi } from "vitest";
vi.mock("next/navigation", () => ({
  useRouter: () => ({ push: vi.fn() }),
  usePathname: () => "/",
}));

Root package.json delegates to Turborepo:
```
{ "scripts": { "test": "turbo test" } }
```
Turbo tasks.test depends on ^typecheck so tests always run against a type-checked tree.
All test deps (vitest, jsdom, testing-library) live in the pnpm catalog for single-version pinning.

Example

packages/core/     → node env, 0 mocks beyond `vi.fn()`
packages/views/    → jsdom env, mocks only `@org/core` stores
apps/web/          → jsdom env, mocks `next/navigation` for platform-wiring tests
e2e/               → Playwright (separate project, `pnpm exec playwright test`)

Caveats

If a packages/views/ test needs to mock next/* or react-router-dom, the test is in the wrong package — move it to the app package.
Don't share setupFiles across packages with different envs; the matchers import may be incompatible.