The feature is still experimental and we need your help to make it shippable. To use it you need to turn on two options. Open the developer tools, go to the settings and enable chrome debugging and remote debugging. Once they are on you can find debug buttons for add-ons in the Add-ons Manager. We support debugging any restartless add-on, older style add-ons won’t be supported for now. We want to focus on making the experience as awesome as possible for the newer style.
When the debugger opens you’ll see a list of all the scripts from your add-on that are currently in use. If your add-on uses the Add-on SDK then the modules you use will show up in their own section as well. As you might expect you can set breakpoints and step through code. You won’t see all of your code immediately, only scripts that are in use. When new code is loaded it should show up. We’ve put together a short screencast showing enabling the debugger and a few things you can do with it:
Many thanks to our intern on the SDK team last year, Mike Hordecki, for doing the bulk of this work assisted by Eddy Bruel. Also thanks to Jordan Santell for getting it landed.
As I said we need your help to make this better. Please file bugs anywhere you see problems, either scripts not appearing in the debugger that you expect to be there or being unable to use the debugger properly. For now the debugger is the only part of the toolbox that you’ll see. In the future we want to add an add-on specific console as well as start showing the other developer tools where they make sense for add-on developers. Let us know what you want to see either in comments here or by filing bug reports in the Firefox Developer Tools Debugger component.