Published on

xpath is use to identify objects in webpages. It can use for test automation.

Published in: Technology
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide


  1. 1. XPATHDasun Eranthika
  2. 2. Content2  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
  3. 3. 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.” XPath | Dasun Eranthika 11/24/2012
  4. 4. The use of xpath4  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.
  5. 5. How we get xpath from Mozilla5 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 XPath | Dasun Eranthika 11/24/2012
  6. 6. How we get xpath from Mozilla6 Firefox(cont.)  Installing Firebug to Mozilla  What is Firebug?  Firebug is a web development tool that facilitates the debugging, editing, and monitoring of any websites 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. XPath | Dasun Eranthika 11/24/2012
  7. 7. How we get xpath from Mozilla7 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) XPath | Dasun Eranthika 11/24/2012
  8. 8. How we get xpath from Mozilla8 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. XPath | Dasun Eranthika 11/24/2012
  9. 9. How we get xpath from Mozilla9 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. XPath | Dasun Eranthika 11/24/2012
  10. 10. What if the webpage does not10 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. XPath | Dasun Eranthika 11/24/2012
  11. 11. 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 XPath | Dasun Eranthika 11/24/2012
  12. 12. 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. XPath | Dasun Eranthika 11/24/2012
  13. 13. How manually write Xpath?13 (cont.)  Text My way: Firepath way: //div[@id=mainContent]/p[1]/i .//*[@id=mainContent]/p[1]/i XPath | Dasun Eranthika 11/24/2012
  14. 14. How manually write Xpath?14 (cont.)  Image My way: Firepath way: //div[@id=sidebar]/img[@alt=Sele .//*[@id=sidebar]/img nium Logo] XPath | Dasun Eranthika 11/24/2012
  15. 15. How manually write Xpath?15 (cont.)  Image Button My way: Firepath way: //div[@id=sidebar]/div[@class=do .//*[@id=sidebar]/div wnloadBox] XPath | Dasun Eranthika 11/24/2012
  16. 16. How manually write Xpath?16 (cont.)  Link My way: Firepath way: //table[@id=choice]/tbody/tr/td/p/a .//*[@id=choice]/tbody/tr/td[1]/p/a [contains(@href,/projects/ide/)] XPath | Dasun Eranthika 11/24/2012
  17. 17. How manually write Xpath?17 (cont.)  Tab My way: Firepath way: //li[@id=menu_about]/a[contains( .//*[@id=menu_about]/a @href,/about/)] XPath | Dasun Eranthika 11/24/2012
  18. 18. How manually write Xpath?18 (cont.)  Text Field My way: Firepath way: //input[@id=q] .//*[@id=q] XPath | Dasun Eranthika 11/24/2012
  19. 19. How manually write Xpath?19 (cont.)  Button My way: Firepath way: //input[@id=submit] .//*[@id=submit] XPath | Dasun Eranthika 11/24/2012
  20. 20. 20  To download the PDF, http://www.mediafire.com/view/?5wl8t2mk0021t94 XPath | Dasun Eranthika 11/24/2012
  21. 21. “The Journey Just Began”I’m in… XPath | Dasun Eranthika