6 Ways AB Testing Helps Boost Your Ecommerce Business

Selenium has become a crucial part of automation testing. Developers prefer selenium because it provides excellent flexibility and allows teams to run tests on a local machine or cloud. As an automation engineer, you must know the importance of locators in selenium testing. 

With the help of locators, you can easily access web elements that perform specific actions like click, type, checkboxes, etc. 

This blog will help you understand selenium locators and their strategies. 

Here, we will discuss the use of selenium locators, their types, and use cases. We will also learn to use locators with different automation testing frameworks.

What are Selenium Locators? 

Selenium locators form the base in which the selenium automation test scripts are made. As a tester, you must choose the best selenium locators available out there. Because if you don’t, there are chances that your test cases will fail and become more flaky or brittle. 

Locators are essential because all the interactions that must be performed with the elements in the DOM are done with their help. 

When you are testing web applications, you need to perform specific actions like click, type, and checkboxes on the HTML elements. We know that in manual testing, these actions are performed manually. But in automation testing, we need to automate them. We want the automation tools to test the scripts in the same way a human does. 

Selenium locators will help the automation tool identify that an operation will be performed on this particular HTML element only. 

Locators are helpful in finding HTML elements in the webpage. Selenium locators are extremely useful when it comes to testing scripts using selenium. There are different types of locators available in selenium. As this blog is a complete guide about selenium locators, everything necessary related to them will be discussed here. 

Strategy for Locating a Web Element in DOM 

DOM stands for Document Object Model. Locators are used to find the web element in the DOM. 

Given below are some common steps that you can use to identify the web element in Google Chrome. 

  1. Right-click or press F12 on the web page to access DOM in Google Chrome.
  2. After pressing the required key, click on the inspect option. Now, the developer’s tool console will appear that will by default open the “Elements” tab. 
  3. The “Elements” tab describes the entire DOM structure of the Webpage. 
  4. Now that we have the DOM structure, we need to find its web elements. 
  5. Somewhere on the screen, you will find the mouse icon arrow. Click on that to select the web elements. 
  6. This way, you can easily search the HTML element in the DOM and grab a locator for these web elements. 

Different Types of Locators in Selenium

Selenium provides major 8 types of locators. Each one of them will be discussed in detail here. 

  1. CSS ClassName: This operator uses the class attribute to identify an object. 
  2. Xpath: Xpath is a language that can find elements on any page.
  3. CSS ID: The ID attribute is another way of identifying elements in the webpage. 
  4. Name: It is used to find elements using the name attribute. 
  5. tagName: tag name can also be used to locate elements in the webpage. 
  6. partialLinkText: We can also find elements using part of the text in the link. 
  7. cssSelector: CSS not only styles the web pages but can also identify an element. 
  8. LinkText: using hyperlink text to locate an element in the webpage.

This was just an introduction to what these locators do. Given below is their detailed description. 

Strategies to use Selenium Locators are: 

1) CSS ClassName

If you want to locate elements on the web page, you can simply search for their class name. The class attribute of the HTML tag contains the class name. .find_element_by_class_name method is used to return the first element with the matching class and raises NoSuchElementException if the element is not found.

Given below are some steps you must follow to locate a particular web element using the class name. 

  1. Click on the sample webpage and launch an IDE to open the test suite. (If a test suite doesn’t already exist, you need to create one) 
  2. Create a new class file by right-clicking on the “src” folder.
  3. Now name your class_test and click on the finish button. 
  4. Step 4 is to get started with coding to launch your browser. 
  5. Once the browser is invoked, it’s time to locate the desired web element through its class name.  
  6. You need to inspect the HTML codes to locate a particular web element. 

2) CSS ID

This section is all about learning how to locate web elements using ID attributes. It is one of the easiest ways of locating elements on the webpage. CSS ID is a unique number that is different for every page by design. CSS ID is stored in the ID attribute of the CSS DOM element. 

NoSuchElementException will be raised if the required ID is not found. The ID is one of the fastest, unique, and most reliable methods of determining an element. With advancements in technology, IDs are now generated dynamically, which makes them not so reliable anymore. 

Given below are some steps you must follow to locate a particular web element using CSS ID. 

  1. Click on the sample webpage and launch an IDE to open the test suite. (If a test suite doesn’t already exist, you need to create one) 
  2. Create a new class file by right-clicking on the “src” folder.
  3. Now name your class as Locator_one and click on the finish button. 
  4. Step 4 is to get started with coding to launch your browser. 
  5. Once the browser is invoked, it’s time to locate the desired web element through its ID attribute. 
  6. You need to inspect the HTML codes to locate a particular web element. 

3) Xpath

XML path comes in use when one cannot locate web elements using the class name or ID. Relative ways are much better than absolute paths because they are less prone to errors, and we can change HTML structures here as they are much more flexible. 

Let us suppose you want to locate an element on the web, but you don’t have the required ID or name attribute. In this case, you can use XPath as a substitute locator. 

XPath is a little different from other locators because it allows you to select individual elements, attributes, and some other parts of XML documents to specify the location of a particular web element.   

Different ways of writing dynamic XPaths are: 

  1. Single Slash
  2. Double Slash 
  3. Single Attribute
  4. Multiple Attribute
  5. AND
  6. OR
  7. contains()
  8. starts_with()
  9. text()
  10. last()

     XPath is a language that is used for locating nodes in XML documents. 

4) Name

The first element with the matching class is returned using the .find_element_by_name() method. When you are searching for the element with its name and multiple aspects of the same name exists. In this case, the method will return the first matched element. 

