Introduction to Coded UI Hand-coding

Coded UI is the new Automation tool based on Visual Studio which provides easy paths to automate the tests just to validate the functionality of the applications. It’s not the only medium which can automate our tests but the only thing that makes it different from others are the features that it provides. This framework can handle various controls that other tools are totally not able to do, controls such as:-

  • WinForms
  • HTML
  • WPF

This makes its different from other tools as the only tool to handle WPF Custom controls is QTP.
Coded UI basically can be done by two ways:-

  • Manually i.e. Hand coding the entire test without using UIMap reference.
  • Recording the Tests which means using Coded UI Test Builder.

But my preference will always go for hand coding the test rather than recording. Because while one record the test at that time the reusability of the code cannot take place where as if we create some methods and classes that we can just commonly use in various projects that can be more beneficial and time saving.
We can say that creating a custom methods using various controls can be beneficial.
Some of the basic controls are:-
• HtmlEdit
• HtmlTextArea
• HtmlTable
• HtmlButton
• HtmlImage
The Microsoft.VisualStudio.TestTools.UITesting.HtmlControls namespace provides classes the servers HTML Controls in Visual studio and helps us to create new classes using these controls to test the user interface (UI) of our projects.
Here is the short example of writing the code form using some of the above controls:-

How to enter text in the Textbox and reuse the code in Coded UI?

This will be the common function that you should get into a practice to write into a (.cs) class file instead of writing inside a [TestMethod].
To enter a text in the textbox we can either uses HtmlEdit or HtmlTextBox. So let’s explore how we can write the complete hand coded code in Coded UI without using Record and Playback application.

1. The Below code is to launch the desired browser:-

public class uiBrowserWindow : BrowserWindow
{
public void launchUrl(string url)
{
try
{
BrowserWindow.CurrentBrowser = ConfigurationManager.AppSettings [“BrowserType”].ToString ().Trim();
if (CurrentBrowser == “IE”)
{
this.SearchProperties [UITestControl.PropertyNames.ClassName] = “IEFrame”;
this.CloseOnPlaybackCleanup = false;
Maximized = true;
this.NavigateToUrl (new Uri (URL));
}
if (CurrentBrowser == “Chrome”)
{
this.SearchProperties [UITestControl.PropertyNames.ClassName] = “Chrome_WidgetWin_1”;
Maximized = true;
Launch (URL);
}
if (CurrentBrowser == “Firefox”)
{
SearchProperties.Add (“AccessibleName”, CommonFunctions.WinTitle);
WindowTitles.Add (CommonFunctions.WinTitle);
Launch (URL);
}

}
catch (Exception)
{
Launch (url);
}
}

2. The below code is to go to the home page with the passed URL:-

public static void GotoHomePage(string URL)
{
uiBrowserWindow br = new uiBrowserWindow ();
br.CloseOnPlaybackCleanup = false;
br.launchUrl (URL);
}

3. The below code is to get the passed text input in the Text box:-

public static void TextBoxInput (string Text, string TextBoxID)
{
try
{
BrowserWindow br = new BrowserWindow ();
HtmlEdit txtBox = new HtmlEdit (br);
txtBox.FilterProperties [HtmlEdit.PropertyNames.ClassName] = “HtmlTextBox”;
txtBox.SearchProperties [HtmlEdit.PropertyNames.Id] = TextBoxID;
txtBox.Text = “”;
UITestControlCollection utcc = txtBox.FindMatchingControls ();
Keyboard.SendKeys (utcc[0], Text);
}
catch (PlaybackFailureException e)
{
Assert.Fail (e.Message);
}
}

4. The below code is to click on the button using its displayed text value:-

public static void Submit (string Display_Text)
{
try
{
HtmlControl btn = new HtmlControl (br);
btn.SearchProperties [HtmlControl.PropertyNames.ClassName] = “HtmlButton”;
btn.SearchProperties[HtmlControl.PropertyNames.ControlType] = “Button”;
btn.SearchProperties [HtmlButton.PropertyNames.DisplayText] = Display_Text;
UITestControlCollection utcc = btn.FindMatchingControls ();
MouseClick (btn);
catch (PlaybackFailureException e)
{
Assert.Fail (e.Message);
}
}

Then we can create another method if in every test case you want to use the particular step then you , just pass the values from the [TestMethod] to this method and it will input the text into the text box.

5. This is the method from where you can get the value from the test method:-

public static void Login (String email_id, String password)
{
try
{
TextBoxInput (email_id, “txtUserName”);
TextBoxInput (password, “txtPassword”);
Submit(“Login”);
}
catch (PlaybackFailureException e)
{
Assert.Fail (e.Message);
}
}

Now in test method you just need to pass the URL and Values you want to enter in the Textbox of user and password.

6. Finally you can write your test method and can pass all the desired value:-

[TestMethod]
public void Login()
{
CommonFunctions.GotoHomePage (“https://www.facebook.com/login/”);
CommonFunctions.Login (“test.login@gmail.com”,”LoginPassword”);
}

Here you can see that your [TestMethod]gets completed in just two lines instead of writing all the entire code in [TestMethod] and now we can reuse the textbox function for any other textbox that comes our site with same properties.

Leave a comment