Global GUI map for automation with VS.NET

Writing test code based on RanoreXPath is not a big challenge. In fact, it’s always the same procedure. First, find the element within a web page. After that, automate it (click, set value,…). Two simple steps. Nevertheless, the bigger your test code the more structured and well designed it should be.

RanoreXPath allows many different ways of searching for web elements within a web page. The use of Ranorex WebSpy could tempt someone to always copy & paste RanoreXPaths from WebSpy into the test automation code. What an easy job. But consider that searching elements from scratch permanently could be time consuming, especially if using optimized RanoreXPaths. Moreover, the resulting test automation code is not as readable as we would like to have it. Take a look at following code lines:

using System;
using System.Collections.Generic;
using System.Text;
using Ranorex;
using Ranorex.Web;

namespace WebTestDont
{
    class Program
    {
        static void Main(string[] args)
        {
            // Resource based identification of web elements
            WebDocument exampleDoc = WebDocument.OpenDocument(”www.ranorex.com/web-testing-examples”, true);

            // Find ‘Name’ textbox within form
            WebElement name = exampleDoc.FindSingle(”//input[@id='testname']“);
            Mouse.MoveToWebElement(name);
            name.Value = “Mr. XYZ”;

            // Find ‘Color’ drop down box within form
            WebElement colorSelector = exampleDoc.FindSingle(”//select[@id='testcolor']“);
            Mouse.MoveToWebElement(colorSelector);
            colorSelector.Value = “blue”;

            // … search for next elements …
        }
    }
}

using System;

using System.Collections.Generic;

using System.Text;

using Ranorex;

using Ranorex.Web;

namespace WebTestDont

{

    class Program

    {

        static void Main(string[] args)

        {

            // Resource based identification of web elements

            WebDocument exampleDoc = WebDocument.OpenDocument(”www.ranorex.com/web-testing-examples”, true);

            // Find ‘Name’ textbox within form

            WebElement name = exampleDoc.FindSingle(”//input[@id='testname']“);

            Mouse.MoveToWebElement(name);

            name.Value = “Mr. XYZ”;

            // Find ‘Color’ drop down box within form

            WebElement colorSelector = exampleDoc.FindSingle(”//select[@id='testcolor']“);

            Mouse.MoveToWebElement(colorSelector);

            colorSelector.Value = “blue”;

            // … search for next elements …

        }

    }

}

I know, the few code lines above don’t give a good example for a long and unreadable test code. But what we can see, is that the example always starts the element search from scratch by calling the method ‘FindSingle’ from the ‘exampleDoc’ object. Another problem is the use of hard-coded RanoreXPath expressions. Due to changes within your AUT (application under test) you may need to update your code lines with new RanoreXPath expressions, to ensure your test is still workable .

For that reason it’s advisable to extract and separate your RanoreXPath search strings from your test codes. There are many different types to generate global mapping/resource information. The next section concentrates on the use of resource files provided by Microsoft Visual Studio.

Visual Studio provides resource files for storing several types of objects (Images, Icons, Strings, …). Our use case only requires a resource table of type string. Simple add a new resource file called ‘GuiMapping’ to your Visual Studio project.

To add a resource file please

• open your Visual Studio project properties and
• add a new resource within the ‘Resource’ tab.

The use of resource files extracts complex search strings from test code and concentrates searching information at one single location. The static ‘GuiMapping’ object is easy to use during coding and provides all necessary RanoreXPath expressions. In addition to that, the following implementation speeds up the search of web elements: In the first step we search for the web element of type ‘form’. After that, each search for web elements located within this form can be done by calling the method ‘FindSingle’ on the form object.

using System;
using System.Collections.Generic;
using System.Text;

using Ranorex;
using Ranorex.Web;

namespace WebTest
{
    // Using 'Properties' namespace to access
    // Resource elements
    using Properties;

    class Program
    {
        [STAThread]
        static void Main(string[] args)
        {
            // Resource based identification of web elements
            WebDocument exampleDoc = WebDocument.OpenDocument(GuiMapping.WebTestUrl, true);
            WebElement form = exampleDoc.FindSingle(GuiMapping.WebTestForm);

            // Find ‘Name’ textbox within form
            WebElement name = form.FindSingle(GuiMapping.WebTestName);
            Mouse.MoveToWebElement(name);
            name.Value = “Mr. XYZ”;

            // Find ‘Color’ drop down box within form
            WebElement colorSelector = form.FindSingle(GuiMapping.WebTestColors);
            Mouse.MoveToWebElement(colorSelector);
            colorSelector.Value = “blue”;
        }
    }
}

using System;

using System.Collections.Generic;

using System.Text;

using Ranorex;

using Ranorex.Web;

namespace WebTest

{

    // Using 'Properties' namespace to access

    // Resource elements

    using Properties;

    class Program

    {

        [STAThread]

        static void Main(string[] args)

        {

            // Resource based identification of web elements

            WebDocument exampleDoc = WebDocument.OpenDocument(GuiMapping.WebTestUrl, true);

            WebElement form = exampleDoc.FindSingle(GuiMapping.WebTestForm);

            // Find ‘Name’ textbox within form

            WebElement name = form.FindSingle(GuiMapping.WebTestName);

            Mouse.MoveToWebElement(name);

            name.Value = “Mr. XYZ”;

            // Find ‘Color’ drop down box within form

            WebElement colorSelector = form.FindSingle(GuiMapping.WebTestColors);

            Mouse.MoveToWebElement(colorSelector);

            colorSelector.Value = “blue”;

        }

    }

}

For that reason, outsourcing of searching criteria enhances readability and coding maintenance for future extensions.