Development Blog

in the FF3 beta cycle, Firebug’s 1.1 command line stopped working. The fix for this became quite involved, eventually requiring both the command line and console to be reimplemented. I’ll describe the console first, maybe the command line next time.
The Firebug ‘console’ allows web developers to append text and objects to Firebug’s Console panel. The new version uses element messaging, meaning an element in the web page is used to pass control flow and values to Firebug. Here is how it works.

When the web page loads but before the first Javascript function can be called, Firebug uses the document.createElement() to attach a script tag to the page. That script adds an invisible div element, _firebugConsole, and the console functions. When the web page developer calls console.log("foo");, the log() function

1. pushes the string "foo" onto the console’s array of user objects,
2. puts the index of the "foo" object into an attribute of the _firebugConsole element, and
3. dispatches event firebugAppendConsole on the element.

All of this is standard DOM operations.

On the Firebug side we’ve added an firebugAppendConsole event listener to the _firebugConsole element. When the event comes in, we just use the attribute of the element to access the user object and write it onto the Firebug Console panel. Firebug accesses the user objects using Firefox’s security wrapper technology to prevent errant web code from entering the extension space.

The current (1.2a13) implementation has one more layer of indirection. The script tag that defines the console isn’t injected on every page load. Instead, a small 5 line getter is defined for the object window.console. The getter loads the console code, thus creating the _firebugConsole element on the first use of the console object.

Thanks to Mike Shaver, Mark Kahn, and Justin Dolske for hints on how to get this to work. If you want to look at the source for the console its here:

• The injected source defining the console
• The Firebug event handler that listens for firebugAppendConsole.
• The console itself

In preparation for Firebug 1.2 beta 1, I analyzed the Firebug bug (aka issues) list. Here is a breakdown, with links to the issue list filtered in various ways.

There are 521 issues, of which 266 are closed and 255 are open. The closed issues include 108 Fixed issues now in Firebug 1.1.0b12. (Yeah!) The other categories are 28 worksForMe, 15 Verified. 56 Invalid, 50 duplicate, and 9 WontFix. The “invalid” category includes reports the reporter wanted to recall, issues we can’t do anything about, and a lot of issues that don’t have enough information to figure out.
Of course the reason to look at the issue list is to understand the open issues. The default view filters the list to show only open issues. Heres how they break down. Of the 255 open issues, 179 are defects and 75 are enhancements. Sometimes this is a bit arbitrary of course.
The 179 defects are

• 31 accepted, meaning we expect Firebug 1.2b1 to fix them,
• 15 lite, unfortunately no one is working on Firebug lite,
• 37 testcase, meaning we think it’s a bug and we have a way to prove if we fix it,
• 40 needTestCase, meaning we think it’s a bug but we don’t know how to prove a fix,
• 56 other, meaning either its isn’t testable or its an issue for Firefox, or…well “other”

During the 1.2 beta we’ll work on the issues marked “testcase”. When the list is empty, we’ll vote to move 1.2 out of beta. Of course during the beta, more issues will enter. On the other hand, some marked “testcase” may move to enhancements because we can’t fix them and keep 1.2 stable.
Finally there are 75 enhancements:

• 13 accepted-enhancements
• 6 new-enhancements-needTestcase,
• 3 new-enhancment-testcase,
• 51 other

Some of these may make into 1.2 if folks contribute patches with test cases. Otherwise maybe 1.3…

Honza has a great new tutorial on extending firebug, starting with a HelloWorld extension and then building up to adding to the toolbar. He includes all the key elements, the chrome file and manifest setup, the UI extension by overlay, and registering your extension with Firebug. On top of all that he has a small UML picture to help put the pieces together. Very readable, check it out.

Back at the end of November some Firebug folks got together to form the Firebug Working Group. We’re just an informal group of engineers who want to sustain and grow the Firebug open source project. We now have firebug 1.1 beta on getfirebug.com and a plan for firebug 1.2 and beyond. Now we have a home page on getfirebug.com to provide links to our agenda and planning discussions. We are listening on the Firebug newsgroup and watching the issues list for input from the user community. If you can contribute to the success of Firebug, please contact someone in the working group.

This release has three small but important fixes:

Issue 450: DOM Browser crashes Firefox

