Selenium Xpath Tutorial Step by Step Guide provides real time examples to identify the elements with xpath in selenium Automation Testing,we can use xpath in Selenium Automation Testing when elements are not identify by the default locators,in this tutorial you will learn how to write xpath for different elements in a webpages for Selenium Automation Testing.
 |
Selenium XPath Tutorial |
Selenium Xpath Tutorial Step by Step Guide
Selenium Xpath Tutorial useful in identifying the elements in a webpage if default elements attributes are not provided by the application or in HTML pages.Let's start Xpath in Selenium,how to write xpath in selenium for web elements with examples.While you can identify the selenium xpath using some tools ,those are
Also Read:
Firebug - Firefox Plugin to identify element and to get xpath for elements with the help of Fire-path
WebDriver Element Locator tool - By this tool you can find xpath in C# , JAVA , PYTHON AND RUBY languages and separate X PATH locators also.You can download
this tool from Here(WebDriver Element Locator).
Selenium xpath can written in two ways.those are as follows
1.Absolute Path – Locating the Elements from root element to destination elements through the nodes and attributes.
2.Relative Path – In Relative path, xpath can be write with the help of- Tag names
- Attribute names
- Attribute values
Relative Path:
Xpath in Selenium can be written in Relative path as based on tag names,tag attributes name and tag attributes values,let's see the below examples.Syntax : //tagname[@attribute name='attribute value']
Relative Path Examples:
If we have taken input type tagname for below codeXpath for Input Tag with attributes :
<input id="firstname" name="firstname"/>You can write xpath for above code as below
Tag name - input
Attribute name - id, name
Attribute value - firstname
//input[@id='firstname']
//input[@name='lastname']
Example 2 :
<input id="searchbox" class="gsfi" type="text" label="Search" title="Searchbox" name="wordsearch" />For above code you can write Selenium xpath as follows
XPATH:
//input[@id='searchbox']//input[@class='gsfi']
//input[@type='text']
//input[@title='searchbox']
//input[@name='wordsearch']
Xpath using Contains keyword:
We can write Xpath in Selenium using element attributes but here i am using contains keyword,let's see below examples<input id="searchbox" class="gsfi" type="text" label="Search" title="Searchbox" name="wordsearch" />
Xpath Examples:
//input[contains(@id,'searchbox')]//input[contains(@class,'gsfi')]
//input[contains(@type,'text')]
//input[contains(@title,'searchbox')]
//input[contains(@name,'wordsearch')]
Xpath for href url link:
For example i am using below simple url link ,please see below xpath and html code.<a class="gb_P" data-ved="0EMIuCBMoAA" href="https://mail.google.com/mail/?tab=wm" data-pid="23">Gmail</a>
You can write xpath for above code as below
tagname - a
tag attributes - class,data-ved,href
attribute values - gb_P,0EMIuCBMoAA,https://mail.google.com/mail/?tab=wm
XPATH:
//a[@data-ved='0EMIuCBMoAA']//a[@class='gb_P']
//a[@href='https://mail.google.com/mail/?tab=wm']
//a[contains(@data-pid,'23')]
//a[contains(@data-ved,'0EMIuCBMoAA')]
//a[contains(@class,'gb_P')]
//a[contains(@href,'https://mail.google.com/mail/?tab=wm')]
//a[contains(@data-pid,'23')]
Xpath using and :
As we see till now you can write xpath with single attributes but now we can write with multiple attributes,let's see below example.<input id="searchbox" class="gsfi" type="text" label="Search" title="Searchbox" name="wordsearch" />
XPATH:
//input[contains(@id, 'seaarchbox') and contains(@label,'seaarch')]//input[contains(@class, 'gsf1') and contains(@label,'seaarch')]
Xpath for Dropdowns:
You can write different Xpath in Selenium for list boxes in order to select the list items,let's see below HTML code and xpath examples.<select id="ArchiveMenu">
<option value="1">Banana</option>
<option value="2">Apple</option>
<option value="3">Selenium</option>
<option value="4">Automation Testing</option>
</select>
XPATH:
//select[@id='ArchiveMenu']//select[contains(@id,'ArchiveMenu')]
//select[@value='1']
//select[contains(@value,'2')]
//select[contains(.,'Automation Testing')]
//select[contains(.,'Apple')]
2.Absolute path:
Absolute path uses complete path from the Root Element to the desire respective element.Root Element - <html>
Desired Element - <div>,<input> etc
Example: /html/body/div[5]/div[2]/div/div[2]/div[2]/h2[1]
Now let's how to write Absolute Xpath with below examples
HTML Code:
<html>
<head>
<title>Selenium Automation</title>
</head>
<body>
<form>
First Name:
<input type="text" name="firstname"><br>
Last Name:
<input type="text" name="lastname"><br>
Password:
<input type="password" name="pwd"><br>
Radio Button: Are you male or female?<br>
<input type="radio" name="sex" value="male">Male
<input type="radio" name="sex" value="female">Female<br>
Check Box: Check the languages you know<br>
<input type="checkbox" name="language" value="html">HTML<br>
<input type="checkbox" name="language" value="php">PHP<br>
<input type="checkbox" name="language" value="c">C<br>
<input type="submit" value="submit"><br>
</form>
</body>
</html>
If i want to find First Name by xpath ,you can write as below
/html/body/form/input - FirstName
/html/body/form/input[2] - Lastname
/html/body/form/input[3] - Password
/html/body/form/input[4] - Male radio button
More Examples:
As you see above image i want to find the input search box element which is located under 3rd div - 1st div - input ,let's see the below xpath. |
| ABSOLUTE XPATH - EXAMPLE |
XPATH:
/html/body/div/div[3]/form/div[2]/div[2]/div[1]/div[1]/div[3]/div/div/div[3]/div/input[1]Root Element - /html/
Element Path - /body/div/div[3]/ before form
Path to Desire Element - Below Form -form/div[2]/div[2]/div[1]/div[1]/div[3]/div/div/div[3]/div/input[1]
Under form 2nd div
Under 2nd div - 2nd div
Under 2nd div - first div
Under first div - again first div
Under First div - again first div
Under First div - Thrid div div[3]
Like this path will continue for absolute path xpath in Selenium.
