Playwright와 axe-core 기반의 자동화된 WCAG 회귀 분석 시스템 구축

I built a free WCAG scanner because I kept shipping accessibility regressions

Grant Drew2026년 6월 13일2분intermediate

AI 요약

Context

접근성 수정 사항이 배포 후 반복적으로 소실되는 Accessibility Regression 문제 발생. 수동 점검의 한계로 인해 프로덕션 환경에서 결함이 발견되는 사후 대응 구조의 비효율성 확인.

Playwright Chromium 기반 Headless Browser를 활용한 실제 렌더링 페이지 분석 구조 설계
axe-core 라이브러리를 통합하여 WCAG 기준에 따른 머신 체크 가능 항목의 자동 식별 구현
Next.js와 SQLite, Fly.io를 조합한 경량 서버리스 아키텍처 채택으로 빠른 결과 도출
외부 URL 요청 시 DNS Resolve 및 Private/Loopback/Link-local Range 차단을 통한 SSRF 방어 체계 구축
Cloud Metadata Endpoint 차단 및 리다이렉트 경로의 재검증 로직을 통한 내부 인프라 접근 제어

실천 포인트

1. 외부 URL Fetching 기능 구현 시 DNS Resolution 단계에서 Private IP 대역을 필터링하여 SSRF 위험 제거

2. 자동화 도구로 해결 가능한 30~50%의 Baseline을 먼저 확보하여 휴먼 리뷰의 효율성 극대화

3. 배포 파이프라인에 CI 체크를 통합하여 접근성 회귀 발생 시 Build Fail 처리하는 가드레일 구축

태그