Vitest là gì? Tại sao là lựa chọn tốt cho Vite projects?

Vitest là test framework xây dựng trên Vite với Jest-compatible API — migrate từ Jest thường chỉ cần đổi import và config.

• Lợi ích: reuse Vite config và transforms (cùng aliases, plugins, TypeScript setup) — không cần config riêng cho tests; nhanh hơn Jest nhờ esbuild transpilation và native ESM.
• Watch mode thông minh: chỉ re-run tests liên quan đến changed files, smart dependency tracking qua Vite HMR graph.
• In-source testing: viết tests trực tiếp trong source file trong if (import.meta.vitest) block — tests bị tree-shaken khỏi production build, hữu ích cho utility functions.
• Browser mode: chạy tests trong real browser (Chromium/Firefox) thay vì jsdom — accurate DOM behavior, dùng cho component tests.
• Concurrent tests: test.concurrent() chạy tests trong describe block song song, tăng speed.
• Snapshot: tương thích với Jest snapshots, có inline snapshots.
• Coverage: V8 provider (nhanh hơn) hoặc Istanbul. @vitest/ui: browser-based test runner UI để visualize và debug tests.
• Khác biệt với Jest: Vitest dùng ES modules natively (không transform), config trong vitest.config.ts thay vì jest.config.js, một số globals như __dirname cần config thêm.

Vitest is a test framework built on Vite with a Jest-compatible API — migrating from Jest usually only requires changing imports and config.

• Benefits: reuses Vite config and transforms (same aliases, plugins, TypeScript setup) — no separate config needed for tests; faster than Jest thanks to esbuild transpilation and native ESM.
• Smart watch mode: only re-runs tests related to changed files, using smart dependency tracking via Vite's HMR graph.
• In-source testing: write tests directly in the source file inside an if (import.meta.vitest) block — tests are tree-shaken out of the production build, useful for utility functions.
• Browser mode: run tests in a real browser (Chromium/Firefox) instead of jsdom — accurate DOM behavior, suitable for component tests.
• Concurrent tests: test.concurrent() runs tests within a describe block in parallel, improving speed.
• Snapshot: compatible with Jest snapshots, supports inline snapshots.
• Coverage: V8 provider (faster) or Istanbul. @vitest/ui: browser-based test runner UI for visualizing and debugging tests.
• Differences from Jest: Vitest uses ES modules natively (no transformation), config lives in vitest.config.ts instead of jest.config.js, some globals like __dirname require additional config.