We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

翻譯不完整。請協助 翻譯此英文文件

附加元件除錯工具箱提供 Firefox 工具箱中的部分工具,能在附加元件的作用範圍中除錯:

  • JavaScript 除錯器,可用以設定中斷點,或測試程式執行內部的各種狀態。
  • 主控台,可用以查閱 log 訊息,或者在附加元件的作用範圍中執行 JavaScript
  • 程式碼速記本,可以在附加元件的作用範圍中執行 JavaScript,並另存為新檔

需要重新啟動瀏覽器的 XUL overlay 附加元件無法使用附加元件除錯工具箱,這類的元件請使用瀏覽器工具箱



如欲啟用附加元件除錯工具箱,您必須啟用 Firefox 裡的「啟用瀏覽器 chrome 與附加元件除錯工具箱」及「啟用遠端除錯」兩項設定。您可開啟網頁工具箱裡的設定,而後在「進階設定」一區中啟用上述選項。


註:如前所述,附加元件除錯工具是專供不需重新啟動、以 SDK 製作的附加元件使用。若想為其他類型的附加元件除錯,請使用瀏覽器工具箱裡的工具。

Now open the Add-on Manager. Next to the entry for your add-on you will see a button labeled "Debug". Click this button to launch the debugger.

Next you'll see a dialog asking you to accept an incoming connection. Click "OK", and the debugger will start in a separate window. Note that sometimes the debugger window is hidden by the main Firefox window.


The Add-on Debugger looks and behaves very much like the Browser Toolbox, except that while the scope of the Browser Toolbox is the whole browser, the Add-on Debugger is focused on the specific add-on for which you launched it. Like the Browser Toolbox, a toolbar along the top lets you switch between a number of different tools. In Firefox 31 there's only one such tool, the JavaScript Debugger, but with Firefox 32 you also get the Console and Scratchpad.

JavaScript 除錯器

This behaves just like the normal JavaScript Debugger, except its scope is the add-on rather than a web page. On the left-hand side it lists JavaScript sources:

  • at the top is bootstrap.js: either the one you've written if your add-on is a manually written bootstrapped add-on, or the one included by the SDK if your add-on is an SDK add-on.
  • next, if your add-on is an SDK add-on, you'll find your add-on's main.js, any local modules shipping with your add-on, and any content scripts that are currently loaded
  • next, all the SDK modules used directly or indirectly by your add-on

Content scripts

Content scripts are only listed if and when they are loaded. So, if your Add-on loads a content script with contentScriptFile, the file will not appear in the debugger sources until you go to a page that loads the content script.

If you set a breakpoint in a content script, it will not be active for instances of the content script which are loaded after the breakpoint is set.

For example, suppose you have an add-on that attaches a content script to every tab the user loads. The content script adds a click handler to the page. As soon as you open a tab, this content script will be listed in the debugger. If you then set a breakpoint in the content script's click handler, then execution will pause whenever you click the page. But if you open a new tab, there are now two instances of the content script, and the breakpoint will not be enabled for the second instance You'll need to set a new breakpoint now if you want to it work for the second instance.

We're investigating improvements to this in bug 1016046.


The Console behaves just like the Web Console, but its scope is the add-on rather than the web page.

However, note that it actually runs in the context of the add-on's bootstrap.js, which may not be what you expect if your add-on uses the SDK: you won't see any objects defined in your add-on's main.js, and you won't see require() either. This issue is being tracked as bug 1005193.

You can execute Console statements in the context of main.js while execution is paused inside main.js.


The Scratchpad behaves just like the normal Scratchpad, but its scope is the add-on rather than the web page.

Like the Console, the add-on Scratchpad runs in the context of the add-on's bootstrap.js even if the add-on uses the SDK, and as with the Console you can execute Scratchpad code in the context of main.js while execution is paused inside main.js.

為 chrome: 或 about: 頁面除錯

從 Firefox 37 起,一般的除錯工具已經可以用來為 chrome: 及 about: 兩類頁面除錯,使用方法同一般網頁除錯。


此頁面的貢獻者: BobChao
最近更新: BobChao,