Coded UI Test Basic Walkthrough

Posted by in Visual Studio category on for Beginner level | Points: 250 | Views : 193853 red flag
Rating: 5 out of 5  
 3 vote(s)

There are lots of test automation frameworks to support the test automation of an application. Coded UI is the new testing model introduced in Visual Studio 2010. This will support the automation of Manual test steps etc.

Coded UI is an automation framework which enables us to record a set of action, creates the code for the same and allows us to playback the recording for testing the application. It also gives the flexibility to write the custom code [hand-coded].

In this article we will discuss about how to create our first CodedUI test project.

1.       Open Visual Studio 2010 and create a new Test Project.

2.       Add a new CodedUI Test and click on OK button.

A new window gets opened for selecting how do you want to create your coded UI test.

  • “Record actions edit UI map or add assertions” option allows you to do the recording on your application      and then generates code for the recording. 
  • “Use an existing action recording” allows the code generation for already recorded action. 

3. Select the first option “Record actions edit UI map or add assertions”. It will open the Coded UI Test builder for creating the recording.

Click on the left most red button for recording, the icon will change to pause/stop button as shown below.

4. Perform all the operations on your application which you want to record. As a sample I am recording the steps of searching for Visual Studio 2010 in Bing web site. 

    •  Open  Internet Explorer (Start -> Run ->Enter -> Type iExplore in the Run text box ->Click OK} and type in address bar and press enter button. 
    •  Type Visual Studio 2010 in the Search textbox and click on Search button. 
    • See the results and fnally close the Internet Explorer. 

5. Once you are done with recording, press stop button (left most). 


  And then click on Generate code button (right most). 
Provide appropriate name for the generated method and click on Add and Generate button.
6. If you want to add some assertion on some control’s property or you want to rename the objects, click on   the cross hair (second last button) present just left to Generate code button. 
It will show the object hierarchy in the left pane as below and the properties of the selected object in right pane. 

You can click on Add Assertion button to create an assertion for the selected control’s selected property.
See below the list of possible assertions: 


Create the assertion and again click on Generate Code button which will pop up a window to provide the Method Name, give appropriate name and generate the code for the created assertion. 

  7.       Now open the UIMap.Designer.cs file and see the code generated by Coded UI for you. 

/// <summary>

/// RecordedMethod3 - Use 'RecordedMethod3Params' to pass parameters into this method.

/// </summary>

public void RecordedMethod1()


#region Variable Declarations

HtmlEdit uIEnteryoursearchtermEdit = this.UIExercise3DataDrivenDWindow.UIBingDocument.UIEnteryoursearchtermEdit;

HtmlDiv uIItemPane = this.UIExercise3DataDrivenDWindow.UIBingDocument.UISb_formCustom.UIItemPane;

HtmlInputButton uISearchButton = this.UIExercise3DataDrivenDWindow.UIBingDocument.UISearchButton;

WinButton uICloseButton = this.UIExercise3DataDrivenDWindow.UIVisualstudio2010BingTitleBar.UICloseButton;


// Go to web page '' using new browser instance

this.UIExercise3DataDrivenDWindow.LaunchUrl(new System.Uri(this.RecordedMethod3Params.UIExercise3DataDrivenDWindowUrl));

// Set flag to allow play back to continue if non-essential actions fail. (For example, if a mouse hover action fails.)

Playback.PlaybackSettings.ContinueOnError = true;

// Mouse hover 'Enter your search term' text box at (213, 5)

Mouse.Hover(uIEnteryoursearchtermEdit, new Point(213, 5));

// Reset flag to ensure that play back stops if there is an error.

Playback.PlaybackSettings.ContinueOnError = false;

// Click 'Unknown Name' pane

Mouse.Click(uIItemPane, new Point(151, 34));

// Type 'visual studio 2010' in 'Unknown Name' pane

Keyboard.SendKeys(uIItemPane, this.RecordedMethod3Params.UIItemPaneSendKeys, ModifierKeys.None);

// Type 'visual studio2010' in 'Enter your search term' text box

