Hiya folks! This post is all about Locating Elements on a web page (as promised in the previous post).
These days it has become really easy to identify one’s geographic location. GPS has made it possible. Similarly, the exact web element (such as, text box, check boxes, buttons, links, dropdowns etc.) that the Selenium IDE has to operate on can be identified using Locator Types.
If you notice the automated test script generated by Selenium IDE, it can be seen that most commands require a Target. This target identifies the web element under test and is of the format LocatorType=Location. The LocatorType can be omitted in most of the cases about which we will see shortly.
By now, it should have dawned on you that it is most significant to identify the web element precisely on the web page for creating a successful test script. And mark my words, it is easier said than done! At times we end up with incorrect elements or worst case, no element at all.
Why worry when we are in Magic Meadows? Selenium IDE provides many Locator Types to locate a web element on the web page accurately.
Locating by
- Id
- Name
- Link Text
- CSS
- DOM
- XPath
Locating by Id
When a web element’s Id attribute is known, we always tend to go for locating by Id. Since Id is unique, it is the most common way to locate the element under test.
Format: id=web_element_id
Example: Open Google Account creation page. Let us identify the first name text box by Id.
With the help of HTML (page source) or Firebug (we will see in detail in the upcoming posts), Id can be identified as shown in the above image.
Open Selenium IDE in Firefox browser and enter “id=FirstName” in the target text box. Click Find button and notice that the First text box of the Name section gets highlighted in yellow with the green border. This shows that Selenium IDE was successfully able to locate the element as expected.
Locating by Name
Name Locator Type locates the first web element with a matching name attribute. It is very similar to locating by Id whereas Id is replaced by Name.
Format: name= web_ element_name
Example: Open Google Account creation page. Let us identify the ‘Choose your username’ text box by Name using page source.
‘Find’ the element with Selenium IDE to verify if we located it accurately.
If multiple web elements have the same Name attribute, then filters are used to further refine the location strategy. The default filter type is value.
Example:
As highlighted above, if “name=travelType” location strategy is used, then a one-way radio button will be chosen on the web page as that is the first web element with the given name attribute. But if we wish to work with the round trip radio button as per the test case requirement, then locating by Name with Filters strategy is to be used.
Entering “name=travelType value=roundtrip” in the Target box of Selenium IDE and clicking ‘Find’ button will highlight the round trip radio button as expected.
Locating by Link Text
The best method to locate a hyperlink on a web page is to use locating by Link Text strategy.
Format: link=text_of_the_link
Example: Open Google Account creation page. Let us access the ‘Privacy Policy’ link by Link Text using page source.
‘Find’ the element with Selenium IDE to verify if we located it accurately.
I think that is just enough for one day. Rest will be discussed in the post to follow. Practice these strategies and let me know in case of any queries in the comments section.
See you until then! Have a great day!