Control UI E2E
워크플로우
- 증거 선택. 라우팅, 부트, Gateway 핸드셰이크, 전체 사용자 흐름에는 기존 브라우저 E2E 레인을 사용하고, 격리된 렌더 로직에는 브라우저/단위 테스트를 사용합니다. 요청된 결과와 일치하는 아래 각 브랜치를 읽으십시오. 완료: 모든 변경된 동작에 명명된 시나리오와 증거 경계가 있습니다.
- 픽스처 준비. 합성 Gateway 데이터와 함께
ui/src/test-helpers/control-ui-e2e.ts를 재사용하십시오. 누락된 응답에 대해 타입이 지정된 시나리오 옵션을 확장하십시오. 기존 종속성 설치를 사용하고, 다른 작업에서 사용하는 설치를 유지하십시오. 실제 Gateway/공급자 자격 증명은 명시적인 라이브 증거 승인이 필요합니다. 실행 배치에 대한 테스트 정책을 따르십시오. 완료: 대상 흐름이 의도된 소스 또는 프로덕션 빌드에 대해 실행되고 각 필요한 픽스처 응답이 정의됩니다. - 동작 실행. 탐색 전에 모의를 설치하십시오. 보이는 컨트롤을 통해 작동하고 렌더링된 결과와 관련 Gateway 요청을 모두 확인하십시오. 재생하기 전에 제품 또는 픽스처 소유자에게 예상치 못한 동작을 해결하십시오. 완료: 각 시나리오가 주장된 결과에 도달하거나, 충족되지 않은 단언을 식별하는 실패가 유지됩니다.
- 증거 제공. 아래 아티팩트 규칙과 선택된 브랜치의 검사를 적용하십시오. 확인된 결과, 실패, 테스트되지 않은 상태를 별도로 보고하십시오. 완료: 모든 주장된 결과에는 검사 가능한 증거가 있으며, 남은 격차는 명명됩니다.
UI 스트레스 테스트
상당한 레이아웃/컴포넌트 변경 또는 다중 상태 디자인 피드백의 경우, 스트레스 테스트 갤러리를 구축하기 전에 시각적 증명을 읽으십시오. 작은 복사/아이콘 변경은 집중된 증명을 사용할 수 있습니다.
시각적 증명 기본값
외관 변경, 스크린샷, 일시적 상태 캡처 또는 비디오의 경우 시각적 증명을 읽으십시오. 외관 변경은 검사된 전후 증거가 필요합니다. 비시각적 수정에는 동작 단언만으로 충분할 수 있습니다.
상호작용 성능 감사
UI 느림, 응답성 감사 또는 자동 Chrome 트레이스 수집의 경우 빌드, 픽스처 및 측정 경계를 선택하기 전에 상호작용 프로파일링을 읽으십시오.
Run Inspector 증거
실행/수행/의사 결정 증거의 경우 영수증을 선택하기 전에 Run Inspector 캡처를 읽으십시오.
아티팩트
createControlUiE2eArtifactDir(scope, parentDir?)를 사용하여 시도 또는 독립 실행 호출당 한 번 할당하십시오. 디렉터리를 캡처 헬퍼에 전달하고, 별개의 단계 파일 이름과 보고서, 스크린샷, 트레이스, 비디오를 함께 유지하십시오.- 헬퍼가 상위 디렉터리 선택을 소유합니다. 기존 출력 제어, 게이트, 뷰포트, 녹화 옵션을 유지하고, 최종 보고서에서 반환된 경로를 사용하십시오.
- 실패 및 성공적인 시도를 모두 유지하십시오. 검토 후 정확히 소유된 디렉터리만 정리하고, 공유 아티팩트 상위 디렉터리를 지우거나 이전 증거를 덮어쓰지 마십시오.
- 타임아웃 진단은 기존 진단 상위 디렉터리의 새 하위 항목을 사용합니다. Mantis는 모든 시도를 유지합니다. 실제 Gateway,
chat-outbox-*,chat-attachment-read-lifecycle스위트는 별도 소유자가 있습니다. 재생 안전 캡처를 주장하기 전에 보존 동작을 확인하십시오.
집중 테스트 실행
package.json의 현재 스크립트와 테스트 정책을 사용하십시오. 작업 트리의 집중 브라우저 테스트의 경우:
node scripts/run-vitest.mjs run --config test/vitest/vitest.ui-e2e.config.ts --configLoader runner ui/src/e2e/chat-flow.messaging.e2e.test.ts