Testing with Vitest or Jest
Testing with Vitest or Jest — why it matters
Vitest and Jest organize suites, tests, assertions, mocking, and watch-mode feedback. Pick a runner compatible with your project's module system and transpilation setup. These packages must be installed separately; TypeScript does not ship a test runner.
What you’ll learn
- Explain testing with vitest or jest and the problem it solves.
- Identify the relevant compile-time checks and runtime responsibilities.
- Run the example, predict its output, and try a realistic modification.
Understand the mechanism
This self-contained assertion checks the same behavior as an expect(multiply(4, 5)).toBe(20) statement in a Vitest test file. The practical section shows the real Vitest syntax and command.
Installing @types/jest does not install Jest, and importing Vitest in an ordinary script requires the Vitest package.
Follow the concept flow
Run the primary TypeScript example
Save as testing-vitest-or-jest.ts. The following program passed strict TypeScript compilation, and the displayed output was captured by executing its emitted JavaScript with Node.js 22.16.0.
TypeScript source
function multiply(a: number, b: number): number { return a * b; }
const actual = multiply(4, 5);
if (actual !== 20) throw new Error("multiply failed");
console.log(`Result: ${actual}`);Verified output
Result: 20Compile: npx tsc --strict --target es2022 --module commonjs testing-vitest-or-jest.ts; run: node testing-vitest-or-jest.js. For Node.js API examples, install @types/node first. For browser projects, use the browser-specific instructions below.
The example demonstrates the code-level behavior; the related configuration or test commands are shown separately when needed.
Trace the result
This self-contained assertion checks the same behavior as an expect(multiply(4, 5)).toBe(20) statement in a Vitest test file. The practical section shows the real Vitest syntax and command.
Predict what changes if you alter one input. Then run the code to compare your reasoning with the real output.
Try the full tool or configuration workflow
Practical project lab: These are real configuration and source-file examples, not a TypeScript object that merely describes settings. Place the files at the named paths relative to one project directory.
math.ts
export function multiply(a: number, b: number) { return a*b; }math.test.ts
import { test, expect } from "vitest";
import { multiply } from "./math";
test("multiplies", () => { expect(multiply(4,5)).toBe(20); });Commands
npm install -D vitest typescript
npx vitest runVitest imports require installation; the standalone primary example uses no external packages.
This project requires its named external tool or dependency and was supplied as setup guidance; it was not claimed as an executed test here.
Common mistake and correction
Installing @types/jest does not install Jest, and importing Vitest in an ordinary script requires the Vitest package.
Identify whether the failure is a type-checking issue, a configuration issue, or a runtime behavior issue before choosing a fix.
Practice the concept
Create math.test.ts using import {test, expect} from "vitest" and run npx vitest run.
Write down your expected result first. For configuration examples, compare compiler output and diagnostics; for test examples, make the assertion fail deliberately to verify that the tool reports it.
Check your understanding
What to remember
Vitest and Jest organize suites, tests, assertions, mocking, and watch-mode feedback.
Run the primary example, then complete the practice task or environment-specific lab.
Reaching the recap and completing the quizzes are separate milestones.