Firefox Add-on Debugging

Last night Dan and I popped into #fx-team wondering how we’re supposed to go about debugging our add-ons. There are several articles on the MDN on this topic, but we weren’t having much luck with them. It turns out that’s partially related to a bug in which loading browser chrome and add-on code in the normal debugger doesn’t work. Apparently it worked a couple weeks ago, and the devs expect it to work properly again tomorrow or the day afterward. But what are we supposed to do for the next two days?

Gijs directed us to a number of alternative solutions in addition to the standard method (which he later pointed out is affected by the above bug). To see the output of some quick and dirty console.log() statements in the add-on code, it turns out you can press Ctrl+Shift+J to open up the Browser Console. Note that this is very different from the normal debug console. I had no idea this thing existed. So I popped this open and ran the following code from my main.js file:

var bz_client = require("./bz.js/bz.js").BugzillaClient;console.log(bz_client);

To which the Browser Console responded:

14:25:44.638 undefined main.js:8

Awesome!

In addition, he linked me to the DOM Inspector Add-on. The add-on gives you the ability to inspect every bit of the browser with an interface similar to that of the main devtools Inspector. This includes the browser chrome and our add-ons! Now we can go about breaking things properly.

Advertisements

~ by slenkeri on September 18, 2013.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: