# 調試 這個指南會向您介紹如何使用Chromium的內建開發工具進行應用（擴展）調試。 ## 查看應用（擴展）信息 1.加載Hello World應用（擴展）。如果這個應用（擴展）正在運行中，你將在瀏覽器右邊的地址欄上看到Hello World的圖標。 如果這個應用（擴展）并未運行，你可以找到應用（擴展）文件，并且加載它們。如果你沒有應用（擴展）文件，可以在這里下載它的zip文件，然后按創建擴展范例的方法加載它。 2.前往擴展頁，地址 chrome://extensions，確認這個頁面在開發者模式下。 3.查看Hello World應用（擴展）的信息，你能看到應用（擴展）的名稱、描述、應用（擴展）ID。 ## 觀察popup頁面 1.前往擴展頁，地址 chrome://extensions，確認這個頁面在開發者模式下，擴展頁并不需要被打開，只要瀏覽器記住了這個設置即可。 2.右鍵點擊Hello World 圖標 ，然后選擇“審查彈出內容”菜單項，popup.html將會被顯示在開發工具窗口中。 3.如果腳本按鈕沒有被選中了，點擊它。  4.點擊控制臺按鈕 ，（在開發者窗口的左下角，第二個按鈕就是）這樣你可以即看到代碼，又看到控制臺。 ## 使用調試器 1.搜索”img.src”，然后在這個位置設置斷點，只要在行號上單擊即可設置。（比如：37行）。  2.確認你能看到popup.html標簽，它將顯示20個“hello world”圖片。 3.在控制臺上，重新加載這個頁面。命令：location.reload(true); > location.reload(true) 4.在工具窗口的右上方，你能看到局部變量。在這個例子中，它會顯示出所有當前范圍所見的變量。例如：在下面的屏幕截圖上，變量i=0，photos則列出了一部分的Element列表。實際上，它包含了20個元素，每個代表一個圖片。  5.點擊play/pause按鈕 （在開發者工具窗口的上右方）做一次圖像處理循環，每次你點擊這個按鈕，i會加1，popup頁面會顯示更多另外的圖標，當i是10的時候，popup頁看起來像如下圖所示：  6.點擊play/pause按鈕后面的的按鈕，可以步進到函數調用的上層，為了讓頁面完成加載，點擊之前的第37行，禁用之前設置的斷點，接著按下play/pause按鈕繼續執行。 ## 總結 這個指南示范了簡單的應用（擴展）調試，總結一下： 1.在擴展管理頁面上(chrome://extensions)，找到應用（擴展）ID; 2.查看應用（擴展）中的文件，使用類似這樣的格式訪問 chrome-extension://extensionId/filename 3.使用開發者工具設置腳本斷點，單步調試，查看變量 4.使用控制臺命令 location.reload(true)來重新加載當前的調試頁面