Testing memastikan komponen Vue bekerja sesuai harapan. Tools utama:

1. Vitest — test runner cepat (pengganti Jest):

import { describe, it, expect } from "vitest"

describe("hitungTotal", () => {
  it("menjumlahkan array angka", () => {
    expect(hitungTotal([1, 2, 3])).toBe(6)
  })
})

2. Vue Test Utils — mount komponen untuk testing:

import { mount } from "@vue/test-utils"
import MyButton from "./MyButton.vue"

it("menampilkan label", () => {
  const wrapper = mount(MyButton, {
    props: { label: "Klik" }
  })
  expect(wrapper.text()).toContain("Klik")
})

it("emit event saat diklik", async () => {
  const wrapper = mount(MyButton)
  await wrapper.find("button").trigger("click")
  expect(wrapper.emitted("click")).toBeTruthy()
})

Pattern testing:

• Unit test — test composable/utility functions
• Component test — mount dan interaksi
• Snapshot test — pastikan output HTML konsisten

// Test composable
import { useCounter } from "./useCounter"

it("increment counter", () => {
  const { count, increment } = useCounter()
  expect(count.value).toBe(0)
  increment()
  expect(count.value).toBe(1)
})

Testing bukan opsional di project serius. Mulai dari unit test untuk logic, lalu component test untuk interaksi.