ProofShot - 시각적 검증 워크플로우은(는) 무엇을 하나요?
ProofShot은 오픈소스이며 에이전트에 종속되지 않는 CLI 도구로, 실제 브라우저에서 작업 결과를 검증할 수 있게 해줍니다. 비디오 증거, 스크린샷, 오류 보고서를 제공하며 특정 업체에 종속되지 않습니다.
사용 시기
ProofShot은 다음과 같은 경우에 사용합니다:
- 새로운 UI 기능 또는 페이지를 빌드한 후
- 기존 UI 구성 요소를 수정한 후
- 시각적 버그를 수정한 후
- 사용자에게 보이는 모든 변경 사항에 대해
워크플로우 (항상 다음 3단계를 따르세요)
1단계: 세션 시작
proofshot start --run "your-dev-command" --port PORT --description "검증할 내용"
브라우저가 열리고 녹화가 시작됩니다. 포트가 이미 사용 중인 경우 proofshot이 기존 프로세스를 자동으로 종료합니다.
항상 --run을 사용하여 proofshot이 개발 서버 출력을 시작하고 캡처하도록 하세요(서버 로그가 증명 보고서에 표시됩니다).
서버가 사용자나 다른 프로세스에 의해 명시적으로 시작된 경우에만 --run을 생략하세요. 그렇지 않으면 서버 로그가 캡처되지 않습니다.
이전 세션이 정상적으로 중단되지 않은 경우, --force를 추가하여 덮어씁니다.
2단계: 브라우저 조작 및 테스트
proofshot exec를 사용하여 탐색, 상호작용 및 검증을 수행합니다:
proofshot exec snapshot -i # 상호작용 요소 확인
proofshot exec open http://localhost:PORT/page # 페이지 탐색
proofshot exec click @e3 # 버튼 클릭
proofshot exec fill @e2 "[email protected]" # 양식 필드 입력
proofshot exec screenshot step-NAME.png # 주요 순간 캡처
중요한 순간에 스크린샷을 찍으세요. 이것이 시각적 증거가 됩니다. 스냅샷 출력을 읽어 예상한 내용을 확인하세요.
3단계: 중단 및 증거 번들 생성
proofshot stop
녹화를 중단하고, 콘솔 및 서버 오류를 수집하며, 비디오, 스크린샷, 오류 보고서가 포함된 SUMMARY.md를 생성합니다.
4단계(선택 사항): PR에 증거 게시
proofshot pr # 현재 브랜치에서 PR 자동 감지
proofshot pr 42 # 특정 PR 번호 지정
스크린샷과 비디오를 GitHub에 업로드하고 PR에 포맷된 댓글을 게시합니다. 기본적으로 proofshot-artifacts 브랜치의 공식 GitHub contents API를 사용합니다. GitHub 첨부 파일 URL을 원하는 경우 --upload-provider github-web-attachments를 사용하세요.
팁
- 사람이 무엇을 테스트했는지 알 수 있도록 항상 의미 있는 --description을 포함하세요
- 주요 작업 전후에 스크린샷을 찍으세요(예: 양식 제출 전, 리디렉션 후)
- 검증 중 오류를 발견하면 수정하고 워크플로우를 다시 실행하세요
- 중단 후
proofshot pr을 사용하여 증거를 풀 리퀘스트에 직접 첨부하세요