The Browser Content Toolbox is only available if you're running Firefox in multiprocess mode.
Opening the Browser Content Toolbox
To open the Browser Content Toolbox, you'll need to:
- have multiprocess Firefox enabled: open the "Preferences" page, select "Enable E10S (multi-process)", and restart.
- enable the "chrome and add-on debugging" and "remote debugging" options in the Firefox Developer Toolbox Options
You should now see an item labeled "Browser Content Toolbox" in the Developer submenu in the Firefox Menu (or Tools menu if you display the menu bar or are on OS X). It opens in a separate window:
If you've used the Firefox Developer Tools before, this should look pretty familiar.
Along the top is a row of tabs that you can use to switch the active tool. Currently, we only support the Console, the Debugger, and Scratchpad in the Browser Content Toolbox. At the right of this row are three buttons that activate the split console, open settings, and close the toolbox.
The rest of the toolbox is taken up with the tool you've currently selected.
The Debugger lists all the scripts that are loaded into the content process. You'll find your frame scripts listed under the chrome:// URL you registered for them:
You can set breakpoints, of course, and do all the other things supported by the debugger.
The Console logs output from your frame scripts. You can access an array of globals for each tab in the content process using the
tabs getter e.g. to get the nodePrincipal of an element in the first-opened tab of the content process:
- Set a breakpoint in your frame script.
- When you hit the breakpoint, switch to the Console, or activate the split console by pressing "Escape".
Now the console's scope is your frame script's scope, and you can interact directly with it: