The Browser Toolbox enables you to debug add-ons and the browser's own JavaScript code rather than just web pages like the normal Toolbox. The Browser Toolbox's context is the whole browser rather than just single page on a single tab.

Note: If you want to debug a specific add-on that is restartless or SDK-based then try the Add-on Debugger. Use the Browser Toolbox for add-ons that are neither.

Enabling the Browser Toolbox

The Browser Toolbox is not enabled by default. To enable it you need to check the settings "Enable chrome and addon debugging" and "Enable remote debugging".

To do this, open the Developer Tools Settings, go to the section "Advanced Settings", and check the settings "Enable browser chrome and add-on debugging toolboxes" and "Enable remote debugging".

Opening the Browser Toolbox

Open the Browser Toolbox through the menu button and the menu items "Developer" then "Browser Toolbox".

You can also open it with the Ctrl + Alt +Shift + I key combination ( Cmd + Opt +Shift + I on a Mac).

You will be presented with a dialog like this (it can be removed by setting the devtools.debugger.prompt-connection property to false):

Click OK, and the Browser Toolbox will open in its own window:

You'll be able to inspect the browser's chrome windows and see, and be able to debug, all the JavaScript files loaded by the browser itself and by any add-ons that are running. Altogether you will have access to the following developer tools:

Debugger (Note: If you want to debug a specific add-on that is restartless or SDK-based then try the Add-on Debugger.)