uIEnteryoursearchtermEdit.Text = this.RecordedMethod3Params.UIEnteryoursearchtermEditText;

// Click 'Search' button

Mouse.Click(uISearchButton, new Point(21, 20));

// Click 'Close' button

Mouse.Click(uICloseButton, new Point(18, 8));


8. See the code generated by Coded UI in “CodedUITestMethod1”


public void CodedUITestMethod1()



// To generate code for this test, select "Generate Code for Coded UI Test" from the shortcut menu and select one of the menu items.

// For more information on generated code, see


Open the Test List Editor (Test -> Windows ->Test list Editor) and run the ‘CodedUITestMethod1” present in CodedUITest.cs file.


Coded UI File Structure

Coded UI maintains a specific file structure as follows:

·         CodedUITest.cs  file

·         UIMap.uitest file

·         UIMap.Designer.cs file

·         UIMap.cs file


CodedUITest.cs file: 
CodedUITest.cs file is a unit test file having TestClass decorated with [CodedUITest] attribute and contains multiple methods decorated with [TestMethod] attribute.

UIMap.uitest file:
UIMap.uitest is an xml file containing all the windows, controls, properties, methods, actions and assertions etc used for playback.

UIMap.Designer.cs file:
UIMap.Designer.cs file is a partial class which contains the classes for various controls and their fields, properties and methods.

UIMap.cs file:
UIMap.cs is also a partial class of UIMap.Designer.cs. It can contain all the recorded methods which need customization. 


Coded UI provides an easy to use graphical way to write the test automation. User can also write his own custom code leveraging all .Net features instead of going with coded ui generated code. We will discuss about working with custom code in my next article.

Page copy protected against web site content infringement by Copyscape

About the Author

Full Name: Ruchi Srivastava
Member Level:
Member Status: Member
Member Since: 3/2/2011 1:00:59 AM
Country: India

Login to vote for this post.

Comments or Responses

Posted by: Karthikanbarasan on: 3/2/2011 | Points: 25
Good one Ruchi!!!
Posted by: SheoNarayan on: 3/2/2011 | Points: 25
Very well presented, thanks

5 from me, keep it up Ruchi !

Posted by: Madhu.b.rokkam on: 3/2/2011 | Points: 25
Nice article ... Thanks for sharing
Posted by: Tripati_tutu on: 3/7/2011 | Points: 25
Good one. Thanks....
Posted by: Venumadhav_gupta on: 3/17/2011 | Points: 25
Hi Ruchi, this is a very good article for beginners like me... Thanks for sharing this article... I have a question for you, is it possible to convert Coded - UI Tests as an executable file and give it to testers to use it? or does all the testers need to have VS 2010 installed on their machine in order to run the tests?
Posted by: Dynamicruchi on: 3/18/2011 | Points: 25
Hi Venu,

You can create a batch file to execute all the coded ui tests using MSTest from command line. You need to install Visual Studio 2010 test agent to run the tests.
Posted by: Mahenbhasker on: 6/20/2011 | Points: 25
Hi Ruchi.......

1. Can yu pls suggest how to override recoded values of events OR how to do parameterization of events with HTMLCustom .

2. I am using data driven framework for my 'Search Claim' project where I input some data using csv files i.e Claimant name, Claim type, Line of business etc.. and i want search results to be exported or retrieved in a output csv file. Can you please suggest how to handle it.

3. Also please add some info on assertion, In what all cases should i add assertions for a field.

Thanks in Advance.
Posted by: Maya2506 on: 6/9/2012 | Points: 25
Hi Ruchi..

Article was too good and informative especially for freshers..
I have a Question..
Can we parameterize the data connection..if we are using multiple csv files for parameterization,instead of establishing connection to each method is there any alternate way to put all the connections in a single method and call it wen ever required?
Posted by: Murugan on: 2/27/2013 | Points: 25
may know what does "new Point(151, 34))" it means and how to found out that

Login to post response

Comment using Facebook(Author doesn't get notification)