How to debug Angular JavaScript Code

debugging google-chrome firefox angularjs browser
AskQuestion picture AskQuestion · Sep 13, 2013 · Viewed 173.4k times · Source

I am working on a proof of concept using Angular JavaScript.

How to debug the Angular JavaScript code in different browsers (Firefox and Chrome) ?

Answer

Vaibhav Jain picture Vaibhav Jain · Sep 13, 2013

1. Chrome

For debugging AngularJS in Chrome you can use AngularJS Batarang. (From recent reviews on the plugin it seems like AngularJS Batarang is no longer being maintained. Tested in various versions of Chrome and it does not work.)

Here is the the link for a description and demo: Introduction of Angular JS Batarang

Download Chrome plugin from here: Chrome plugin for debugging AngularJS

You can also use ng-inspect for debugging angular.

2. Firefox

For Firefox with the help of Firebug you can debug the code.

Also use this Firefox Add-Ons: AngScope: Add-ons for Firefox (Not official extension by AngularJS Team)

3. Debugging AngularJS

Check the Link: Debugging AngularJS

Related questions

Breakpoint on property change

Firebug for Firefox has a nice feature, called "Break on property change", where I can mark any property of any object, and it will stop JavaScript execution right before the change. I'm trying to achieve the same in Google Chrome, …

Read More
How do you launch the JavaScript debugger in Google Chrome?

When using Google Chrome, I want to debug some JavaScript code. How can I do that?

Read More
JavaScript: Is there a way to get Chrome to break on all errors?

I am looking for an equivalent in Chrome to the "break on all errors" functionality of Firebug. In the Scripts tab, Chrome has a "pause on all exceptions", but this is not quite the same as breaking on all errors. …

Read More