Playwright 기반 캡처 최적화 및 CI 브라우저 인프라 구축 전략

Context

단순한 page.screenshot() 호출만으로는 Sticky Header 중복 렌더링 및 Lazy-loaded 콘텐츠 누락 문제를 해결하기 어려움. 특히 CI 환경 내 Chromium 바이너리와 시스템 의존성 라이브러리 간의 불일치로 인한 실행 실패가 주요 병목 지점으로 작용함.

Technical Solution

• networkidle 옵션 활용을 통한 최소 500ms의 네트워크 정체 상태 확인 후 렌더링 안정성 확보
• page.evaluate 기반의 점진적 스크롤 로직 구현을 통한 Lazy-loading 콘텐츠 강제 렌더링 처리
• page.addStyleTag를 이용한 Fixed-position 요소의 일시적 제거로 Full-page 캡처 시 이미지 중복 현상 방지
• npx playwright install --with-deps 명령어를 통한 OS 레벨의 공유 라이브러리 의존성 해결 및 CI 컨테이너 안정화
• Visual Regression Test를 위한 maxDiffPixelRatio 설정으로 안티앨리어싱으로 인한 오탐지 방지
• 인프라 운영 부담 제거를 위해 브라우저 플릿 관리 주체를 내부에서 외부 API로 전환하는 아키텍처 고려