This post shows you few examples of using XPATH in QTP along with an example of using CSS in QTP. At the end you can have various awesome resources to learn XPATH & CSS.
One of the new web testing capabilities in QTP 11.0 is new Web object identifiers for identifying objects by their Xpath or CSS definitions. Below we will look at an example of identifying objects by their Xpath or CSS definitions.
Example 1 - Using XPATH & CSS with QTP
Write the below code in Notepad and save it as a .html file.
On opening the file in IE, it will look like as below:
Open that HTML file in IE and open a new test in QTP and click on Record. Click on first Click button, a message box will open, click ok. Click on second Click button, a message box will open, click ok. Click on third Click button, a message box will open, click ok. Your code in QTP will look like:
Now lets change the first line of above code into Descriptive Programming and your code will look like:
If you Run this above code on that same IE window, it says - The "[WebButton]" object's description matches more than one of the objects currently displayed in your application.
In order to remove the above error, and to make sure that QTP recognises the first click button correctly, lets use CSS property.
The above used CSS property recognises first click button correctly.
Now for the second button lets use Xpath property to recognize it uniquely as below
//TR[@id='two'] says select all TR elements where id = 'two' and /*/INPUT means all INPUT elements that are grandchildren of "all TR elements where id = 'two'". In other words - Click on Input element which is grandchild of [any] TR element with id='two'.
Example 2 - Using XPATH with QTP
Below is the HTML file I created:
On opening the file in IE, it will look like as below:
Below 2 examples (a & b) work fine with above HTML file, but when you try 3rd example (c), it will show the following error:
The "[ WebButton ]" object's description matches more than one of the objects currently displayed in your application. Add additional properties to the object description in order to uniquely identify the object.
Both examples (a & b) click on first button.
a)
b)
c)
The 3rd example (c) will fail because //TD means all TD elements in document and TD//INPUT means All INPUT elements one or more levels deep in the TD element (arbitrary descendants). So this is not unique scenario.
These below 2 also work well:
d)
e)
Above examples (a, b, d & e) are different ways of using XPATH to recognize the same button.
For understanding XPATH you can go through the below awesome resources:
You can search tutorial on Google or look at the ones below:
XPath Reference with examples.
Another XPath Tutorial.
XPath on adp-gmbh.
XML Path Language (XPath) 2.0 (Second Edition).
XML in a Nutshell - Chapter 9 - Xpath
XPath by schlitt.
For understanding CSS you can go through the below awesome resources:
Getting Started (CSS Tutorial).
CSS Tutorial.
CSS Beginner Tutorial.
One of the new web testing capabilities in QTP 11.0 is new Web object identifiers for identifying objects by their Xpath or CSS definitions. Below we will look at an example of identifying objects by their Xpath or CSS definitions.
Example 1 - Using XPATH & CSS with QTP
Write the below code in Notepad and save it as a .html file.
On opening the file in IE, it will look like as below:
Browser("Browser").Page("Page").WebButton("Click").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Browser("Browser").Page("Page").WebButton("Click_2").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Browser("Browser").Page("Page").WebButton("Click_3").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Now lets change the first line of above code into Descriptive Programming and your code will look like:
Browser("Name:=Test-Browser").Page("Title:=Test-Browser").WebButton("name:=Click").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Browser("Browser").Page("Page").WebButton("Click_2").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Browser("Browser").Page("Page").WebButton("Click_3").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
If you Run this above code on that same IE window, it says - The "[WebButton]" object's description matches more than one of the objects currently displayed in your application.
In order to remove the above error, and to make sure that QTP recognises the first click button correctly, lets use CSS property.
Browser("Name:=Test-Browser").Page("Title:=Test-Browser").WebButton("css:=tr.OrangeRow input").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Browser("Browser").Page("Page").WebButton("Click_2").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Browser("Browser").Page("Page").WebButton("Click_3").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
The above used CSS property recognises first click button correctly.
Now for the second button lets use Xpath property to recognize it uniquely as below
Browser("Name:=Test-Browser").Page("Title:=Test-Browser").WebButton("css:=tr.OrangeRow input").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Browser("Name:=Test-Browser").Page("Title:=Test-Browser").WebButton("Xpath:=//TR[@id='two']/*/INPUT").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
Browser("Browser").Page("Page").WebButton("Click_3").Click
Browser("Browser").Dialog("Message from webpage").WinButton("OK").Click
//TR[@id='two'] says select all TR elements where id = 'two' and /*/INPUT means all INPUT elements that are grandchildren of "all TR elements where id = 'two'". In other words - Click on Input element which is grandchild of [any] TR element with id='two'.
Example 2 - Using XPATH with QTP
Below is the HTML file I created:
Below 2 examples (a & b) work fine with above HTML file, but when you try 3rd example (c), it will show the following error:
The "[ WebButton ]" object's description matches more than one of the objects currently displayed in your application. Add additional properties to the object description in order to uniquely identify the object.
Both examples (a & b) click on first button.
a)
Browser("name:=Test-Browser").Page("title:=Test-Browser").WebButton("Xpath:=
//TR[@class='GreenRow']/*/INPUT").Click
Browser("name:=Test-Browser").Dialog("text:=Message from webpage").WinButton("text:=OK").Click
b)
Browser("name:=Test-Browser").Page("title:=Test-Browser").WebButton("Xpath:=//TR[@id='three']/*/INPUT").Click
Browser("name:=Test-Browser").Dialog("text:=Message from webpage").WinButton("text:=OK").Click
c)
Browser("name:=Test-Browser").Page("title:=Test-Browser").WebButton("Xpath:=//TD//INPUT").Click
Browser("name:=Test-Browser").Dialog("text:=Message from webpage").WinButton("text:=OK").Click
The 3rd example (c) will fail because //TD means all TD elements in document and TD//INPUT means All INPUT elements one or more levels deep in the TD element (arbitrary descendants). So this is not unique scenario.
These below 2 also work well:
d)
Browser("name:=Test-Browser").Page("title:=Test-Browser").WebButton("Xpath:=//TR[@id != 'four']/*/INPUT").Click
Browser("name:=Test-Browser").Dialog("text:=Message from webpage").WinButton("text:=OK").Click
e)
Browser("name:=Test-Browser").Page("title:=Test-Browser").WebButton("Xpath:=
//TR/TD[contains(text(), 'Green')]/following-sibling::td/INPUT").Click
Browser("name:=Test-Browser").Dialog("text:=Message from webpage").WinButton("text:=OK").Click
Above examples (a, b, d & e) are different ways of using XPATH to recognize the same button.
For understanding XPATH you can go through the below awesome resources:
You can search tutorial on Google or look at the ones below:
XPath Reference with examples.
Another XPath Tutorial.
XPath on adp-gmbh.
XML Path Language (XPath) 2.0 (Second Edition).
XML in a Nutshell - Chapter 9 - Xpath
XPath by schlitt.
For understanding CSS you can go through the below awesome resources:
Getting Started (CSS Tutorial).
CSS Tutorial.
CSS Beginner Tutorial.