Tool Roundup for Debugging JavaScript

What techniques (other than alert(message);) do you use to debug JavaScript/jQuery? Give particular attention to browser specific techniques.

Tools

• console.log(message) - alternative to alert(message); (Nirmal)
  • browser-safe call (soslo)
• jsFiddle - demonstrations (Craver)
• BlackBird - writing messages to the screen (Oli)

FireFox

• FireBug (Lite)
• Venkman's JS Debugger Add-in (Zeus)

Chrome

• Built-in development tools (tutorial)
• Firebug Lite (extension)

Safari

• Built-in tools (overview - jsummers) (more information)

Opera

• Dragonfly

Internet Explorer (I had to put it last)

• Dev开发者_运维问答eloper Toolbar
• Firebug Lite
• Adobe BrowserLab (Mickel)
• IETester (Mickel)
• MS Expression Web SuperPreview (Rijpstra)

console is your friend, available by default in newer browsers, and you can add a whole lot of debugging to IE with FireBug Lite.

For other browsers:

• Chrome has developer tools
• Firefox has the excellent Firebug addon

For demonstration/test cases, jsFiddle is also an excellent tool.

If you're concerned about using console.log because not all browsers support this, it's easy to workaround with a couple lines of javascript:

console = console || {};
console.log = console.log || function(){}; //you can change this to do whatever you want, or leave it to just keep js errors from being thrown

I love Blackbird. It's a cross-browser JS logging framework, with support for debug/info/warning/error.

You can display the console at any time with the F2 func key.

http://www.gscottolson.com/blackbirdjs/

If you are looking for an alternative for alert(message);, it is console.log(message);

The requirement is that you need any modern browser or a browser with developer tools installed.

More in testing than debugging domain.

Selenium - for GUI tests

JSUnit - for unit testing

The Chrome Developer Tools are a direct descendant of the Safari (WebKit) Developer Tools.

Refer to question for roundup of all answers.