Jul
20
Firebug Console: Best (Cross-Browser) Practices
comments (1)
The Firebug plug-in is an essential and unparalleled tool for (web) UI development. If you’re not using it, you should be. But in any case, some of its features can make a lazy (or busy) programmer cause serious problems in other browsers (unless Firebug Lite is installed).
Over the past few years I’ve tried a number of approaches for ensuring that my Firebug console calls don’t cause errors on browsers which either don’t support it or don’t have Firebug installed. A few approaches I’ve used myself are described here.
1. Checking for existence of the console before each call to it
if (typeof console!="undefined" && console.log){ console.log("blah blah"); }
or
if (typeof console!="undefined" && console.dir){ console.dir(someObject); }
While this is a safe way to avoid errors when the Firebug console is unavailable its pretty nasty since we don’t want this code repeated all over the place.
2. Creating dummy console methods when they are not available and using console freely
(function(){
if (!window.console||!console.firebug){
var methods = [
"log", "debug", "info", "warn", "error", "assert",
"dir", "dirxml", "group", "groupEnd", "time", "timeEnd",
"count", "trace", "profile", "profileEnd"
];
window.console = {};
for (var i=0; i<methods.length; i++){
window.console[methods[i]] = function(){};
}
}
})();
Subchild is a blog about web development. It's author is Aleksandar Kolundzija, himself a web developer
for 10++ years, presently a Hacker-in-Residence at betaworks. Prior to betaworks, Alex worked at Google, Meebo,
MLB Advanced Media (MLB.com), Razorfish, and elsewhere.