Archive for the 'Firebug extension' Category

FireClosure – JavaScript Closure Inspector

Wednesday, November 7th, 2012

FireClosure is one of the Firebug extensions that should certainly deserve more attention. It’s nicely integrated within the existing Firebug UI (we are actually thinking of building the extension directly into Firebug) and its purpose is to inspect JavaScript closures.

Author of the extension is Simon Lindholm.



First of all, let’s see a simple example:

var PersonFactory = function(name, age)
    return {
        getName: function() { return name; },
        getAge: function() { return age; },

var person = PersonFactory("Bob", 58);

Now, let’s imagine we want to inspect the person object. It’s actually not that simple since the object doesn’t have any properties. It has only two functions that are using a closure and accessing variables (arguments) passed into the PersonFactory function.

So, we can’t execute the following expression on Firebug Command line: <- DOES NOT WORK

However, if you have FireClosure installed, you can use the following syntax:


Optionally, FireClosure integrates also with the DOM panel, see the next screenshot.

There is a new section (scoped variables) that is displaying all the local variables in the closure.
Finally, you can also use the Watch side panel to inspect closures.

Note that the syntax is also available in watches and breakpoint condition editors.


  • Firefox often optimizes away closures or variables. For debugging, you can temporarily add some evals around the relevant places in the code to make this less of a problem (also makes your code less performant).
  • Some objects might have unexpected scopes. This is because non-function objects don't actually have scopes in the first place; the functionality is faked by using the first property with typeof === 'function' that appears on the object.



We are keen to get feedback for this feature, please let us know what you think.

  • Is there anything we could improve?
  • Do you like the syntax extension .%?
  • Should we build the feature directly into Firebug?


Please post feedback in the newsgroup, thanks!

Jan 'Honza' Odvarko


Firediff 1.0

Monday, March 22nd, 2010

In case you missed it, Kevin Decker has released Firediff 1.0, a change tracker for Firebug:

Lots of new features:

  • Revert Changes
  • Save Snapshot
  • Save Diff
  • Document Formatters
  • Search
  • Activation Data Handling Improvements
  • Style attribute change handling

More details on his Web site.


Please post comments on the newsgroup.