Q&A: Why cannot I always debug by ASP.NET JavaScript code in Visual Studio 2013?

Most ASP.NET web application today contain JavaScript (or TypeScript for that matter) implementations, and debugging this code becomes a necessity sooner or later. Visual Studio's latest 2013 version contains pretty powerful JavaScript debugging tools, but it isn't perfect yet.

From time to time, I receive questions about JavaScript line-by-line debugging in Visual Studio, and more specifically, why it doesn't work. Here's my quick list on the reasons why debugging might fail:

• You have dynamically generated HTML/JavaScript code in your ASP.NET application page/view. In this case, Visual Studio often cannot locate the correct page at all, and thus will not allow you to debug your JavaScript code. This is especially true when you create JavaScript code on the fly from your backend code.
• You have similar-looking lines of JavaScript code. Visual Studio uses line-by-line string comparisons, so lines that are similar might confuse the logic inside Visual Studio. Tip: you can make lines unique by adding simple comments to them.
• The filenames and/or URLs that you use do not directly map to files on disk. This is true if you have multiple routes to files, you use special characters in URLs (such as the Finnish letters å, ä and ö).
• You use multiple debuggers at the same time. Visual Studio has one, Internet Explorer has one under web developer tools (F12 key), and you could have some third-party tools. Check what you are using, and what the settings in IE are.
• You are using optimizations to compress your JavaScript code files. It’s best to disable optimizations when you want to debug your JavaScript code.

There are also certain other limitations, which are documented nicely on the MSDN page called http://msdn.microsoft.com/en-us/library/bb157684.aspx. Check it out.

Happy debugging!