React 기반 오디오 플레이어 'Réécoute' 팀이 Playwright를 활용한 웹 애플리케이션(SPA) 자동화 테스트 구축 경험을 공유했습니다. 이들은 개별 기능 테스트보다는 가입부터 핵심 기능 사용까지 이어지는 전체 사용자 여정(user journey)을 검증하는 종단 간(E2E) 테스트에 집중하며, 실제 브라우저와 동일한 데이터베이스를 사용해 현실적인 테스트 환경을 구현했습니다.
Réécoute는 2~3시간 길이의 녹음에 최적화된 오디오 플레이어로, 복잡한 상호작용 기능을 갖춘 SPA입니다. 테스트는 Playwright로 작성되었으며, 약 20개 파일에 1~4개의 테스트가 포함됩니다. 특히, 테스트마다 서버와 데이터베이스를 새로 띄우는 대신, 모든 테스트가 동일한 데이터베이스를 공유하면서 각자 필요한 데이터를 생성하고 다른 테스트의 데이터는 건드리지 않는 방식을 택했습니다. 이는 테스트 환경 격리의 복잡성과 속도 저하 문제를 해결하고, 데이터가 많은 실제 환경에서의 성능 저하까지 검증할 수 있게 합니다. S3, Stripe, Twilio 같은 외부 서비스는 모든 테스트가 공유하는 모의(mocking) 구현으로 대체해 인터넷 연결 없이도 빠르고 안정적인 실행을 보장합니다. 또한, Playwright의 완전 병렬 실행 기능과 Chromium 브라우저 단독 사용을 통해 M3 MacBook Air에서 전체 테스트를 20초대에 완료하는 등 실행 시간을 크게 단축했습니다.
이러한 접근 방식은 복잡한 SPA의 테스트 효율성과 신뢰성을 높이는 데 중요한 시사점을 줍니다. 특히, 실제 사용자 경험에 가까운 종단 간 테스트를 우선하고, 데이터베이스 격리 대신 독립적인 데이터 소유 방식을 채택함으로써 테스트 환경 구축의 복잡성을 줄이면서도 현실적인 검증이 가능해집니다. 이는 개발팀이 핵심 기능의 안정성에 집중하고, 간헐적인 실패는 CI 재시도로 처리하는 등 실용적인 테스트 전략을 수립하는 데 기여합니다. 궁극적으로는 개발 속도를 유지하면서도 사용자에게 안정적인 서비스를 제공하는 데 필수적인 요소로 작용할 것입니다.