브라우저가 알려주지 않는 67가지 이상한 디버깅 트릭
글 링크: https://github.com/yeonjuan/dev-blog/blob/master/Browser/browser-debugging-tricks.md
소개
이 글에서는 브라우저에서 사용할 수 있는 여러 가지 유용한 디버깅 트릭을 소개합니다. 어느 정도 디버깅에 익숙하신 분들을 위한 글로 기본적인 사용법을 다루지는 않습니다. “이럴 땐 어떻게 디버깅하지?“라는 생각이 들 때 이 글을 찾아보면 도움이 될 것 같습니다.
목차
조건부 중단점 고급 활용법
로그 지점 / 추적 지점
감시 창(Watch Pane)
호출 스택 추적
프로그램 동작 변경하기
빠르고 간단한 성능 프로파일링
함수의 항수(Arity) 활용
인자 갯수로 중단
항수 불일치로 중단
시간 활용
페이지 로드 스킵
N 초 스킵
CSS 활용
짝수 호출만
랜덤 중단
절대 중단시키지 않기
자동 인스턴스 ID
프로그래밍 토글
monitor() class 호출
특정 인스턴스에서
함수 호출 및 디버깅
URL 변경시 실행 일시 중지
프로퍼티 읽기 디버깅
copy() 활용
HTML/CSS 디버깅
JS 비활성화 상태에서 DOM 검사
찾기 어려운 요소 검사
DOM 스냅샷 기록
포커싱된 요소 모니터링
볼드 요소 찾기
하위 요소만
현재 선택된 요소 참조
이전 요소
이벤트 리스너 가져오기
요소에 대한 이벤트 모니터링