ASP.NET 3.5 Debugging Using Visual Web Developer Express 2008

Activating the Debugger

Okay, before you can start learning how to use this feature, you will need to load a project into your Visual Web Developer Express. For the purpose of this tutorial, you will be using simple ones first, like the ASP.NET web application to compute the area of the circle discussed in a previous tutorial. All you need to do is create that project in your own Visual Web Developer Express 2008 by creating and copying the source code discussed in the tutorial.

Once you have completely created the project, view it in the browser without using the debugging feature first. The form should look like the screen shot below:

Try entering any value of the radius, and then click "Compute area of the circle." You should see a result without any error. Okay, once you have done that, follow the steps below:

1. Using Visual Web Developer Express, go to Debug and click Start Debugging. Since this is the first time you'll be enabling debugging, a warning should appear like the one shown below:

Just click OK and let Visual Web Developer Express modify the web.config file. However, be warned that once the website is deployed to a hosting production environment, debugging should be disabled in the web.config. Details of this procedure will be discussed later.

After this, if you do not see any further errors, the debugger has been successfully activated. You can see the debugger window below the Design, Split and Source tab.

Also, activating it causes the project to be launched to the web browser automatically.

What can be debugged, and how?

Default debugging features in Visual Web Developer can troubleshoot server side scripts, particularly Visual Basic code in the .aspx.vb extension (it can also troubleshoot client side scripts, but that is beyond the scope of this article). One of the debugging features that can be added to the lines of source code is called "breakpoint." When the debugger is started or restarted by going to Debug -> Restart, the web browser is re-launched and executes the scripts until the "breakpoint" line. At this point, the execution is halted, and then the debugger window will be shown with the diagnostic results of the execution.

You cannot place "breakpoints" in a .aspx extension or ASP.NET page; instead, you will use the debugger in troubleshooting server side script like Visual Basic. The good rule of thumb in placing a "breakpoint" is to place it below the analyzed lines. For example, consider the Visual Basic code to compute the area of the circle triggered by the click event handler:

Partial Class _Default

Inherits System.Web.UI.Page

Protected Sub computearea_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles computearea.Click

'Get the user input radius from the text box field

'Assigned it as userradius

Dim Userradius As Integer = radius.Text

'Calculate Area of the circle

'Initiate Area as a decimal

'Formula is 3.1416 x (r^2)

Dim Area As Decimal

Area = (3.1416) * ((Userradius) ^ 2)

'Output the area of the circle back to the browser

displayarea.Text = "The area of the circle is: " & Area

End Sub

End Class

A debugging example

Say for example you are having a problem getting the correct results for the area of the circle. A potential cause could be one of the following:

• Wrong formula used.
  
  
• Incorrect variable used.
  
  
• ASP.NET form did not pick up the user input (which is radius). There may be a problem with how the user inputs are being processed and used by the script.

Of course you can troubleshoot it manually using a piece of paper and see if your manual computation matches the one outputted by the web application. The only problem is that there is no way to view the values of the variables, or whether incorrect variables are used and whether the form did not pick up user inputs without using a debugger.

To debug the script in the previous section, you will need to place a "breakpoint" in this line:

displayarea.Text = "The area of the circle is: " & Area

This is because at this line, the area of the circle is already computed. If you place the breakpoint in this line:

Area = (3.1416) * ((Userradius) ^ 2)

the execution of script will halt on this line and the area of the circle is still not computed. To place a breakpoint in Visual Web Developer Express, double click the Default.aspx.vb file under Solutions Explorer. When the Default.aspx.vb is shown in the editor, point your mouse cursor in the left most part of the editor screen (gray area) specifically along Line 15 since you will be placing that breakpoint in:

displayarea.Text = "The area of the circle is: " & Area

Once your cursor is positioned, CLICK on it and you will see the breakpoint's red dot as shown below (alternatively, you can get rid of any breakpoint by right clicking on it and removing it):

By placing the breakpoint on this line, you are telling Visual Web Developer to halt at this line because you will be debugging the parameters of this script.

Executing and Managing the Debugging Process

Okay, once you have placed the breakpoint line, the next thing you will need to do is execute the debugging process. To execute it, go to Debug -> Restart.

Visual Web Developer will re-launch the project in the web browser, and you will be shown a web form in which to enter the circle radius data. Enter any value; say you enter "79" and then submit it by clicking "Compute Area of the Circle."

Since you are debugging, the complete results will not be returned to the browser; instead you will be presented with parameters in the Visual Web Developer Express debugging window. The most important debugging result can be found under "locals":

Since you entered 79 in the web form as the circle radius, it was correctly assigned by the ASP.NET Visual Basic script, as you can see that the Userradius has a value of 79. And based on the script above, it is assigned to a correct variable.

The area is 19606.7256, calculated manually manually from the formula 3.14 x (79)^ 2 = 1956.74~, which is  more or less similar to the result provided by the debugger.

Aside from debugging values, you can also debug whether the variables are using the correct variable type -- as you know, Visual Basic is a strongly type-based language. Under type, you can see that the area uses Decimal and the user radius is 79, which is expected from the design.

Finally, since the execution stopped at the breakpoint (it will be shaded yellow in Visual Web Developer Express), you can continue executing the rest of the script by going to debug and clicking "Continue." Finally, once the breakpoint is no longer there, the execution of script is completed, and you can now see the results in the web browser.

The basic debugging process illustrated in this article can be used to debug more complex scripts, such as those involving a lot of variables.

Disabling the Debugging feature in Web.config

Once you have completely developed and tested your web application in Visual Web Developer Express, and it is time to deploy it in a production environment (with web hosting), you should disable the Debugging in Web.config as suggested earlier. To do this, double click the web.config file under the solutions explorer and find this line:

<compilation debug="true" strict="false" explicit="true">

Replace it with:

<compilation debug="false" strict="false" explicit="true">

This will set the debug parameter to false, which will disable it.