팝업창에서 수행되는 작업을 추적해야 하는데 완료 후 자동으로 팝업이 닫히는 작업인 경우 난감합니다.

이럴 때는 윈도우의 닫기 이벤트에 브레이크 포인트를 겁니다.

팝업창에서 개발자 도구를 띄운 후, source 탭에서 화면 우측에 있는 Event Listener Breakpoints에서 window > close 이벤트를 체크하면 됩니다.

EOF

웹 개발을 하다 보면 서버와의 통신을 기록하고 이를 나중에 참고해야 할 때가 있는데요. 이럴 때 유용한 기능이 Chrome DevTools에 있습니다.

Network 패널을 열고 통신을 기록한 행을 우클릭하면 "Save as HAR with content" 메뉴가 있습니다. 이를 클릭하면 HAR(HTTP Archive) 형식으로 패널 안의 전체 통신 내역을 저장할 수가 있습니다.

이렇게 저장한 HAR 파일은 크롬 확장인 HTTP Archive Viewer를 이용해서 나중에 다시 볼 수 있습니다. HTTP Acrhive Viewer의 Load 탭에서 HAR 파일을 열면 됩니다.

네트워크 패널의 활용법은 아래 링크를 참고하세요.

리소스 로드 시간 측정

EOF