74 lines
3.7 KiB
JavaScript
74 lines
3.7 KiB
JavaScript
import { defineConfig } from 'vitest/config';
|
|
import react from '@vitejs/plugin-react';
|
|
|
|
// ────────────────────────────────────────────────────────────────────────
|
|
// Vitest configuration.
|
|
//
|
|
// Separate from `vite.config.js` so the production build config stays
|
|
// focused on production concerns (PWA manifest, sticker virtual module,
|
|
// dev-server proxy) and doesn't ship test-only configuration into
|
|
// userland. Vitest reads this file specifically when running tests.
|
|
//
|
|
// What this enables
|
|
// ─────────────────
|
|
// • jsdom environment — gives tests access to `document`, `window`,
|
|
// `localStorage`, etc. Required for any test of useDesignEditor
|
|
// (which reads localStorage for the diagnostic-history flag) and
|
|
// any future component test using React Testing Library.
|
|
//
|
|
// • React plugin — JSX compilation. Tests can import .jsx files
|
|
// directly.
|
|
//
|
|
// • Setup file — `src/test/setup.js` runs before each test file
|
|
// and registers @testing-library/jest-dom's custom matchers
|
|
// (toBeInTheDocument, toHaveTextContent, etc.) plus a global
|
|
// `afterEach` that cleans up the RTL container so tests don't
|
|
// bleed state into each other.
|
|
//
|
|
// • `globals: true` — exposes `describe`/`it`/`expect`/`vi` as
|
|
// globals so tests don't have to import them from 'vitest'
|
|
// in every file. This matches Jest's convention (which the
|
|
// codebase has zero prior tests in but the React community
|
|
// largely defaults to), and keeps the test files visually
|
|
// close to the original source they cover.
|
|
//
|
|
// What's NOT here (intentionally)
|
|
// ─────────────────────────────────
|
|
// • Coverage reporter. We can add `@vitest/coverage-v8` and a
|
|
// `coverage` config block later if/when we want CI-gated
|
|
// coverage thresholds. For v1 the tests are themselves the
|
|
// coverage — adding the reporter now would inflate dev deps
|
|
// and CI time without yet having a coverage target to enforce.
|
|
//
|
|
// • Aliases. The codebase uses only relative imports (`'../utils/...'`,
|
|
// `'./SomeComponent'`); there's no `@/` or similar to teach the
|
|
// resolver about. If we ever add path aliases to the main vite
|
|
// config, we'd mirror them here.
|
|
//
|
|
// • Custom test-include glob. The default `**/*.{test,spec}.{js,jsx}`
|
|
// matches the co-located convention we're using (test file lives
|
|
// next to the source it covers). Override only if we add a separate
|
|
// `tests/` directory later.
|
|
// ────────────────────────────────────────────────────────────────────────
|
|
|
|
export default defineConfig({
|
|
plugins: [react()],
|
|
test: {
|
|
environment: 'jsdom',
|
|
globals: true,
|
|
setupFiles: ['./src/test/setup.js'],
|
|
// Co-located tests: `Foo.test.js` next to `Foo.js`.
|
|
// The default include glob already covers this; listing it
|
|
// explicitly so the convention is visible in the config file
|
|
// for anyone exploring the repo.
|
|
include: ['src/**/*.{test,spec}.{js,jsx}'],
|
|
// CSS imports in source files (e.g. `import './App.css'`) need to
|
|
// resolve without errors during test runs even though the styles
|
|
// themselves don't affect test logic. `css: false` tells Vitest
|
|
// to short-circuit CSS processing — imports succeed, no parsing
|
|
// happens, tests stay fast. Set to true (or a finer-grained
|
|
// matcher) if/when a test needs to assert on computed styles.
|
|
css: false,
|
|
},
|
|
});
|