Remote Debugging the Browser toolbox
One of the coolest technical aspects of Firefox’s UI is that it is written in HTML/CSS/JS. Considering, it’s age it was literally the biggest bet on the web.
Another amazing aspect is that we’ve re-purposed the firefox’s devtools to debug the Firefox! It’s affectionately called the browser toolbox.
For most cases this works well, but if you’re working on dev tools… then it is common to break devtools and not have anything to help you fix it because well, you broke your own tool!
@bgrins came up with two scripts that help. The first launches the browser toolbox in a separate nightly process.
browser-toolbox-run.sh
# Start a normal instance with the debugger server running
./mach run --start-debugger-server 6081
sleep 2
# Run the Browser Toolbox instance
MOZ_BROWSER_TOOLBOX_PORT=6081 /Applications/FirefoxNightly.app/Contents/MacOS/firefox-bin --profile /tmp/foobar -chrome chrome://devtools/content/framework/toolbox-process-window.html --purgecaches --jsconsole
And lets say that you want to debug the browser toolbox itself. This is crazy, but you might just be that crazy, who knows. That is also possible as well.
debug-browser-toolbox.sh
./mach run --start-debugger-server 6081 &
sleep 2
MOZ_BROWSER_TOOLBOX_PORT=6081 ./mach run --temp-profile -chrome chrome://devtools/content/framework/toolbox-process-window.html --purgecaches --start-debugger-server 6082 &
sleep 2
MOZ_BROWSER_TOOLBOX_PORT=6082 /Applications/FirefoxNightly.app/Contents/MacOS/firefox-bin --temp-profile -chrome chrome://devtools/content/framework/toolbox-process-window.html --purgecaches