Testcafe로 작성된 UI 테스트 디버깅

Testcafe로 작성된 UI 테스트 디버깅

갱신:

또 다른 버그(해머헤드)에 대해서는 테스트카페 테스트에서 미니코드를 사용해야만 했습니다.이 버그가 해결되었기 때문에, 기밀이 아닌 코드에 대해서 테스트를 실행할 수 있게 되었습니다.

그러나 소스 맵이 test cafe에 의해 삭제되는 문제가 있습니다.webpack dev 서버를 정상적으로 실행하면 모든 소스 맵이 표시되며 중단점을 설정하고 응용 프로그램코드를 디버깅할 수 있습니다.

그러나 테스트 중에는 소스 맵을 더 이상 사용할 수 없습니다.첨부한 스크린샷을 보시면 2개의 케이스를 보실 수 있습니다.

우리가 뭐 잘못하고 있는 거야?

Testcafe 미포함 이미지

테스트 카페가 있는 이미지

---

프로젝트에는 Testcafe + Webpack + Vue.js를 사용하고 있습니다.테스트 코드는 t.debug() 디렉티브 또는 node.js의 --inspect 플래그를 사용하여 디버깅할 수 있습니다.

다만, 실제로는 디버깅할 수 없는 제품 코드(build.js)만이 보입니다.test cafe가 번들 코드를 사용하지 않고 원래 소스 코드(source maps?)를 사용하도록 설정할 수 있는지 궁금합니다.사용하고 있다source-map웹 팩의 devtool 옵션으로 지정합니다.

UI 테스트에서 생산 코드를 테스트해야 한다는 것은 알고 있습니다만, 개발 중에 이러한 구성을 가지고 있으면 좋을 것 같습니다.좋은 생각 있어요?

Testcafe는 클라이언트스크립트에서 소스 맵 선언을 드롭합니다.유감스럽게도 현재 소스 맵메커니즘을 사용하여 클라이언트스크립트를 디버깅할 수 없습니다.이 제안서를 작성했습니다.Github에서 이 문제를 추적하여 진행 상황을 확인할 수 있습니다.

언급URL : https://stackoverflow.com/questions/46037322/debugging-ui-tests-written-with-testcafe