What are the rights ways of debugging javascript?

Question

I made a function called test() in javascript file.Placed a simple alert into it.

In html file, called the method on click of a button. But,it was not being invoked.

Problem was in the 11th function, nowhere related to mine !!!! But, how can a person making his first javascript function suppose to find that out ???

I am looking for best ways to debug javascript.

Answer 1

You can debug javascript using many modern browsers. See this question for details on how to debug in Google Chrome:

How do you launch the JavaScript debugger in Google Chrome?

Furthermore, you shouldn't use alert() for debugging as this can give different results to a production version due to alert() causing a pause in the script.

It is best practice to use console.log() and view the output in the browsers Console.

You can also put debugger in your javascript code to force a breakpoint. However I prefer not to use this as forgetting to remove this before deployment will cause your script to pause, which can be quite embarrassing!

Answer 2

You should use the debug console provided by the browser.

Chrome has it inbuilt, press CTRL + SHIFT + j. In Firefox, install Firebug plugin.

In your code, add alert() to show flow and get values of variables.

Also, use console.log() which will only output to the debug console.