What is a good Javascript debugging tool?

Question

Haven\'t touch javascript for 3 years. Just got a javascript project and wanted to know any new ways or tools emerged these years to debug javascript? I used alert 3 years

Answer 1

As others have pointed out, most javascript debugging tools come as part of a browser because they are tightly integrated with the Javascript engine itself. This is probably a good thing because you will want to debug each browser separately if you run into a browser-specific quirk.

In the Internet Explorer world, you have two options:

1. As Ryan Lynch pointed out, the Microsoft Script Debugger is a separate debugging environment that talks with IE. If you have Visual Studio Web Developer Edition, the tool should already be available to you. You can attach directly to IE from within VS.
2. Recommended: Use a debugger that runs in the browser. IE8 has Developer Tools built-in (press F12) or download the Web Development Helper for earlier versions. Both provide a good light-weight environment right inside IE. They also help to debug CSS layout and other aspects of a website.

Answer 2

I use firebug most of the time with the following firebug plugins.

• FireRainbow, FireRainbow enables javascript syntax highlighting for Firebug. This is really cool. Saves a lot of time.

• FirePHP,FirePHP enables you to log to your Firebug Console using a simple PHP method call.

• Widerbug, can leverage wide screens for js debugging/development. Obsolete now as it is supported in Firebug 1.9 right out of the box.

Answer 3

I use Javascript Debugger plugin to debug errors that are not easy to figure out in firebug. You can set up break points and step through problem area to see variable values..etc. It's a very useful tool.

Answer 4

For IE (which I don't suggest using), the latest version (IE8) includes developer tools.

For Firefox, there's an extension called Firebug that has DOM manipulation, a JS console, and more.

WebKit (used in Safari and Chrome) has a built-in Web Inspector that includes a JS debugger, along with a DOM outline and manipulation tools, and a JS console.

Answer 5

Firebug for FireFox and AJAX Dynatrace for IE http://ajax.dynatrace.com/pages/

Answer 6

LINE BY LINE JAVASCRIPT DEBUGGING

To get following set of features try any of the below mentioned two methods.

Features:

1. Set and Pause at breakpoints.
2. Step into
3. Step out
4. Step over
5. Watch values at breakpoints pause
6. Toggle breakpoints
7. Continue from paused breakpoints
8. and many more...

Method 1:

9. Google Chrome > Inspect > Sources Tab
10. For detailed help

Method 2:

11. Mozilla Firefox > Inspect Element(Q) > Debugger Tab
12. For detailed help