Beyond Web Logs

With Visual Studio, you can debug ASP.NET applications using the integrated debugger. To take advantage of the Visual Studio debugger, ASP.NET applications must run in debug mode. The compilation mode can be set by modifying the web.config file of the website accordingly.
Visual Studio also lets you debug script files loaded by the browser at runtime. First, let’s see how to configure IE for web-page debugging. Then, we’ll explain how to set breakpoints in JavaScript files through the Script Explorer window.

To enable script debugging in IE, open the Internet Options dialog and ensure that the following items are deselected:

• Disable Script Debugging (Internet Explorer)
• Disable Script Debugging (Other)

Following figure shows the Internet Options dialog in IE 7, but the same settings apply to IE 6.

 
Once script debugging is enabled in IE, you can set up the Visual Studio environment. Let’s see how this is
done.

Normally, the client code loaded in a web page is contained both in script tags in the page as well as in separate
files loaded by the browser. Visual Studio doesn’t permit you to set breakpoints in the JavaScript code contained in an ASPX page. But setting breakpoints in separate script files (for example, JavaScript files with the .js extension) sometimes result in errors being raised by the Visual Studio debugger. Let’s see what you can do to work around these limitations. To set breakpoints in the JavaScript code contained in an ASPX page, you must break into the debugger at a specific location in the code. You can do this by adding a statement with the debugger keyword at the specific location:

debugger;

The debugger keyword stops the execution of the program and enters the Visual Studio debugger. In the debugger, a new tab opens with the source code of the page you’re currently browsing. Now, you can set breakpoints in the source code tab. Once you’ve set breakpoints, you need to reload the page in the browser in order to debug it.
Figure B.25 shows the source code tab with the debugger statement added to the pageLoad function. Note that you’re setting breakpoints in the source code tab and not in the original ASPX page, which is the inactive tab in the figure.

 

Sometimes, when you set breakpoints in JavaScript files, the debugger complains at runtime, saying that “There’s no source code available for this location” and displaying a warning dialog. This happens because script files are loaded dynamically in the page. In such cases, you have to rely on the Script Explorer window to set breakpoints in JavaScript files.

To open the Script Explorer window, choose Debug > Windows > Script Explorer. If you don’t see the Script Explorer menu item, choose Tools > Customize. In the new window, select Debug > Script Explorer. You can also drag the
Script Explorer icon to a Visual Studio toolbar to add it automatically.
The Script Explorer window lists all the script files loaded in the page you’re debugging. If you double-click a file, the file opens in a new tab, and you can set breakpoints; see following figure. Once you set breakpoints, you have to reload the web page in order to debug the code.

Hope this helps!

ASP.NET, Tips n Tricks