Firebug 1.12 alpha 1
Friday, January 11th, 2013getfirebug.com has Firebug 1.12a1
Firebug 1.12a1 fixes 17 issues
Firebug 1.12a1 is compatible with Firefox 18-21
This version integrates FireClosure inspector and introduces new Closure Inspector feature.
Closure Inspector
Close Inspector feature is nicely integrated within Firebug UI and can be used to inspect JavaScript closures. Let’s see a few examples demonstrating how to use it.
In order to inspect JS closures in the DOM panel, you need to check Show Closures option.
Example 1
The first example shows a simple function MyFunc that is using one variable a from a closure.
(function () {
var a = 1;
window.myFunc = function MyFunc() {
return a;
};
})();
And this is what you can see in the DOM panel.
The variable is not direct property of myFunc and so you need to expand (closures) to see it.
Example 2
The next example shows another closure with two variables closed over.
function getSumFunc(a, b) {
return function() {
return a + b;
}
}
var sum = getSumFunc(1, 2);
The DOM panel displays following:
That’s what we would expect so, let’s see how to inspect the same closure in the Console panel.
If your type sum.% you’ll get access to closure variables and there is even a popup suggesting what variables are available.
Example 3
JavaScript closures can be nested and compose a tree of closures. Let’s see how the DOM panel cope with such scenario.
First, here are two nested closures, each defining one variable.
(function(a) {
var a = 1;
(function() {
var b = 2;
window.sum = function Func() { return a + b; };
})();
})();
And here is what you can observe in the DOM panel.
This feature is in its alpha phase, but we are thinking about including it into the current Firebug 1.11 so, please post feedback in the newsgroup, thanks!
Jan ‘Honza’ Odvarko