The cause, in my opinion, a design flaw in Javascript. One of the wonderful things about Javascript is the ability to use objects as tables. You can loop over the table easily:
var table = {}; table[”foo”] = bar;
for (name in table) { …
Then you can test for values in the table:
if (name in table) {…
But wait, if you do that test and name just happens to be constructor, then the test will always be true!
So the only reliable way to test the table is:
if (table.hasOwnProperty(name)) { …

Issue 434: Network Monitoring not showing image downloads

This one is deep into Mozilla-tech. The net panel in firebug tries to
analyze downloads using xpcom interfaces.  It uses getInterface() in
one place and when the object is an image, the call fails with an
exception.  Based on my experience with queryInterface() I blindly
added a test in front of the call to getInterface() to test instanceof
on the object. But this test always fails and images don’t show.
Thanks to Honza for bailing me out.

Unreported problem with breakpoints removed then re-added

Found this one while working on firebug 1.2. This is a bug from back
in Oct. 2007, and it could explain many problems with breakpoints. A
global switch was incorrectly set when breakpoints are removed that
allowed the breakpoints to look like they were set but they could
never cause the debugger to stop.

getfirebug.com now has the latest firebug 1.1 beta, b11. This release adds contributed localizations for Turkish and Bulgarian. Otherwise the main news here is that getfirebug.com will now be providing regular updates and, soon, access to early releases of firebug 1.2 and chromebug.

Since September or so, firebug 1.1 betas have been distributed from http:fireclipse.xucia.com. This worked ok for folks reading the Firebug newsgroup because I would keep pointing them over to the beta. But most people get firebug from getfirebug.com. So I got together with Joe and he agreed to distribution of firebug 1.1 and future firebugs from getfirebug.com.

All firebug users owe Kris Zyp at Xucia a big thanks for distributing firebug 1.1 in the early days. Go on over and check out some of the amazing things Kris builds. Thanks Kris!

Since Firebug is just a side-project for me, I’m not able to spend as much time improving it as I would like. Fortunately, someone has come forward and offered to help. I am excited to report that Yahoo! has created a full-time position within the YUI group for a developer to work on Firebug. This is great news for all Firebug users, as it means you can expect to see Firebug moving forward much more quickly in the future.

Yahoo! has been a tremendous supporter of the project, first by giving me the opportunity to speak on their campus and hosting the video of my talk, and now with actual engineering resources. I’m really looking forward to meeting candidates and working with this developer on Firebug 2.0 and beyond.

If you’re interested in the position, contact yui-jobs /at/ yahoo /dash/ inc /dot/ com with examples of your work, preferably working URLs.

About an hour ago I received word of a 0-day security exploit that has been discovered and reported. I have just released a new Firebug (version 1.03) with a fix for this bug, and I recommend that everyone install it as soon as possible.

The update has been published to addons.mozilla.org, so you can get it by updating Firebug from the Firefox Add-ons window. Alternatively, you can install the update using the big orange button on the getfirebug.com home page.

One of the most common questions about Firebug is, “How do I get the source?” I’ve been planning to create a public Subversion repository on getfirebug.com for a long time, but this weekend I decided I’m better off letting someone else be the sysadmin. With that, I’m happy to announce that the [Firebug open source project][] is now live on Google Code. Now you can [browse the source][] without having to crack open the xpi or jar files!

In addition to source control, Google Code provides a simple but capable bug tracking system. I’ve been keeping all bug reports in a little text file, but now I’m starting to enter them on Google Code. If you find a bug in Firebug, I would appreciate if you could search the [Firebug issues][] list first, and if you can’t find it there, enter a new issue.

There is one last thing I could use some help with. If you’re interested in working on Firebug, the first thing you’ll need to do is build the extension’s jar and xpi files. Currently, I use Parakey’s fancy Python-based build system to do this, but we’re not ready to release that yet. It would be easier to just include a little build script along with the source. If you’re into writing shell scripts for Unix or bat files for Windows, this would be an excellent way to help out the project!

[Firebug open source project]: http://code.google.com/p/fbug/
[Firebug issues]: http://code.google.com/p/fbug/issues/list
[browse the source]: http://fbug.googlecode.com/svn/trunk/