How To Locate Element By ID Locator In Selenium

How To Locate Element By ID Locator In Selenium

In the previous post we have seen “locators in Selenium”. In this post, we discuss “How To Locate Element By ID Locator”. Find the below links on How to find elements on a web page using different types of locators.

1. “ How To Locate Element By Name Locator ”
2. “ How To Locate Element By Class Name Locator ”
3. “ How To Locate Element By Tag Name Locator ”
4. “ How To Locate Element By Link Text/Partial Link Text Locator ”
5. “ How To Locate Element By CSS Selector Locator ”
6. “ How To Locate Element By XPath Locator ”

Coming to the actual post “How To Locate Element By ID Locator”.

ID Locator:

ID’s are unique for each element so it is common way to locate elements using ID Locator. As per W3C, ID’s are supposed to be unique on a page and it makes ID’s are the most reliable locator. ID locators are the fastest and safest locators out of all locators.

id = id of the element

Syntax:

1
findElement(By<span style=“color: #ff0000;”>.<em>id</em>(“IdName”)</span>)
  1. Open Mozilla Firefox and navigate to Gmail application.
  2. Open Firebug and inspect the enter your email input box. Take a note of its ID. Follow the below screenshot to do so.
  3. Copy the below mentioned script and execute in your system.

1
2
3
4
<span class=“nodeLabelBox repTarget “>&lt;<span class=“nodeTag “>div</span><span class=“nodeBracket editable insertBefore “>&gt;
&lt;<span class=“nodeTag “>label</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>class</span>=“<span class=”nodeValue editable “>hidden-label</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>for</span>=“<span class=”nodeValue editable “>Email</span>”</span>&gt;<span class=“nodeText editable “><span class=” “> Enter your email</span></span>&lt;/<span class=“nodeTag “>label</span>&gt;</span></span>&lt;<span class=“nodeTag “>input</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>id</span>=“<span class=”nodeValue editable “>Email</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>type</span>=“<span class=”nodeValue editable “>email</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>autofocus</span>=“”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>placeholder</span>=“<span class=”nodeValue editable “>Enter your email</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>name</span>=“<span class=”nodeValue editable “>Email</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>spellcheck</span>=“<span class=”nodeValue editable “>false</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>value</span>=“”</span><span class=“nodeBracket editable insertBefore “>&gt;
</span>&lt;<span class=“nodeTag “>input</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>id</span>=“<span class=”nodeValue editable “>Passwd-hidden</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>class</span>=“<span class=”nodeValue editable “>hidden</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>type</span>=“<span class=”nodeValue editable “>password</span>”</span><span class=“nodeAttr editGroup “> <span class=“nodeName editable “>spellcheck</span>=“<span class=”nodeValue editable “>false</span>”</span><span class=“nodeBracket editable insertBefore “>&gt;
</span>&lt;/<span class=“nodeTag “>div</span>&gt;

Value to be added in the By.id method:

1
findElement(By.id(“Email”))

Script:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
package seleniumTutorial;
 
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.<wbr />FirefoxDriver;
 
public class Locators {
      
       public static void main (String [] args){
               // Open browser
               WebDriver driver = new FirefoxDriver();
               // Open Application
               driver.get(“<a href=”https://www.gmail.com/” target=”_blank” rel=”noopener” data-saferedirecturl=”https://www.google.com/url?hl=en&amp;q=https://www.gmail.com&amp;source=gmail&amp;ust=1475225889620000&amp;usg=AFQjCNGWiJEPM95P3VkSISyTSrTuSE2t5A”>https://www.gmail.<wbr />com</a>”);
               // Locate the element using ID locator and enters test value “Software Testing Material”
               driver.findElement(By.id(“<wbr />Email”)).sendKeys(“Software Testing Material”);
 
      }
}