Ways to get the web element locator. Before we get into the Selenium commands, we will learn how to determine the element’s locator, which is quite important.
So, what is a Locator? If Manual Testing we can know where to enter data, click on buttons, checkboxes, identify items before and after changes, …. But for automation, how does the machine have can understand it will work on the link, button, check box …. which one? That’s when Locator is needed. Every HTML element in a webpage is identified by Locator. Locator helps distinguish UI objects on software we need to test.
1. ID
How to get Locator using Id seems to be the simplest and most convenient way. Each element on a web page usually has a unique ID. But not every developer will set an ID for each element. Because this will take time and is not really necessary for most elements on the site.
After get get id. We use the following statement to declare this element
WebElement username = driver.findElement ( By.id (“login-username”)); Note: There are a number of Frameworks that support dev to generate Ids automatically. So each run will produce different IDs. At this time it will no longer be possible to use the ID attribute to identify the Locator.
2. Name
The Name attribute is also similar to Id. Each element on a web page will usually be given a unique name. Similar to ID, this Name is not required, so we may not always use Name
After get name. We use the following statement to declare this element:
WebElement password = driver.findElement ( By.name (“password”));
3. Linktext
The link text is displayed quite clearly because it displays right on the UI. We use the following statement to declare this element:
WebElement loginFacebook = driver.findElement (By.linkText (“Login with Facebook”)); But this method should not apply if the link text often changes and the content of the link text in a page has many of the same text.
4. CSS Selector
Rely on CSS paths or combine multiple CSS together. We can identify only one or more element elements
The following example combines the Type and Placehoder attributes to identify an element
After defining the CSS Selector. We use the following statement to declare the element
WebElement password = driver.findElement (By.cssSelector (“[type = ‘password’] [placeholder = ‘Your Password’]”));
5. XPath
This approach is almost common and is used most in the automation testing community. To access UI elements, XPath can both use paths and combine operations, manipulate strings, so there are many ways we can get XPpath. . Here are a few ways to get XPath.
Use @ attribute Use @ to declare element element attributes. See the following example to understand how to use @
<input placeholder = “Search Viblo” value = “” class = “sb__input”>
Here is an input tag with attribute placehoder = “Search Viblo”. We can use @ to get XPath as follows
Xpath = // input [ @placeholder = ‘Search Viblo’]
In the input tag also has attribute class = “sb__input”. Similarly we can use
XPath = // input [ @class = ‘sb__input’]
After identifying XPath. We use the following statement to declare the element
WebElement searchViblo = driver.findElement (By.xpath (“// input [ @placeholder = ‘Search Viblo’]”));
Working with strings Use text () <a href=”/questions” class=”text-white text-bold”> Ask on Viblo »</a>
Here is a tag, with text = “Ask on Viblo” “To use the text () get XPath for this element, please note that you have to copy all the text. Xpath = // a [text () = ‘Ask on Viblo »’]
After identifying XPath. We use the following statement to declare the element
WebElement askViblo = driver.findElement (By.xpath (“// a [text () = ‘Ask on Viblo»’ “)));
Using contains () is similar to text (), but it is not necessary to copy all the text, but only a short copy of something is sufficient to identify the UI element <a href = “/ pages / create /? ref_type = registration_form “class =” _ 8esh “> Create a Page for celebrities, brands or businesses. </a>
Instead of having to copy all the text as the use of text (), when using contains () you just need to use text = “brand or business” is enough to get xpath for this element.
Xpath = // a [contains (text (), ‘brand or business’)]
After identifying XPath. We use the following statement to declare the element
WebElement openLink = driver.findElement (By.xpath (“// a [contains (text (), ‘brand or business’)]”)));
In addition, we can use some tools like Xpath Finder, WebDriver Element Locator to support the locator’s get in the fastest and most effective way.