피드로 돌아가기
Dev.toFrontend
원문 읽기
Hardcoded Text 배제 및 i18next Key 기반 검증으로 다국어 테스트 유지보수 비용 절감
The Cypress i18n Mistake: Testing Words Instead of Meaning - i18next is your partner
AI 요약
Context
다국어 지원 애플리케이션 테스트 시 Cypress의 cy.contains()에 번역된 텍스트를 직접 입력하는 방식 채택. UX 문구 변경이나 번역 수정 시 기능 동작 여부와 무관하게 테스트가 실패하는 정적 텍스트 의존성 문제 발생.
Technical Solution
- 테스트 대상의 '문구'가 아닌 '의미(Meaning)'를 검증하는 구조로 설계 변경
- i18next 라이브러리를 Cypress 테스트 환경에 통합하여 Translation Key 기반의 동적 텍스트 추출 로직 구현
cy.t('auth.welcome', { lng: 'es' })와 같은 커스텀 커맨드를 통해 런타임에 해당 언어의 최신 번역값을 조회하는 메커니즘 도입- UI 상호작용은 Stable Selector를 사용하고, 검증 단계에서만 Translation Key를 매핑하여 텍스트 변경에 유연한 테스트 구조 확보
- i18next의 Interpolation, Plurals, Fallback 기능을 그대로 활용하여 테스트 코드의 중복 구현 방지
실천 포인트
- UI 텍스트 변경만으로 테스트가 실패하고 있지는 않은지 검토 - 다국어 검증 시 Hardcoded String 대신 i18n Key-Value 매핑 구조 도입 - 인터랙션 요소는 텍스트가 아닌 `data-testid` 등 고유 식별자 사용 - 법적 고지문 등 정확한 문구가 필수적인 경우에만 제한적으로 Exact Text 검증 적용