접근성 기능 테스트

접근성 기능 테스트에 대해 설명합니다.

접근성 테스트를 추가해야 하는 경우 # axe-core-gem을 사용한 기능 테스트는 HAML, Vue 및 JavaScript 등 모든 UI 기술에 걸쳐 완전한 사용자 여정을 다루는 가장 포괄적인 접근성 테스트 접근 방식을 제공합니다. 다음에 대한 접근성 테스트를 우선시합니다: 미션 크리티컬 사용자 여정: 사용자가 의존하는 핵심 워크플로우. 트래픽이 많은 페이지: 사용자 상호작용이 많은 영역. 새 기능: 처음부터 접근성 보장. 복잡한 UI 상호작용: 다단계 프로세스, 모달, 동적 콘텐츠. 전략적 접근 방식 # 가능한 모든 페이지 조합을 테스트하는 것보다 주요 사용자 시나리오에 대한 심층 커버리지에 집중하세요. 이 접근 방식은 모든 뷰에 걸쳐 광범위하지만 얕은 커버리지보다 더 나은 가치를 제공합니다. 기능 테스트에서 테스트하는 것의 장점 중 하나는 개별 컴포넌트만이 아닌 다양한 상태와 완전한 사용자 흐름을 확인할 수 있다는 것입니다. 아래에서 접근성 검사를 접근하는 방법에 대한 몇 가지 예시를 찾을 수 있습니다. 빈 상태 # 일부 뷰에는 기본 뷰와 다른 페이지 구조를 만드는 빈 상태가 있습니다. 이러한 뷰는 예를 들어 첫 번째 이슈를 만들거나 기능을 활성화하는 등의 일부 작업을 제공할 수도 있습니다. 이 경우 빈 상태와 기본 뷰 모두에 대한 어설션을 추가합니다. 사용자 상호작용 전 준수 확인 # 종종 우리는 사용자가 수행할 것으로 예상하는 여러 단계에 대해 테스트합니다. 이 경우 시뮬레이션이 시작되기 전에 일찍 검사를 포함해야 합니다. 이렇게 하면 사용자에게 기대하는 것에 대한 장벽이 없음을 보장합니다. 변경된 페이지 구조 후 준수 확인 # 사용자 상호작용은 페이지 구조에 상당한 변화를 초래할 수 있습니다. 예를 들어 대화 상자가 표시되거나 새 섹션이 렌더링됩니다. 그 경우 이러한 변경 후에 어설션을 추가합니다. 사용자가 사용 가능한 모든 컴포넌트와 상호작용할 수 있음을 확인하고 싶습니다. 접근성 테스트를 추가하는 방법 # 새 스펙 파일 생성 # 자동화된 접근성 테스트가 이미 정의된 사용자 여정 을 따르기를 원합니다. 이를 달성하기 위해 E2E 테스트용으로 정의된 테스트 케이스를 재사용합니다. 팀을 위한 새 접근성 스펙을 추가하려면: 다음 중 하나로 팀의 테스트 케이스 목록을 탐색합니다: 그룹 레이블로 필터링할 수 있는 테스트 케이스 페이지 를 탐색합니다. E2E browser_ui 디렉토리 및 ee/browser_ui 디렉토리 로 이동한 다음 스테이지 디렉토리와 다루고자 하는 기능을 선택합니다. 다루고자 하는 사용자 여정을 알면: spec/features/accessibility 로 이동합니다. 스테이지와 다루고 있는 기능의 폴더 아래에 새 Ruby 스펙을 만듭니다. 예: create/repository/ . 따르는 E2E 테스트 케이스 이름으로 파일 이름을 지정합니다. 예: add_new_branch_rule_spec.rb . 이 예시에서 결과는 spec/features/accessibility/create/repository/add_