Cách The New York Times chuyển từ Enzyme sang React Testing Library

• NYT đã nâng cấp từ React 16 lên React 18 và chuyển tiện ích kiểm thử từ Enzyme sang React Testing Library mà họ đã dùng trước đó
  • Họ đã sử dụng Enzyme từ năm 2016, nhưng khi nền tảng React khuyến nghị React Testing Library, việc chuyển đổi trở nên cần thiết
• Enzyme tạo ra biểu diễn chuỗi của cây DOM, trong khi React Testing Library tạo cây DOM thực và render nó như một phần của toàn bộ DOM
• Vì phải chuyển đổi hàng trăm tệp, việc duy trì lưu lượng truy cập của trang và ngăn gián đoạn dịch vụ là rất quan trọng

Ba chiến lược migration

• Cách tiếp cận Bulldozer
  • Chỉnh sửa quy mô lớn toàn bộ tệp cùng một lúc
  • Rủi ro xung đột mã cao và khó cộng tác
• Cách tiếp cận Consensus
  • Cách làm cộng tác trong đó các kỹ sư chịu trách nhiệm sở hữu từng tệp
  • Phù hợp với dự án mới hoặc dự án quan trọng
• Cách tiếp cận Piecemeal
  • Chỉnh sửa dần dần một cách chiến lược trên từng tệp riêng lẻ
  • Cập nhật đều đặn mỗi ngày để tạo động lực tăng dần

Lựa chọn của The New York Times: cách tiếp cận Piecemeal

• Bắt đầu sửa từ những tệp đơn giản nhất → ưu tiên các tệp chỉ cần chỉnh một hoặc hai dòng
• Tập trung vào cách tìm phần tử DOM và kiểm thử chúng trong React Testing Library
• Sau khi hoàn thành các chỉnh sửa ban đầu, có thể dần mở rộng sang các bài kiểm thử phức tạp hơn
• Khi công việc tiến triển, các mẫu nhất quán dần hình thành, giúp việc sửa đổi trở nên dễ hơn
• Các kỹ sư có thể dễ dàng tham gia hơn, từ đó tăng cường cộng tác

Kết quả và thành quả của quá trình migration

• Cách tiếp cận Piecemeal mất nhiều thời gian hơn nhưng cho phép tính ổn định và tiến độ liên tục
• Các mẫu nhất quán được hình thành trong codebase, giúp xử lý cả những bài kiểm thử phức tạp một cách dễ dàng hơn
• Tạo ra môi trường để các kỹ sư khác dễ dàng tham gia và đóng góp
• Trong quá trình migration, giảm thiểu bug và ngăn chặn gián đoạn tính năng
• Việc migration thành công giúp cân bằng giữa xử lý technical debt và duy trì phát triển liên tục

Kết luận

• Thông qua cách tiếp cận Piecemeal, codebase đã được chuyển thành công sang React Testing Library
• Các chỉnh sửa dần dần giúp tăng cường cộng tác và duy trì chất lượng mã
• Ngay cả những bài kiểm thử phức tạp cũng có thể được xử lý dễ dàng theo các mẫu nhất quán
• Hoàn tất migration ổn định nhờ cân bằng giữa lập kế hoạch chiến lược và giải quyết technical debt