Debug JavaScript in ASP.NET

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.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 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

Method 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>

Method 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.

Method 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.

Method 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.

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0