views:

776

answers:

9

I use Firebug's console.log() for debugging my website. If I try viewing my website in browsers without Firebug then I get a console is not defined error. Is there a way to gracefully avoid this error?

I found this potential solution, but it seems a bit cumbersome. And ideas?

+2  A: 

I don't think it gets much better than the workaround you link to. It's of course possible to melt it down to just defining console.log() and leave off rest, but in essence, you won't get around a construct like this.

Only alternative that comes to mind is checking for console.log every time you call it, and that's even more cumbersome.

Pekka
+3  A: 

The linked solution is basically a variant(with a few extra functions) of this:

EDIT The below code doesn't actually work when firefox is present. That'll teach for posting code without checking just to show off my not so 1337 operator || skillz:

window.console = window.console || {};
console.log = function(){};

The reason for that is that firefox console is actually a getter only property off window. Hence we can't set it. Instead, something like this needs to be used:

if (!window.console) {
  window.console = {};
  window.console.log = function(){};
}

Also, console.log (and console.warn, console.error) will work on Webkit browsers, including mobile Safari, pretty cool, huh?

Igor Zevaka
that also produces the "console is not defined" error
Plumo
Of couse it does, thanks. I ll edit the code.
Igor Zevaka
A: 

Off the top of my head:

if(!console)
{
     console = {};
     console.log = function() { };
}
JoshJordan
that also produces the "console is not defined" error
Plumo
+2  A: 

Honestly, I'd use that. It not only covers console.log(), but also every other console method, and in a decently short number of lines. The fact that it was first used in the Yahoo media player seems to suggest that it works excellently cross-browser, as well.

That bit of code is your best bet, is actually decently elegant, and should work in most every case. As long as you comment above the snippet just what it is for (so as not to confuse future developers), you should be fine.

Matchu
A: 

My final solution:

if(!("console" in window)) 
    window.console = {log: function() {}};
Plumo
+7  A: 

Firebug source code provides a file to do this :

See firebugx.js

Do not reinvent the wheel every day :)

OcuS
This is actually a really good solution, especially if you use the other functions like `warn` and `error`.
Igor Zevaka
Link failed for me. I think this is the same:http://code.google.com/p/fbug/source/browse/branches/firebug1.5/lite/firebugx.js
Matthew S
+1  A: 

The solution of @OcuS is sure the best, but you can enhance it with mine: Check this way to log to FF Console: http://stackoverflow.com/questions/783661/log-to-firefox-error-console-from-javascript/2058520#2058520

Then add to the firebugx.js this 3 lines inside IF:

window.console['error'] = li
window.console['warn'] = li
window.console['debug'] = li

So you will see the log of every console error, warn and debug even when the Firebug is closed

Fabiano PS
+3  A: 

I always create my cross-browser wrappers for console.log alike functions and it looks like this:

function log(a){
try{
  console.log(a);
  }catch(er){
   try{
     window.opera.postError(a);
     }catch(er){
     //no console avaliable. put 
     //alert(a) here or write to a document node or just ignore
     }
  }

}

It can be extended for any browsers. in IE when in debug I'd recommend putting this jquery code in last catch:

$('body').append('<pre>'+JSON.serialize(a)+'</pre>');

You must add JSON.serialize to Your script. IE doesn't have it (IE8 might have, I'm not sure)

naugtur
+1  A: 

You can use this code to check if console object exists

if('console' in window && 'log' in window.console)
{
    // code using console.log here
}

Or this code

if(typeof window.console != 'undefined'
&& typeof window.console.log != 'undefined')
{
    // code using console.log here
}

Also you can read this post http://alexandershapovalov.com/firebug-console-is-not-defined-60/ Inside the post link how to create jQuery wrapper for console

Alexander Shapovalov