Tư Duy Testing Chuẩn với Vitest & React Testing Library (RTL)

Nguyên lý 'The more your tests resemble the way your software is used, the more confidence they can give you' và quy tắc chọn Query.

Core Mental Model

Đừng test cách code hoạt động bên trong (Implementation Details như state nội bộ hay tên biến), hãy test cách người dùng tương tác với giao diện (Click nút, gõ phím, nhìn thấy thông báo).

Key Takeaways & Principles

Quy tắc ưu tiên Query của RTL: `getByRole` (khuyến nghị số 1) -> `getByLabelText` -> `getByPlaceholderText` -> `getByText` -> `getByTestId` (chỉ dùng khi không còn cách khác).

Sử dụng `@testing-library/user-event` thay vì `fireEvent` để mô phỏng chính xác các chuỗi sự kiện thật của người dùng (hover, focus, keydown, keyup).

Tránh lạm dụng `shallow rendering` hoặc kiểm tra trực tiếp state nội bộ của component.

Enterprise React Testing & Production Readiness

intermediate

18 phút

#Testing

#Vitest

#React Testing Library