Archive for April, 2009

StatusBar Icon in Firebug 1.4a23

Wednesday, April 29th, 2009

Firebug 1.4.0a23 is out.  It includes couple of additions to the status bar icon context menu.

status bar context menuHere’s the full line up now:

  • Open Firebug in New Window. aka ‘detach’. as before.
  • Clear Console. Well it’s been there since 1.o…
  • Reset All Firebug Options. Changes all of the Firebug options back to their default values. We use this in testing Firebug, so it may help you if something odd is happening. BTW, no confirm on this one. I’d like to have a confirm window that listed all of the options. Someday.
  • Enable All Panels. Enables Console, Script, and Net panels. Extensions could use it too. Does not reload the page.
  • Disable All Panels. opposite of enable.
  • Off for all web pages. Closes all Firebug instances, erases all memory of which pages had Firebug open in the past. Also used for testing; also wish it had a confirm.
  • On for all web pages. Opens Firebug on all pages; does not use the page-annotation for remembering which pages are open.
  • Minimized: the list of pages with Firebug active but minimized. Clicking on an entry will select that tab and restore Firebug into the browser.

status bar tooltip
To go with the new Context menu is a new Tooltip. As before the Firebug version is available here. Also the activation status of the panels. If all three panels are off, the Firebug icon should be gray. Otherwise it should be orange (as before). Then the number of detached (none in this case), minimized, and total Firebug web pages are shown. The number of minimized pages should match the list in the context menu.

Please post follow-ups to the newsgroup.


Minimizing Firebug 1.4a22

Tuesday, April 28th, 2009

We are very close to the end of Firebug 1.4 features. I am just adding a few more to deal with problems raised by users of the some new features.

Now on the upper right hand menu will be a new button, a down arrow to mean “Minimize Firebug”. introducingminimizebutton Use this when you want the Firebug UI out of the way but not off on the page.  The up arrow continues to mean detach Firebug into a standalone window, but you can also think of it as “Maximize Firebug”, since mostly folks use it to get more screen size for Firebug. The [x] means “Close Firebug” as  always, but now this button has more importance: from now on in 1.4 this is the way to close Firebug on a page.

Did you catch that: The red [x] is the way to close Firebug on a page.

The reason to pay special attention is that we are also changing the behavior of the Firebug status icon button: when Firebug is open, the button will minimize rather than close Firebug. This is similar to older versions of Firebug, so it will only be a surprise for folks who use the alpha versions of 1.4.

If you start with Firebug closed, the status icon will be grey: greybug If you click it, Firebug will open and (if you have the panels enabled) the icon will be orange:orangebug Another click on the status bar icon will minimize Firebug; the icon will remain orange since Firebug is still running.  More clicks will alternate between restoring the Firebug UI and minimizing it.

The description is a bit long winded and I’m not a fan of context-dependent UI operations, but this sequence is what Firebug users expect, especially designers who actually want to look at the web page, go figure.


Please follow up with comments in the newsgroup.

Firebug 1.4 marks getters

Saturday, April 18th, 2009

Since we already had a bug report about this, I guess I better mention that Firebug 1.4 marks properties that are implemented with getter functions by prefixing the property name with ‘get’:


Soon we hope have a context menu item to link to the function definition.


Firebug 1.4a19 and Auto update

Thursday, April 16th, 2009 has Firebug 1.4.0a19.  Some small but important fixes from 1.4a18.

If you have 1.4a13, 1.4a14, 1.4a15, or 1.4a16 you will not automatically upgrade to new versions. Around a13 we had a syntax error in our install.rdf. The install worked but update did not (go figure).  You have to reinstall firebug to get the newest version.After that auto-upgrade should be working again.

I just checked and 1.4a18 did upgrade to 1.4a19, so this problem is fixed.


Firebug 1.4a18

Wednesday, April 15th, 2009

Lots of new stuff landed in Firebug 1.4a18:

  • Curtis Bartley’s Tabs on On Top
  • Han Hillen’s Accessibility and Key Rebinding,
  • Kevin Decker’s multi panel search, and
  • Jan ‘Honza’ Odvarko’s continually amazing Net panel.

The new UI layout has one more surprise: the Inspect button is an icon:


Curtis assures me that the thing between the Firebug menu icon and my beautiful, custom-designed pause button is a flashlight, not an incoming ICBM. (Ok, the two bar thing means break -on-next, kinda like pause right?). Anyway if some has better artwork to offer under BSD for these icons, please don’t be shy.


Internals: FirebugChrome

Saturday, April 11th, 2009

I’m working to create a functional test for Firebug’s Open-In-New-Window feature and then to get the feature to work again. In the process I think I’ve finally decoded how this feature works.

Here is the critical bit: Every Firebug window has a different copy of FirebugChrome, but they all share the same copy of the Firebug and FBL objects.

If you’ve looked through the Firebug source you should be familiar with the modules (controllers) and panels (views). You will also know the ubiquitous Firebug global object that holds everything together, the ‘context’ for each web page, and the utility code like lib.js and domplate.js.

You will also have encountered FirebugChrome, but (if you are like me) its role seems a bit puzzling. It seems to be most–but curiously not all–of global UI related code. Now that I am deep into the open in new window feature, I can understand: it holds just the code to run the Firebug window UI, whether that UI is in the browser or in a separate window.

When you open Firebug in a new window you already have one copy of FirebugChrome in the Firefox window. This object manages the various bit of the Firebug ‘chrome‘: the XUL overlays (browserOverlay.js and firebugOverlay.js), the XBL (bindings.xml), and all of the CSS. In the scope of the new Firebug window, a newly created FirebugChrome manages the chrome in the window. This window is of course not Firefox (browser.xul) but simple window defined in firebug.xul.

That is not so surprising, but the next step is: immediately the newly created FirebugChrome sets the global Firebug and FBL objects to point back into the original Firefox window. So all of the modules, panels, reps, and the context management code in Firebug are shared across the windows, but the FirebugChrome is unique to each window. This is how Firebug can ‘detach’ and ‘reattach’ to the browser: the metadata is shared and never has to moved or synchronized between windows. (This is also why you almost never see window global object used in Firebug).

One function shows the special role of FirebugChrome more than any other: setFirebugContext(context). This function (renamed in v1.4 from showContext()) simply sets the global FirebugContext object to the argument context. Beneath the simplicity lies the clues to how Open-In-New-Window works. Consider the call from a Firebug method:;

Here browser is essentially Firefox tab. Hanging off the tab is a reference, chrome, to the FirebugChrome object managing the Firebug window for the tab. If Firebug is open in Firefox, then chrome points to FirebugChrome in Firefox. But if Firebug is open in a new window, chrome points to a different FirebugChrome, the one managing the firebug.xul window. So when we execute setFirebugContext() we cross from the global object Firebug into the window-specific object FirebugChrome and then we set a global object, FirebugContext to one of the context objects. That’s how we get two different values for FirebugContext, one in Firefox and one the new Firebug window. Got it?