Debugging JavaScript with Visual Studio in an ASP.NET MVC 4 application

By rickvdbosch
December 19, 2012

When debugging JavaScript in an ASP.NET MVC (4) application, it is not always enough to uncheck the ‘Disable script debugging’ checkboxes under ‘Tools’ – ‘Internet Options’ – ‘Advanced’ – ‘Browsing’. JavaScript inside a Razor view (a cshtml file) cannot be debugged from Visual Studio. To debug your JavaScript, move it to a separate .js file and link to that file from your Razor view. This way, breakpoints set in the JavaScript will be hit and you can debug from Visual Studio.

Hope this helps


Disclaimer: I know about the F12 Developer Tools, Firebug and all the other possibilities we have to debug JavaScript. This post is about getting JavaScript debugging to work with Visual Studio and breakpoints set in Visual Studio. For those who want it that way. So there… ;)

Comments: 3

  1. Ivan Samuelson says:

    There IS a way to debug Javascript inside a razor view. After hitting F5, navigate to the page with the javascript in it. Look in Solution Explorer and you should see a node called “Script Documents”. Below that should be the view you are currently on. Double click on it and it will bring up the current view in an edit window. Scroll to the javascript you wish to debug and put in your break points. The issue with this is, any scripts that may have already fired off cannot be debugged unless you navigate away from the page and come back to it. Also, break points won’t be saved once you exit out of debug mode. You’ll have to reset them all over again. However, this does help debug your Javascript in a RAZOR view. Found this one out by searching around the internet and wanted to share.

  2. Angie Menegay says:

    Thanks for sharing the tip!

  3. Kanjalochana says:

    Thanks Ivan Samuelson & rickvdbosch. It was really really helpful!

please leave a Reply to join the discussion...

  • Meta