Debug JavaScript in ASP.NET

Question

I needed to debug my javascript functions written in asp.net.

I am currently using chrome but its not going to the break point. If i put alert('Some message') . I can see message displayed.

If someone has any idea how to use debugger for JavaScript in ASP.NET please let me know.

Answer 1

To Debug in chrome you need to do two things

1. Write debugger the place where you want to start debugging.
2. Before the execution of script open developer tool (by pressing ctrl + shift + i)

Now when control of execution to statement where you wrote debugger the execution is paused for you to debug.

Here is an example for you to learn, Follow the instruction given in comments. How to debug in chrome

Answer 2

Try to debug your code with Internet Explorer, you can do it like this, place the debugger keyword before the code you want debug.

   <script type="text/javascript">
    function s() {
   //enable the debugger feature.
        debugger;
        var alert = "this is a debugger test";
        alert(alert);
    }
   </script>

Answer 3

Visual Studio can only debug Javascript if it's attached to an instance of IE.

You should use Chrome's developer tools, which include a Javascript debugger.

Answer 4

From my experience Visual Studio can't debug Managed Code and JavaScript in the same time.

This mean that when you start an ASP.NET project in debug mode within Visual Studio, it will start web server, attach to it, then IE (or another browser) and attach to it. But JS breakpoint will not be hit.

But when you start a project without debug and attach to IE manually - those breakpoint will be hit.

Answer 5

Use FireBug! It is great! It gives you a little bit more power than traditional debugging. http://getfirebug.com/errors

Status bar error indicator

On the right side of the Firefox browser's status bar you will see a little green icon. This is Firebug's way of telling you that everything is A-Ok. When that icon turns into a red "x", things aren't so peachy.

Click the "x" to open the Firebug error console which will show you all of the errors that have occurred on the page.

No error soup

Most browsers report errors by dumping them all into one big window that includes the problems with every web page you've ever visited. Firebug is kinder than that; it shows you only the errors for the page that you're looking at.

Jump to the debugger

Every error report has a link on its right side that points to the file and line number where the error occurred. Clicking this link will take you right to the Firebug JavaScript debugger or CSS inspector so that you can get started on solving the problem right away.

Some errors also include the actual snippet of source that contains the error, which is also a link to the original file.