Apa itu Vitest?

Vitest adalah test runner modern untuk project JavaScript/TypeScript. Dibangun di atas Vite, sehingga sangat cepat dan mendukung ESM, TypeScript, dan JSX secara native tanpa konfigurasi tambahan.

Instalasi

npm install -D vitest

Tambahkan script di package.json:

{
  "scripts": {
    "test": "vitest",
    "test:run": "vitest run"
  }
}

Konfigurasi Dasar

Vitest bisa dikonfigurasi lewat vite.config.js atau file terpisah vitest.config.js:

// vitest.config.js
import { defineConfig } from "vitest/config";

export default defineConfig({
  test: {
    globals: true,
    environment: "node",
  },
});

Menulis Test Pertama

Buat file math.js dan math.test.js:

// math.js
export function tambah(a, b) {
  return a + b;
}

export function kali(a, b) {
  return a * b;
}

// math.test.js
import { describe, it, expect } from "vitest";
import { tambah, kali } from "./math";

describe("math utilities", () => {
  it("menambahkan dua angka", () => {
    expect(tambah(2, 3)).toBe(5);
    expect(tambah(-1, 1)).toBe(0);
  });

  it("mengalikan dua angka", () => {
    expect(kali(3, 4)).toBe(12);
    expect(kali(0, 100)).toBe(0);
  });
});

Menjalankan Test

Jalankan npm test untuk mode watch (otomatis re-run saat file berubah), atau npm run test:run untuk single run.

Setup & Teardown

Gunakan lifecycle hooks untuk persiapan dan pembersihan:

import { describe, it, expect, beforeEach, afterEach } from "vitest";

describe("keranjang belanja", () => {
  let keranjang;

  beforeEach(() => {
    keranjang = []; // reset sebelum setiap test
  });

  afterEach(() => {
    console.log("Test selesai, items:", keranjang.length);
  });

  it("menambahkan item ke keranjang", () => {
    keranjang.push({ nama: "Buku", harga: 50000 });
    expect(keranjang).toHaveLength(1);
  });

  it("keranjang dimulai kosong", () => {
    expect(keranjang).toHaveLength(0);
  });
});

Perbedaan beforeEach vs beforeAll

• beforeEach — dijalankan sebelum setiap test (paling sering digunakan)
• beforeAll — dijalankan sekali sebelum semua test di blok describe
• afterEach — dijalankan setelah setiap test
• afterAll — dijalankan sekali setelah semua test selesai