DevTools 팁: 사용자 플로우 기록 수정, 디버그, 내보내기

Sofia Emelianova
Sofia Emelianova
GitHub

DevTools Recorder 패널을 사용하면 페이지에서 사용자 작업을 캡처하고, 재생, 공유, CI/CD에서 사용할 수 있는 다양한 형식으로 내보낼 수 있습니다.

Recorder 패널은 현재 개발 중이며 최근에 녹음 파일을 수정, 디버그, 내보낼 수 있는 새로운 기능이 추가되었습니다.

Recorder 패널에서 다음을 수행할 수 있습니다.

  • 재생 속도를 늦추고 중단점을 설정하고 일시중지, 다시 시작 또는 한 번에 한 단계씩 실행을 진행합니다.
  • 일시중지된 경우 페이지와 상호작용하거나 추가 검사를 위해 다른 패널로 전환하세요.
  • 녹음기에서 자동으로 캡처하지 않는 단계를 추가합니다. 예를 들어 마우스를 가져가서 녹음을 오염시키는 경우입니다.
  • 제한 시간, 조건, 어설션 추가와 같은 단계를 구성합니다.
  • JSON, @puppeteer/replay 스크립트, Puppeteer 스크립트와 같은 다양한 형식으로 녹음 파일을 내보냅니다.

또한 Recorder 패널에 Chrome 확장 프로그램을 사용하여 더 많은 내보내기 형식을 추가할 수 있습니다. 이 문서를 작성하는 시점에는 Cypress, WebPageTest, Nightwatch, Testing Library, WebdriverIO와 같은 도구의 확장 프로그램을 추가할 수 있습니다. 확장 프로그램의 전체 목록을 확인하세요.

추가 정보: