Hand Coding Coded UI Test using Visual Studio

Hi All,

In this post we will learn how to create the Coded UI Automation test script by hand coding the entire scenario along with UI objects. Explanation about how the Visual Studio Coded UI tool will identify the controls and perform UI actions is out of the scope of this blog.

Please find sample source code for practice on below steps here.

In this blog we will take a simple scenario, we will hand code the automation script for the default Calculator application available in windows system. From launching the Calculator application, declaring and getting UI or Search Properties and to perform all the UI action we will hand code C# scripts using the objects available in the application. The scenario is as below:

1.      Launch Calculator application

2.      Click button 8

3.      Click button +

4.      Click button 7

5.      Click button =

6.      And validate the result which be on the result text box.

So let’s open Visual Studio tool (Ultimate/Premium) any version from 2010 to 2015. Select the Visual C# as the scripting language and under Visual C# template select the Test option and choose the Coded UI Test Project as below. Give a name for the test project, click on Ok button. Your test project is ready.

You will get a pop-up window to select either “Record Actions” or “Use an existing Action Recording”. Since we want to hand-code the test, we will cancel this window and follow the below steps for hand scripting the Coded UI test.

  1.      Now right click on the test project you created and create a class file called “Launch.cs” for getting the main calculator window details

2.      In the class use below namespace.

        using Microsoft.VisualStudio.TestTools.UITesting;

3.      Declare a static variable under class

        public static UITestControl calciwindow;

4.      Then create a static method called “Control” inside the Launch class which will return UITestControl object as below

This gets the main window/control of calculator App, which will be used as parent control for all the button and text and other UI controls inside the calculator App.

                public static UITestControl Control()

        {

            calciwindow = new UITestControl();

            calciwindow.TechnologyName = "MSAA";

            calciwindow.SearchProperties[UITestControl.PropertyNames.Name] = "Calculator";

            calciwindow.SearchProperties[UITestControl.PropertyNames.ClassName] = "CalcFrame";

            return calciwindow;

        }

Your class should look like below image.

5.      So we have got the code to launch the Calculator Application. Now let’s create a Coded UI test class which will call the main calculator window and perform the UI actions on the application.

6.      Now create another class “CalciFun” or any other name, which will be a Coded UI Test class

Use below Namespaces for the class

               using Microsoft.VisualStudio.TestTools.UITesting;

               using Microsoft.VisualStudio.TestTools.UITesting.WinControls;

               using Microsoft.VisualStudio.TestTools.UnitTesting;

7.      Mention [CodedUITest] attribute on top of the Class

8.      Declare a static variable under the class to get the main Calculator window details which is available in Launch class

               static UITestControl control = Launch.Control();

9.      Create a New method “CallFun“ as below inside the class. For now let’s keep it empty. Mention [TestMethod] attribute on top of new method.

[TestMethod]

public void CallFun()

        {

               }

10.   Now create static methods inside the class for each of the controls after the “CallFun” method.

11.   Use the static variable declared above in step 8 as “parent control” for all the UITestControl objects you are going to create.

12.   We are going to declare few button and text controls. Like below we are getting the UI/Serach properties for button controls in Calculator application namely button 7, 6, Add and Equals, which will be later used by the tool to execute the test and perform UI actions. In the same fashion declare text control and UI properties to identify the Result box/text control available in Calculator Application.

For Button Controls

public static UITestControl btnmethod8()

        {

            UITestControl btn8 = new WinButton(control);

            btn8.SearchProperties[UITestControl.PropertyNames.Name] = "8";

            return btn8;

        }

public static UITestControl btnmethod7()

        {

            UITestControl btn7 = new WinButton(control);

            btn7.SearchProperties[UITestControl.PropertyNames.Name] = "7";

            return btn7;

        }

public static UITestControl btnmethodAdd()

        {

            UITestControl btnAdd = new WinButton(control);

            btnAdd.SearchProperties[UITestControl.PropertyNames.Name] = "Add";

            return btnAdd;

        }

public static UITestControl btnmethodEqual()

        {

            UITestControl btnEqual = new WinButton(control);

            btnEqual.SearchProperties[UITestControl.PropertyNames.Name] = "Equals";

            return btnEqual;

        }

For text Box Controls

public static UITestControl txtmethodResult()

        {

            UITestControl txtResult = new WinText(control);

            txtResult.SearchProperties[UITestControl.PropertyNames.Name] = "Result";

            return txtResult;

        }

           

13.   Now go back to “CallFun” method created in step 9, and start performing the UI actions using the controls defined, and validate the results. The method should look like below:

Now run the test. With the above code the Coded UI test engine will Launch the App and perform the UI test.

The test is going to fail because the expected value is 10 , but actually application returned value is 15.

To pass the test you can change the expected values 10 to 15 in the Assert function.

Hope this helps, thanks for reading this blog. :)