뉴욕타임스가 Enzyme에서 React Testing Library로 전환한 방법

• NYT는 React 16에서 React 18로 업그레이드하면서 기존에 사용하던 Enzyme에서 React Testing Library로 테스트 유틸리티를 전환함
  • 2016년부터 Enzyme을 사용해 왔으나, React 플랫폼이 React Testing Library를 권장하면서 전환이 필요해짐
• Enzyme은 DOM 트리의 문자열 표현을 생성하지만, React Testing Library는 실제 DOM 트리를 생성해 전체 DOM의 일부로 렌더링
• 수백 개의 파일을 전환해야 했기 때문에 사이트 트래픽 유지와 서비스 중단 방지가 중요했음

마이그레이션 전략 세 가지

• Bulldozer 접근법
  • 한 번에 전체 파일을 대규모로 수정하는 방식
  • 코드 충돌 위험이 높고, 협업이 어려움
• Consensus 접근법
  • 엔지니어들이 각각 파일에 대한 소유권을 갖고 진행하는 협업 방식
  • 새로운 프로젝트나 중요한 프로젝트에 적합
• Piecemeal 접근법
  • 개별 파일에 대해 전략적으로 점진적으로 수정
  • 매일 일관되게 업데이트해 점진적인 모멘텀을 생성함

뉴욕타임스의 선택: Piecemeal 접근법

• 가장 간단한 파일부터 수정 시작 → 한두 줄 수정이 필요한 파일부터 작업
• React Testing Library에서 DOM 요소를 찾고, 이를 테스트하는 방식에 초점
• 초기 수정이 완료되면 점진적으로 복잡한 테스트로 확장 가능
• 작업이 진행될수록 일정한 패턴이 형성되어 수정 작업이 쉬워짐
• 엔지니어들이 쉽게 참여할 수 있어 협업 강화 가능

마이그레이션 결과 및 성과

• Piecemeal 접근법은 시간이 오래 걸리지만 안정성과 지속적인 진행이 가능함
• 코드베이스에서 일정한 패턴이 생성되어 복잡한 테스트도 쉽게 해결 가능해짐
• 다른 엔지니어들이 쉽게 참여하고 기여할 수 있는 환경 조성
• 마이그레이션 과정에서 버그 최소화 및 기능 중단 방지
• 마이그레이션 성공을 통해 기술 부채 해결과 지속적인 개발 균형 유지 가능

결론

• Piecemeal 접근법을 통해 코드베이스를 React Testing Library로 성공적으로 전환
• 점진적인 수정으로 협업 강화 및 코드 품질 유지
• 복잡한 테스트도 일정한 패턴에 따라 쉽게 처리 가능해짐
• 전략적인 계획과 기술 부채 해결의 균형을 통해 안정적인 마이그레이션 완료