But if no matching elements are found, then NoSuchElementException will be given. Whenever you are using a name attribute to find the web element, make sure that it contains a unique value. 

Given below are some steps you must follow to locate a particular web element using the name attribute. 

  1. Click on the sample webpage and launch an IDE to open the test suite. (If a test suite doesn’t already exist, you need to create one) 
  2. Create a new class file by right-clicking on the “src” folder.
  3. Now name your class as Name_Test and click on the finish button. 
  4. Step 4 is to get started with coding to launch your browser. 
  5. Once the browser is invoked, it’s time to locate the desired web element through its name attribute. 
  6. You need to inspect the HTML codes to locate a particular web element. 

5) tagName

Apart from ClassName, name, ID, and XPath, there are several other locators that help in finding elements in the webpage.

.find_element_by_tagName() method is just another way of finding elements using the selenium locator. 

Given below are some steps you must follow to understand the use of locators to identify a particular web element using a tag name.

  1. Click on the sample webpage and launch an IDE to open the test suite. (If a test suite doesn’t already exist, you need to create one) 
  2. Create a new class file by right-clicking on the “src” folder.
  3. Now name your class Tag_test and click on the finish button. 
  4. Step 4 is to get started with coding to launch your browser. 
  5. Once the browser is invoked, it’s time to locate the desired web element through its tag name. 
  6. You need to inspect the HTML codes to locate a particular web element. 

 

6) PartialLinkText 

.find_element_by_partial_link_text() method is used to search hyperlink text elements using selenium locators. The partial link text can be used for elements containing anchor <a> tags. Just like other locator strategies, if a page has multiple hyperlinks with the same text, then Selenium will always choose the first one. 

Given below are some steps you must follow to locate a particular web element through its partial link test. 

  1. Click on the sample webpage and launch an IDE to open the test suite. (If a test suite doesn’t already exist, you need to create one) 
  2. Create a new class file from New > Class by right-clicking on the “src” folder.
  3. Now name your class as Partial_link and click on the finish button. 
  4. Step 4 is to get started with coding to launch your browser. 
  5. Once the browser is invoked, it’s time to locate the desired web element through its partial link text. 
  6. You need to inspect the HTML codes to locate a particular web element. 

7) CSS Selectors

CSS selectors are used not only to design web pages but to locate web elements in the HTML DOM structure as well. It is an abbreviation for Cascading Style Sheets, which are used to style webpages and also provide effective use of selectors.

These selectors are used to identify an element based on the combination of HTML tag, ID, class, and attributes. 

There are 6 different modes in which CSS selectors work to locate the web elements.

  1. Tag and ID
  2. Tag and class
  3. Tag and attribute
  4. Tag, class, and attribute
  5. Sub-string matches  

8) LinkText 

.find_element_by_link_text() method is used to search hyperlink text elements using     selenium locators. The link text can also be used for elements containing anchor <a> tags. Selenium will choose the first text that is returned if multiple hyperlinks with the same text are available. 

Given below are some steps you must follow to locate a particular web element through its link test. 

  1. Click on the sample webpage and launch an IDE to open the test suite. (If a test suite doesn’t already exist, you need to create one) 
  2. Create a new class file by right-clicking on the “src” folder.
  3. Now name your class as link_test and click on the finish button. 
  4. Step 4 is to get started with coding to launch your browser. 
  5. Once the browser is invoked, it’s time to locate the desired web element through its link text. 
  6. You need to inspect the HTML codes to locate a particular web element. 

Dos and Don’ts for Selenium Locators

  1. Locators should never be used for identifying auto-generated elements on the webpage.
  2. Elements generated at run time must be avoided because they may cause breakage during script execution. 
  3. Always make sure that locators are pointing towards the required element in the webpage. Because if that’s not the case, then your script will break. In simple words, if you need one element for an operation, then point out a single element only. There is no need to locate multiple elements. 
  4. The use of dynamic attribute values to locate elements is not recommended because they are constantly changing. These changes break the script and which in turn affects the maintainability, reliability, and efficiency of the test codes. 
  5. Using Google Dev tools to generate XPath may seem like the best idea, but in the long run, it’s not. It is advised to create a customized XPath if you want to reduce reliability issues, code breakage, and maintainability issues in the long run. 

Conclusion

Selenium locator strategies are very important for the web automation testing framework. Testing requirements, the structure of the webpage, and the location of the elements on the page are a few factors on which the locator strategy depends. 

You can also use these Selenium Locator strategies while running your Selenium test scripts on cloud-based testing infrastructures such as LambdaTest. LambdaTest is an intelligent unified digital experience testing cloud that helps businesses drastically reduce time to market through faster test execution, ensuring quality releases and accelerated digital transformation. The platform allows you to perform Selenium testing on both real time and automation testing across 3000+ environments and real mobile devices, making it a top choice among other cloud testing platforms.

In this blog, we discussed the 8 most significant Selenium locator strategies. Those are ID, Name, Class Name, tag name, Link Test, Partial link test, XPath, and CSS Selectors. The success of your automation tests depends on selecting the right locator strategy at the right time. 

Do remember that web pages are constantly changing, and page elements are getting updated frequently. That is why it is critical to keep the locator strategies up-to-date. 

If you master the use of selenium locator strategies, the accuracy, efficiency, and reliability of your automation tests will skyrocket drastically. With this complete guide, you should now have a solid foundation to begin using these strategies effectively in your automation testing projects.

Follow Techiemag for more!

RELATED ARTICLESMORE FROM AUTHOR