Xpath

Content
2

 What is Xpath?
 The Use of Xpath
 How we get Xpath form Mozilla Firefox
 What if the webpage does not support for
Firefox?
 What is IE DEVELOPER?
 How manually write Xpath?

XPath | Dasun Eranthika 11/24/2012

What is xpath?
3

 Webpage has varies of object (e.g.: images, text
boxes, text fields, buttons, radio buttons, check
boxes etc.)
 Each and every object has a unique id/name/path
called Xpath.
 If developer change the colour of a button in
webpage later, but the Xpath remain same.
 By using Xpath we can uniquely identify an
element of a webpage.
 Selenium actually uses xpath to identify elements.
 “Xpath is something unique for every element
of webpage.”

The use of xpath
4

 If you are willing to become an automation tester
in IT industry, learning xpath is makes the thing
easy.
 When automate a website, have to identify the
object of the each and every webpage according
to the test case. (It is not necessary to find the
xpath of every element of the page)
 Imagine you have to automate Gmail login, you
have to enter user name, password and click
“Sign In” button.
 Selenium identifies these two text fields and11/24/2012
XPath | Dasun Eranthika
button by using of xpath.

How we get xpath from Mozilla
5
Firefox
 If your webpage running on Mozilla Firefox,
very easy to get xpath.
 You have to install two add-ons for the Mozilla.
(Firebug and FirePath)
 Installing Firebug to Mozilla


6
Firefox(cont.)
 Installing Firebug to Mozilla
 What is Firebug?
 Firebug is a web development tool that facilitates
the debugging, editing, and monitoring of any
website's CSS, HTML, DOM, XHR, and
JavaScript; it also provides other web
development tools
 It simply install as an add-on for Firefox.

 How to Install Firebug
 Important:This is a Firefox add-on. So, please
make sure to surf using Firefox web browser.

7
Firefox(cont.)

After install Firebug, you can access it by [1] Firefox> Web
Nowtothe can Firebug element Add towebpagebutton Firebug, browser
Clickyou “Download” or it install and restart your icon on right upper of
Developer> inspect link which compatible with your Firefox first you
Wait Click [2] “+ of click the “Install browser
until on and the Firefox” using
Go www.getfirebug.com Simply click Firebug Firebug” button which
have to click the second icon inF12 key on your key board in
[3] press Firebug tool(which I mention
the browser or show in orange circle
orange colour circle)


8
Firefox(cont.)
 Installing FirePath to Mozilla
 What is FirePath?
 FirePath is a Firebug extension that adds a
development tool to edit, inspect and generate XPath
1.0 expressions, CSS 3 selectors and JQuery
selectors (Sizzle selector engine).
 How to Install FirePath
 Important: FirePath is an extension of Firebug. So,
please make sure to install Firebug to your Firefox
web browser before to install FirePath. And make sure
to surf this using Firefox web browser.


9
Firefox(cont.)

Click element inspect icon which I mentioned earlier and click one of
Open Firebug & click “FirePath” the add-on mention in orange circle)
Restart tab. browser
(which
Go to https://addons.mozilla.org/en-US/firefox/addon/firepath/ link and
Install
object in the webpage. (Here, I clicked Google image of www.google.lk
click on “+ Add to Firefox” button. (Which mention in orange circle)
). The Xpath is showing on green circle.


What if the webpage does not
10
support for Firefox?
 Today some web applications developed using
Pega is not support for Firefox, support for
Internet Explorer (IE).
 If we have to automate that kind of web site, it
will be tricky. (We have to write the Xpath
manually.)
 Before write the Xpath, we need an object
inspection tool for IE.


What is IE DEVELOPER?
11

 Internet Explorer Developer Tools (formerly known as
Internet Explorer Developer Toolbar), is a component
of Internet Explorer that aids in design and debugging
of web pages.
 It was introduced as a toolbar for Internet Explorer 6
and Internet Explorer 7.
 Internet Explorer 8 and Internet Explorer 9 include the
features built in.
 You can access to the IE Developer by pressing F12
or Tool > F12 developer tools
 If you don’t have IE Developer, you can download it
from http://www.microsoft.com/en-
us/download/details.aspx?id=18359

How manually write Xpath?
12

 Writing Xpath is not a big deal, but first time
you may think it is hard one.
 For one object, there may be several xpaths.
 Here I mentioned some xpaths for
objects.(which I wrote and generated by
FirePath)-both are correct.


13
(cont.)
 Text

My way: Firepath way:
//div[@id='mainContent']/p[1]/i .//*[@id='mainContent']/p[1]/i

14
(cont.)
 Image

//div[@id='sidebar']/img[@alt='Sele .//*[@id='sidebar']/img
nium Logo']

15
(cont.)
 Image Button

//div[@id='sidebar']/div[@class='do .//*[@id='sidebar']/div
wnloadBox']


16
(cont.)
 Link

//table[@id='choice']/tbody/tr/td/p/a .//*[@id='choice']/tbody/tr/td[1]/p/a
[contains(@href,'/projects/ide/')]


17
(cont.)
 Tab

//li[@id='menu_about']/a[contains( .//*[@id='menu_about']/a
@href,'/about/')]


18
(cont.)
 Text Field

//input[@id='q'] .//*[@id='q']


19
(cont.)
 Button

//input[@id='submit'] .//*[@id='submit']


20

 To download the PDF,
http://www.mediafire.com/view/?5wl8t2mk0021t94


“The Journey Just
Began”

I’m in…

XPath | Dasun Eranthika

Xpath

Recomendados

Recomendados

Más contenido relacionado

Similar a Xpath

Similar a Xpath (20)

Último

Último (20)

Xpath