Test Automation - Visual Basic Web Automation with IE - Part 3

Finally... Automation

The final part of this series on web application automation will focus on some examples using the concepts discussed in the previous two parts. We shall also discuss some of the limitations of using the DOM and the alternatives available to automate web application testing.

Automating a Web Page

The basic automation of web pages is simple and requires only the combination of the concepts discussed in the first two parts of this series. Before looking in more detail at the examples of automation we need to take into consideration the following DOM limitations mean that not all web pages can be easily automated.

• 
  Only HTML/DHTML web content can be automated. Web applications based on Java or other development frameworks such as .NET can not always be automated.
• 
  Web pages are not always developed with automation in mind. It is often necessary to create coding procedures within a development team to include the required properties within the elements to facilitate automation.

Locating Elements

There are various ways in which we can identify elements with the document.

• Viewing the source code directly.
  
• Using a DOM inspector
  

DOM inspectors are the preferred method as they usually allow the identification of elements by means of clicking on them or hover over them. Source code viewing is effective and can often uncover elements that have not been recognised by a DOM inspector. The only draw back with source code viewing is that it can be time consuming and not always accurate.

Automation

The following examples use Visual Basic Script to automate browser operations.

This function opens a browser and will then navigate to a web page.

Function OpenBrowser(url, sleepTime)
Dim IE
Set IE = CreateObject("InternetExplorer.Application")
IE.Visible = True
IE.Navigate2 url
Do
WScript.Sleep(sleepTime)
Loop while IE.Busy = TRUE
Set OpenBrowser = IE
End Function

A function to click on link.

Function ClickLink( byval oIE, strLnk)
Dim Link
For Each Link In oIE.Document.links
If Instr(strLnk, Link.href) > 0 Then
ClickLink = Link.href
Link.Click
Exit Function
End If
Next
ClickLink = ""
End Function

A basic script that uses the functions OpenBrowser and ClickLink to open up a web page and click on a link.

Set objBrowser = OpenBrowser ("www.google.com", 1000)

Call ClickLink(objBrowser, http://images.google.com/imghp?tab=wi)

More Methods to access objects in a web page.

Searching on google using the getElementsByName method

Dim IE
Set IE = CreateObject(“InternetExplorer.Application”)
IE.Visible = True
IE.Navigate2 “http://www.google.com/”
Do
WScript.Sleep(1000)
Loop while IE.Busy = TRUE
IE.document.getElementsByName(“q”)(0).value=“Classical Guitar”
IE.document.getElementsByName(“btnG”)(0).click
Set IE=Nothing

Frames - Problems within the DOM

In many cases we find that with an application that contains frames, very often we can’t access the elements inside some of the frames. This is caused by the frame having a different domain to the principal web page, causing access to the DOM of that frame to be denied. This is a security feature that stems from cross frame scripting. It basically stops unwanted access and changes occurring from outside of the domain of the frame; you can read more about it here http://msdn2.microsoft.com/en-us/library/ms533028.aspx. In a development environment developers can be made aware of this and can include the document.domain property to reference the principal domain inside of the frame. This allows access to the frames DOM.

Even though there are limitations to the DOM, there are many other objects such as xml based objects, and methods that can be used to assist us when DOM limitations are reached. A series on test automation frameworks is planned in the near future which will expand on the concepts learned in this series. You will learn how to develop a test automation framework using just VBScript and the API of an application such as Excel.

Conclusion
In this series we have looked at the various concepts involved in the automation of Internet Explorer. We have also described some very basic methods used in web application automation. We now how have a solid base to develop a test harness that takes advantage of these concepts.

For more information on TEST AUTOMATION FRAMEWORKS using VB and Excel. Please contact me through insideSQA.

Test Automation - VBA Web Automation with IE - Part 2

Introduction

In the previous entry of this series we looked at ways of creating the Internet Explorer object and how to interact with the elements contained within that particular object using the DOM. In this entry we will look at the various types of HTML element and some examples of how we can access and manipulate these particular elements.

HTML Elements

How do we interact with the different elements that are described within the DOM? The following examples take the most common elements and demonstrate some of the methods that we can use to access and manipulate them.

Links and Buttons

The following link can be accessed through a wide array of differing methods.

<a href=http://www.brownswood.co.uk name="brownslink" id="brlk" >brownswood</a >

document.Links("brlk").click
document.Links("brownslink").click
document.getElementById("brlk").click
document.getElementsByName("brownslink")(0).click
document.all("brownslink").click
document.all("brlk").click

A button can be accessed using some of the methods above. The properties of the button element below are almost identical to those of the link above.

<INPUT type="button" id=brownsBtn name=brownswood value="Click">

document.getElementById("brownsBtn").click
document.getElementsByName("brownswood")(0).click

Text Boxes

A textbox can have both its value read and set.

<INPUT userProp = "Company" type="text" id="Company Name" name="Company Name" value="Test this text box">

There are various ways to change the value of text box.

document.getElementById(“Company Name”).value=“insideSQA”
document.getElementsByName(“name”)(0).value=“insideSQA”

If the properties name and id are not available then the code below can be used to change its value.

Set Elems= document.getElementsByTagName(“INPUT”)

For each elem in Elems
if elem.userProp=“company” then
elem.value=“insideSQA”
Exit For
end if
Next

List Box

A list box usually contains a number of options that a user can select.

<SELECT size="1" name=“demo_ComboBox">
<option value=“Value 1">Value 1</option>
<option value=“Value 2" >Value 2</option>
<option value=“Value 3" >Value 4</option>
</SELECT>

Set oList=document.getElementsByName(“company type”).item(0)

optionsCount=oList.Options.length
optionOneValue=oList.Options(0).value
optionTxt=oList.Options(0).text

To select one of the options the code below can be used

oList.Options(0).Selected = true
oList.value="value 2"

Checkbox

A checkbox is either checked or unchecked.

<input type="checkbox" name="Company Checkbox">

Set oChkBox=document.getElementsByName("Company Checkbox").item(0)
oChkBox.Checked=True

Radio Button

The radio button element is an array of options where only one option can be selected.

Radio button elements are grouped using the same name.

<input type="radio" name="Company Type" value="Public" checked="checked" />
<input type="radio" name="Company Type" value="Private" />

A radio button is selected by assigning the required value to the object .

Set oRadio=document.getElementsByName(“Company Type”).item(0)
oRadio.checked=True 'This will select Public
oRadio.value="Private" 'This will select Private even if the Publci object node is being pointed to.

Tables

Tables are amongst the most difficult but useful of elements to access. When tables become nested it becomes necessary to work with the child objects of these tables, and sometimes its difficult to identify how many table structures a document contains. A great tool for element identification is the DOM inspector from Mozilla http://www.mozilla.org/projects/inspector/. With this tool it is possible to view all elements in a document, rather like an object spy that you find with a tool like HP's Quick Test Professional.

The table object provides two collections

cells – Access the cells of the table
rows – Access the rows of the table. The rows also allow access to a cells collection to access particular cells present in the row.


Row1 cell1 Row1 cell1
Row2 cell1 Row2 cell1


Access first row and the first column.

Set oTable=document.getElementById(“companyTable”)
oTable.rows(0).cells(0).outerText
oTable.cells(0).outerText

Access second row and the first column.

oTable.rows(1).cells(0).outerText
oTable.cells(2).outerText

Counting Cells and rows

oTable.rows.length
oTable.cells.length
oTable.rows(0).cells.length

Coming up..
Now that the basic concepts are covered we can now look at putting together the various parts to automate a web application. The final part of this series will demonstrate the possibilities of automating html objects within the Internet Explorer Object.