With test automation becoming the norm, this is an essential course in framework designing with QTP. Mixing conceptual and practical elements, it imparts all the know-how you need to implement the framework.

(For more resources related to this topic, see here.)

QuickTest Object property for a Web object allows us to get a reference to the DOM object, and can perform any operation on a DOM object. For example, the following code shows that the object on the page allows retrieving the element by name username, that is, the textbox in the next step assigns the value as ashish.

Set Obj = Browser("Tours").Page("Tours").Object.getElementsByName("userName) 'Get the length of the objects Print obj.length ' obj(0).value="ashish"

The following code snippet shows various operations that can be performed using the Object property of the web object:

'Retrieve all the link elements in a web page Set links = Browser ("Mercury Tours").Page("Mercury Tours").Object.links 'Length property provide total number of links For i =0 to links.length -1 Print links(i).toString() 'Print the value of the links Next Get the web edit object and set the focus on it Set MyWebEdit = Browser("Tours").Page("Tours").WebEdit("username"). Object MyWebEdit.focus 'Retrieve the html element by its name obj = Browser("Tours").Page("Tours").Object. getElementsByName("userName" ) 'set the value to the retrieved object obj.value ="ashish" 'Retrieve the total number of the images in the web pages set images = Browser("Mercury Tours").Page("Mercury Tours").Object.images print images.length 'Clicking on the Image obj = Browser("Tours").Page("Mercury Tours").Object.getElementsByName("login") 'Selecting the value from the drop down using selectedIndex method Browser("Flight").Page("Flight).WebList("pass.0.meal").Object. selectedIndex =1 'Click on the check box Browser("Flight").Page("Flight").WebCheckBox("ticketLess").Object. click

Firing an event

QTP allows firing of the events on the web objects:

Browser("The Fishing Website fishing").Page("The Fishing Website fishing").Link("Link").FireEvent "onmouseover"

The following example uses the FireEvent method to trigger the onpropertychange event on a form:

Browser("New Page").Page("New Page").WebElement("html tag:=Form").FireEvent "onpropertychange"

QTP allows executing JavaScript code. There are two JavaScript functions that allow us to interact with web pages. We can retrieve objects and perform the actions on them or we can retrieve the properties from the element on the pages:

RunScript executes the JavaScript code, passed as an argument to this function.

The following example shows how the RunScript method calls the ImgCount method, which returns the number of images in the page:

length = Browser("Mercury Tours").Page("Mercury Tours").RunScript("ImgCount(); function ImageCount() {var list = document.getElementsByTagName('img'); return list.length;}") print "The total number of images on the page is " & length

RunScriptsFormFile uses the full path of the JavaScript files to execute it. The location can be an absolute or relative filesystem path or a quality center path.

The following is a sample JavaScript file (logo.js):

var myNode = document.getElementById("lga"); myNode.innerHTML = '';

Use the logo.js file, as shown in the following code:

Browser("Browser").Page("page").RunScriptFromFile "c:\logo.js" 'Check that the Web page behaves correctly If Browser("Browser").Page("page").Image("Image").Exist Then Reporter.ReportEvent micFail, "Failed to remove logo" End If

The above example uses the RunScriptFromFile method to remove a DOM element from a web page and checks if the page still behaves correctly when the DOM element has been removed.

Using XPath

XPath allows navigating and finding elements and attributes in an HTML document. XPath uses path expressions to navigate in HTML documents. QTP allows XPath to create the object description; for example:

xpath:=//input[@type='image' and contains(@name,'findFlights')

In the following section, we will learn the various XPath terminologies and methodologies to find the objects using XPath.

XPath terminology

XPath uses various terms to define elements and their relationships among HTML elements, as shown in the following table:

Atomic values

Atomic values are nodes with no children or parent


A node's parent, parent's parent, and so on


A node's children, children's children, and so on


Each element and attribute has one parent


Element nodes may have zero, one, or more children


Nodes that have the same parent

Selecting nodes

A path expression allows selecting nodes in a document. The commonly used path expressions are shown in the following table:




Select elements relative to the root node

//(double slash)

Select nodes in the document from the current node that match the selection irrespective of its position


Represents the current node


Represents the parent of the current node


Represents an attribute


Selects all nodes with the name "nodename"

Slash (/) is used in the beginning and it defines an absolute path; for example, /html/head/title returns the title tag. It defines ancestor and descendant relationships if used in the middle; for example, //div/table that returns the div containing a table.

Double slash (//) is used to find a node in any location; for example, //table returns all the tables. It defines a descendant relationship if used in the middle; for example, /html//title returns the title tag, which is descendant of the html tag.

Refer to the following table to see a few more examples with their meanings:




Find all anchor tags


List the images that are inside a link


Show all the alt tags


Show the href attribute for every link


Anchor tab with any attribute

//title/text() or /html/head/title/text()

Get the title of a page


List the images that have alt tags


List the images that don't have alt tags


Get an element with a particular CSS ID

//div [not(@id="div1")]

Make an array element from the XPath


Selects the parent element of p (paragraph) child


Selects all the child elements of XXX with an attribute named att

./@* for example, //script/./@*

Finds all attribute values of current element


A predicate is embedded in square brackets and is used to find out specific node(s) or a node that contains a specific value:

  • //p[@align]: This allows finding all the tags that have align attribute value as center

  • //img[@alt]: This allows finding all the img (image) tags that contain the alt tag

  • //table[@border]: This allows finding all the table tags that contain border attributes

  • //table[@border >1]: This finds the table with border value greater than 1

Retrieve the table row using the complete path:


Get the name of the parent of //body/div/table/.. (parent of the table tag)


Path expression



Selects the first paragraph element that is the child of the div element

//div/p [last()]

Selects the last paragraph element that is the child of the div element


Selects the second last paragraph element that is the child of the div element


Selects the first two paragraph elements that are children of the div element


Selects all script element(s) with an attribute named as language


Selects all the script elements that have an attribute named language with a value of JavaScript


Selects all the paragraph elements of the div element that have a text element with a value greater than 45.00

Selecting unknown nodes

Apart from selecting the specific nodes in XPath, XPath allows us to select the group of HTML elements using *, @, and node() functions.

  • * represents an element node

  • @ represents the attribute

  • node() represents any node

The previous mentioned elements allow selecting the unknown nodes; for example:

  • /div/* selects all the child nodes of a div element

  • //* selects all the elements in a document

  • //script[@*] selects all the title elements which contain attributes

Selecting several paths

Use union | operator in XPath expressions for allowing to select several paths, as shown in the following table:

Path expression


//div|/p | //div/span

Selects all the paragraph and span elements of the div element

//p | //span

Selects all the p (paragraph) and span elements in the document

Axes in XPath

An axis allows defining a node which is relative to its current node. The following is the list of the axes in XPath:

  • self

  • parent

  • attribute

  • child

  • Ancestor and ancestor-or-self

  • Descendant and descendant-or-self

  • Following and following-sibling

  • Preceding and preceding-sibling

  • namespace

Locating a element using location path

A location of the element is represented in two ways using absolute and relative paths.

Each step is evaluated against the nodes in the current node. The syntax looks like the following syntax:


An axis defines the tree-relationship between selected nodes and current node.

A node-test allows us to identify node(s) within an axis.

Zero or more predicates allow further refining of the selected node set.

Take a look at the following example:


In the preceding example, ancestor-or-self is an axes, ::* is the nodetest and [@name='userName'] is the predicate, allowing us to search all ancestor-or-self elements whose attribute names are userName contained in the input type element //input[ansector-or-self::*[@name='userName']].

Axes allow finding the descendant of the element; for example:

//div[descendant::p] allows us to find all the div elements having descendant as paragraph.

descendant::p axes allow finding the ancestor and descendant of the element, for example, finding all the ancestors of button or finding all the div whose descendants are table.

//input[Ancestor::div[@align='center']] //div[descendant::table]

Use of the XPath functions:

  • //div/text(): This retrieves the text from the div tags using text functions

  • //div/node(): Getting all the nodes under div tags using the node function

To get the descendant, XPath function start-with finds the value that starts with //a[starts-with(@href,'http://ads').

Find all tags that contains the style attribute //*[@style].

Operators in XPath

The XPath expressions use operators to build the conditions to be evaluated. The following is the list of XPath operators:

Operator category












Div Division

MOD Modulus (division remainder)

Equality and comparison








Not equal

Less than

Less than or equal to

Greater than

Greater than or equal to




Logical Or

Logical And

Two node sets

| Union

Computes two node sets

The following table shows some examples for using the operators in XPath expressions:



//input | //div/input/..

Input union input where div is its parent


Retrieves the tables that have border greater than 1


Retrieves the text from the third row and second column and adds 1 to it

//tr[@id=1] and //tr[@id=3]

Returns true if both expression are true

Example of using XPath in finding the siblings which allow finding the object related to their siblings and not to their location:

<html> <Body> <br><br> <table name="maintable" border="1"> <th>Item</th><th>Quantity</th><th>Price</th><th></th> <tr id=1 width="600px"> <td> HP LoadRuuner </td> <td > 01 </td> <td> $27 </td> <td> <input type="button" value="AddToCart"> </td> </tr> <tr id=2 width="600px"> <td> HP Quality Center </td> <td> 01 </td> <td> $29 </td> <td> <input type="button" value="AddToCart"> </td> </tr> <tr id=3 width="600px"> <td > HP QuickTest Professional </td> <td > 01 </td> <td> $25 </td> <td> <input type="button" value="AddToCart"> </td> </tr> </table> </body> </html>

Add the code to the file and save it as an .html file. Click on the AddToCart button.

Remove the following recorded script:


Replace and use the following script:

Browser("Browser").Page("Page").WebButton("xpath:=//td[contains(te xt(),'HP QuickTest')]/following-sibling::td[3]/input").Click

This preceding script allows clicking on the button (AddToCart), which is the sibling of the HP QuickTest Professional text. To click on the AddToCart button, which is the sibling of HP Quality Center text, use the following code:

Browser("Browser").Page("Page").WebButton("xpath:=//td[contains(te xt(),'HP Quality Center')]/followingsibling:: td[3]/input").Click

XPath can be implemented in the QTP Scripts. The following section explains the various usages of XPath in a web page. Examples of the usage of XPath are:

  • Entering a value in the text box

  • Selecting the value from a drop-down list

  • Clicking on images and buttons

  • Finding objects by ID, tag name, name, and attributes

  • Allowing to extract the information for validation

  • Dealing with duplicate objects as array subscripts

Key steps to create a framework using XPath are:

  1. Identify the flow to be recorded.

  2. Create OR (create OR for each page or use the object description).

  3. Identify the XPath that identifies the object uniquely.

  4. Define the XPath that allows us to retrieve an element and defines it as a constant.

  5. Use them as object descriptions.


  • Use descriptive programming (use index property) for handling duplicate objects or array subscripts in XPath expressions

  • XPath allows the use of index for collection of elements

  • Retrieve innerHTML with GetROProperty to get the values

  • Define object description using XPath as constant, allowing easier maintenance, and only a single place to change and no need to change all over the script


In this article, we have learned about various concepts and examples. The knowledge of DOM, JavaScript, and XPath is very handy to create scripts. The XPath and DOM is the least used concept in the QTP for script creation and validation, but these are helpful in creating manual checkpoints by retrieving the data from the web pages conveniently. Path is a really good way to navigate your site when there are no IDs on elements that you need to work with or is near the element you want to work with.

Resources for Article :

Further resources on this subject:

Books to Consider

comments powered by Disqus