Walkthrough: Creating a Simple Web Application

Article
11/16/2012

In this walkthrough, you will create a simple Web application to use as the basis for a Web test in Walkthrough: Recording and Running a Web Test.

For the purpose of creating a sample Web test, you should use a Web application to which you can make arbitrary changes.

In this walkthrough, you will perform the following tasks:

Create a simple Web application.
Test the Web application manually.

Prerequisites

For this walkthrough you will need:

Visual Studio Team System 2008 Test Edition

Creating a Web Application

To create the Web application

In Team System 2008 Test Edition, on the File menu, click New and then click Web Site.

The New Web Site dialog box appears.
Under Visual Studio installed templates, click ASP.NET Web Site.
In the Location box, select File System, and then type the name of the folder where you want to keep your Web application. Make the end of the folder name ColorWebApp\ColorWebApp. For example, type the folder name C:\WebSites\ColorWebApp\ColorWebApp.

Note

Include the name two times so that you can add a Web test project to the first folder, and it will be separated from the Web application itself in the second folder.
In the Language list, choose the programming language you prefer.

Note

You will write minimal code in this walkthrough.
Click OK.

Adding Controls to the Web Application

To add controls to the Web application

In Solution Explorer, right-click Default.aspx and choose View Designer.

A blank page is displayed.
If the toolbox is not visible click View and then click Toolbox.
From the Standard group, drag a RadioButtonList onto the page.

A RadioButtonList control is added to the design surface.
On the RadioButtonList Tasks smart tag pane, click the EditItems link.

A ListItem Collection Editor appears.

Note

You can also display the ListItem Collection Editor by editing the Items collection from the Properties window.
Click Add to add a new item.
Under ListItem properties:
1. Change the Text property to Red.
2. Set the Selected property to True.
Click Add to add another item.
Under ListItem properties change the Text property to Blue.
Click OK to close the ListItem Collection Editor.
Drag a Button onto the page and change the Text property to Submit.
On the File menu, click Save All.

Adding Pages to the Web Application

To add pages to the Web application

On the Website menu, click Add New Item.
In the Add New Item dialog box, click the Web Form template, name it Red.aspx, and then click Add.
At the bottom of the document window, click the Design tab to switch to design view.
Drag a Label onto the page. Set the Text property to Red, and the ForeColor property to Red.
On the Website menu, click Add New Item.
In the Add New Item dialog box, click the Web Form template, name it Blue.aspx, and then click Add.
At the bottom of the document window, click the Design tab to switch to design view.
Drag a Label onto the page. Set the Text property to Blue, and the ForeColor property to Blue.
On the File menu, click Save All.

Adding Functionality to the Web Application

To add functionality to the Web application

In Solution Explorer right-click Default.aspx and click View Designer.
Double-click the SubmitButton. Visual Studio switches to the page code, and creates a skeleton event handler for the Button control's Click event.

Add the following code to the event handler:

if (this.RadioButtonList1.SelectedValue == "Blue")
{
    Response.Redirect("Blue.aspx");
}
else
{
    Response.Redirect("Red.aspx");
}

If RadioButtonList1.SelectedValue = "Blue" Then
    Response.Redirect("Blue.aspx")
Else
    Response.Redirect("Red.aspx")
End If

On the File menu, click Save All.

Testing the Web Application Manually

To test the Web application manually

In Solution Explorer, right-click Default.aspx and then click Set As Start Page.
Press CTRL+F5 to run the Web application in the browser. You will see the first page.
Click Red and then click Submit. If the application is working correctly you will go to the page with the Label that says Red.
Go back to the first page.
Click Blue and then click Submit. If the application is working correctly you will go to the page with the Label that says Blue.

Next Steps

In this walkthrough you created a simple Web application and tested it manually. Now you are ready to create a Web test that allows you to test this application. For more information, see Walkthrough: Recording and Running a Web Test.

Change History

Date	History	Reason
June 2010	Changed instances in topic that indicated Visual Studio 2005 instead of Visual Studio 2008.	Customer feedback.