What tool do you use for debugging Javascript?

Question

I've notices I'm not capable to debug correctly js. I'm only using alert() as a spread sentences technique but I need something better. So... which tool do you use?

Answer 1

In Firefox, Firebug and its console which provides a panel for debugging along with an object for programmatically evaluating inside of a script, eg

console.log('test')

Safari and the family of Webkit enhanced browsers have built-in inspectors/consoles.

Opera has Dragonfly.

There are several plugins for Internet Explorer, such as DebugBar and IE8 has a pretty neat built-in Developer Toolbar.

If you're on Linux you can even install spidermonkey-bin, which is the interpreter used by Firefox and invoke it with js in the console.

Answer 2

Firebug's a must. I've recently also started to use IE8's inner debugging tool and it's pretty nice as well.

Answer 3

For Firefox Firebug it's the best, has a lot of useful features, the Console API is great, you can log, make assertions, profiling, timing and much more.

For IE, the Developer Tools of IE 8 is better than nothing, for earlier versions of IE, try the Developer Toolbar.

For Chrome and Safari, check the WebKit inspector and debugging tools.

Answer 4

Chrome and IE8 have surprisingly good debugging consoles.

If you use Firefox, you'll need to install Firebug to compete.

Answer 5

For cross-browser logging you could use log4javascript.

Answer 6

Firebug is very good. However, if you are on Windows you should check out the Developer Tools in IE 8. The integrated debugger allows for breakpoints and uses a lot of great elements probably taken from Visual Studio concepts. You have an interactive console, etc. You can get to it using F12.

Answer 7

To track down performance issues:

• Of course there is Firebug with Yahoo's yslow plugin
• Internet Explorer has dynaTrace Ajax (John Resig blogged about it lately).
• Google Chrome now has the Speed Tracer extension.

Answer 8

Firebug lite is also good in a pinch