Using Test Automation Tools to Test Different Browsers

August 12, 2013

For the purpose of this article on test automation tools we are going to focus on Test Complete and creating a script to cover multiple different browser types with multiple windows. Now on the surface this can look very complicated. With Test Complete though we can use parametrization in name mapping to simplify this. What we need to do is first create the script for just one browser type (say Internet Explorer). After that we’ll implement parametrization in the name map and we’ll be able to execute the same test script for different browser types.

The process we’ll follow for this is outlined below:

1. create a new project
2. add Internet Explorer as a tested application
3. record the test against Internet Explorer
4. Add FireFox as a tested application
5. Add project variables for the browser type (and index)
6. use these project variables in the name map
7. add IF/THEN conditions in the script
8. map additional FireFox objects

With test automation tools the key is really to get the process correct. Follow the right process (like the one we’ve outlined above) will give you the frame work to build quite complex scripts which can manage the complexities that different browsers present to automation tools. The biggest problem this presents is that some objects are rendered differently. So for example a pop up window in one type will have a particular object name and in another a completely different object name. This isn’t something that many test automation tools manage well. With the right process though you can deal with this simply and quickly.

Let’s say we are going to use IE7 and Firefox in our example. We’ll start with Internet Explorer:

If you open an IE window (Assumed that no other IE’s are open), then testcomplete will use the following process name to identify the objects.

Sys.Process(“iexplore”,1) : Here “iexplore” is the process name & the index is 1

If you open another window while that above is opened, then this new window will be identified using the following process name.

Sys.Process(“iexplore”,2) : Here “iexplore” is the process name but the index is 2

Now, if you want to click a button in the first window, you need to write the script as follows.

Sys.Process(“iexplore”,1) .Page(“www.test.com”).button(“submit”) .Click()

If you want to click a button in second window you need to write the following script.

Sys.Process(“iexplore”,2) .Page(“www.test.com”).button(“close”) .Click()

So the following test automation tool script will click “submit” button in first & close button in 2nd. After that it will click “continue” button in the first.

script_with_fullname

The above steps are applicable to Firefox too. To execute the same scenarios in Firefox, we can use the following code. Here we have changed only the process name.

firefox_code

Let us say that you are creating name mapping for this “Sys.Process(“iexplore”,1)”. Here we have used ProcessName & index properties.

Map_one

So, after creating the name map entry & Aliases for all the objects (page & button objects), if we use the following code, it will click button in the first window.

Aliases.BrowserProcess.Page.SubmitButton.Click()

Now if you want to write the code in your test automation tool to click the button in the second window, you need to create new browser process name mapping. However, this window has a different index value. So the first name map entry we created for the object cannot be used. If you want to do same for firefox, you need to create 4 name map entries. You’ll also need to write a separate script for IE & Firefox.

However, if we change the index & process name values in the name mapping of first IE, we can make the test automation tool recognize the objects in any browsers. For this we need to parameterize the ProcessName & index values using Project Variables. To parameterize these values, do the following steps.

1) Create two project variables in Project Variable window.

project_Variable_Creation

2) Now double click on ‘Name Mapping’ project item & open the ‘Name Mapping’ Editor. Select the “BrowserProcess” item.

Browserprocessitem

3) Now click on ProcessName value. It will show an Ellipsis button. Click on that button.

Click_Elipsis

4) It will open the following window.

edit_Property_value

5) In which select “Mode” value as “Project Variable”.

Mode_Value

6) In “Type” combobox, select a correct project variable. Here we are going to select “browserName”.

Project_Variable

7) Now click OK button. Now if you see the Name mapping editor, it will be as below.

After_parameterization

8 ) In the same way, parameterize the ‘Index’ value. After doing this, the name mapping for “BrowserProcess” will be displayed as below.

Both_Values_Parameterized

9) Now you can use the following code to execute above mentioned scenario in IE.

code_with_aliases

10) Now, in Project variable window, if we change the default value of ‘browserName’ as ‘firefox’, the same code will work for Firefox also.

change_to_firefox

You can see with this test automation tool code we can use Project Variables to create a common script for different browsers.

For IE8 or IE9, there will be a small difference. If we open a first instance of IE8, it will run two “iexplore” processes. It means that, the following names will be recognized in the first IE only.

Sys.Process(“iexplore”,1)

Sys.Process(“iexplore”,2)

If you want to perform action in 2nd IE you have to use any one of the following names.

Sys.Process(“iexplore”,3)

Sys.Process(“iexplore”,4)

If you use IE8 or IE9 the following code will perform above mentioned scenario.

IE8_code

But this code will not work for Firefox. So you should use ‘if..Else’ condition to assign browserIndex value.

ifcondition

So in conclusion we must create the initial script within our test automation tool for one particular browser. Then we use the process outline above to develop that script to handle the way the different browser types present the same objects in different ways. The simplest way to do this is to parametrize the objects in the name map and then use IF/THEN statements to manage the objects which are rendered differently.