Testing masih sering di-skip oleh developer, padahal ini skill yang sangat dihargai di dunia kerja.
Kenapa Testing Penting?
- Menangkap bugs sebelum production
- Refactoring jadi aman
- Dokumentasi behavior yang hidup
- Meningkatkan kepercayaan saat deploy
Setup
npm install -D jest @testing-library/react @testing-library/jest-dom
Test Pertama
import { render, screen } from "@testing-library/react";
import { Button } from "./button";
test("renders button with text", () => {
render(<Button>Click me</Button>);
expect(screen.getByText("Click me")).toBeInTheDocument();
});
test("calls onClick when clicked", async () => {
const handleClick = jest.fn();
render(<Button onClick={handleClick}>Click</Button>);
await userEvent.click(screen.getByText("Click"));
expect(handleClick).toHaveBeenCalledTimes(1);
});
Testing Async
test("loads and displays data", async () => {
render(<UserProfile userId="123" />);
expect(await screen.findByText("Sony")).toBeInTheDocument();
});
Tips
- Test behavior, bukan implementation details
- Gunakan getByRole > getByTestId
- Minimal test happy path + error state
- Jangan test styling — test functionality
- Aim for 80% coverage di kode penting
Mulai dari test sederhana, lalu tingkatkan coverage secara bertahap.