[firefox] browser debugging

준비물

• windbg
• firefox : https://ftp.mozilla.org/pub/firefox/releases/50.0.2/win32/ko/
• firefox source code : https://ftp.mozilla.org/pub/firefox/releases/50.0.2/source/
• note : firefox와 firefox source code URL의 50.0.2는 Version을 나타냄

사전 준비

1. 준비물의 내용을 전부 다운로드한다.
2. windbg에 symbol 설정
   
   

   SRV*c:\symcache\*http://msdl.microsoft.com/download/symbols;SRV*c:\symcache\*https://symbols.mozilla.org/
    
   reference : https://developer.mozilla.org/en-US/docs/Mozilla/Using_the_Mozilla_symbol_server

3. windbg와 source code 경로 연동 (걍 source code 파일을 하나씩 열면 알아서 추가되긴 함)
   

   

4. firefox debugging (Crash가 발생하면 알아서 잡고 멈춤)
   

   "C:\Program Files\Debugging Tools for Windows (x64)\windbg.exe" -G -g -o "C:\Program Files (x86)\Mozilla Firefox\firefox.exe"

분석

- 브레이크 포인트 걸기 (굳이 xul! 를 안 붙여도 됨)

자바스크립트 객체 주소 확인

  브라우저를 windbg에 붙인 상태로 개발자 도구(F12)를 열면 확인 가능하다. windbg로 붙인 후 개발자 도구를 열 때, 브레이크 포인트가 한 번 걸리는데 windbg command 창에 g를 입력해 넘어가도록 한다.

  개발자 도구가 열리면 상위 항목 - 메모리 - 스냅샷 찍기를 누르면 현재 브라우저에서 사용하고 있는 메모리를 확인할 수 있고, 아래와 같이 나타난다.

  '보기' 콤보박스를 보면 기본적으로 '트리맵'이라고 설정되어 있다. 이를 도미네이터로 변경하면 Garbage Collector로부터 각 객체까지 도달하는 것을 아래와 같이 볼 수 있다. 왼쪽 창에서 사용 크기, 타입 등이 나오기 때문에 이를 이용해 찾으면 된다.

  오른쪽 창의 경우 확대와 끌어서 이동하면서 보는게 가능하니 그걸 이용해 확인해보면 위와 같이 변수 pl이 Array 타입이고, 그 주소가 0xa6ae830인 것을 볼 수 있다. 또한 77번째 객체 요소로 Uint8Array 타입을 가지고 주소는 0xa6fba60인 것도 확인 가능하다. windbg로 실제로 다음과 같이 확인할 수 있다. 

  Array와 Uint8Array 모두 object 타입이며, JSObject를 상속하고 있다. 그래서 JSObject 타입의 구조체(http://tribal1012.tistory.com/227) 맞춰 주소를 따라들어가면 Uint8Array에 채워둔 0x90들을 확인하는 것이 가능하다.

참고 자료

• firefox : https://ftp.mozilla.org/pub/firefox/releases/50.0.2/win32/ko/
• firefox source code : https://ftp.mozilla.org/pub/firefox/releases/50.0.2/source/
• 심볼 설정 : https://developer.mozilla.org/en-US/docs/Mozilla/Using_the_Mozilla_symbol_server