Mastering UI testing: The power of stable locators

By Anna Sarancha, Quality Assurance Engineer, Grid Dynamics

Writing automated UI tests can be a daunting task, but it doesn’t have to be. By following a few simple tips, you can improve the flow of your testing process and even make it enjoyable.

In this blog, we’ll explore a crucial aspect of improving UI test workflows: the use of stable locators. These locators are the secret sauce to more effective and less frustrating UI testing. But what are stable locators, and how do they contribute to smoother testing?

One of the most impactful steps you can take is employing stable locators. These are unique identifiers for web elements that resist frequent changes. Think of them as the solid foundation of your UI testing. Using locators such as ID, name, or class name can make a world of difference.

It’s important to remember though, that testing is most effective when the entire team is involved. Automation is especially successful when everyone can collaborate closely. Developers play a crucial role in simplifying the lives of Automated Quality Assurance (AQA) engineers. How? By providing robust locators that remain consistent.

So, if your goal is to have fast and reliable UI tests, the key is clear: consistently incorporate static, unique web element locators for your page elements. Join us on this journey to explore the world of stable locators and unlock the potential of efficient UI testing.

What are web element locators?

Web element locators serve as the compass in UI test automation, guiding us to pinpoint unique elements within a webpage. The importance of having solid locators cannot be overstated. They are the linchpin to ensuring that your tests run swiftly, accurately, and remain easily maintainable.

Yet, the art of locating web elements is no walk in the park, particularly when elusive IDs and names are absent for elements that refuse to change from one release to the next (we call them “stable”). In such cases, the absence of reliable identifiers can plunge your tests into a realm of unpredictability and unreliability, a place no tester wants to be.

Locating the right web elements isn’t merely important; it’s a fundamental requirement when crafting automation scripts. In fact, it often stands as one of the most formidable challenges in the world of test automation, consuming valuable time and resources.

In this ever-evolving landscape of software testing, mastering the art of web element locators is the key to ensuring your tests stand strong, delivering reliable results every time. Join us as we delve deeper into the world of web element locators and uncover the secrets to robust and efficient UI testing.

Why adding web element locators is imperative for UI testing success

In the realm of UI testing, ID locators and Name locators stand as the gold standard for identifying web elements quickly and efficiently. However, they come with a caveat–they’re only reliable when web elements maintain consistent IDs or names across releases.

The optimal approach is to embrace the practice of incorporating one or more unique locators into key elements on your page. Depending on the situation, these can include:

• Test_ID
• ID
• Name
• Class name

While it’s not necessary to add every type of locator to all elements simultaneously, a best practice is to ensure at least one unique locator is assigned to each element.

Now, let’s consider the consequences of neglecting reliable locators in your UI tests. The outlook is not promising. Without dependable locators, you’re headed for a landscape of test failures, especially in scenarios such as:

• Dynamic locator generation: When locators change dynamically, your tests are left in limbo.
• UI evolution: As the UI evolves with new elements, deletions, or relocations, your tests will struggle to keep up.
• Element migration: If the target element shifts its position on the UI, your tests lose their way.
• Data fluctuations: Variations in data like new rows or altered sort orders can disrupt your tests.

The result? A significant time sink, as you’re forced to update tests with every minor change. Avoid this ordeal by understanding the crucial role of reliable locators and their pivotal contribution to successful UI testing.

Selecting the right elements for unique identifiers: A strategic approach

Adding unique locators to every single element may seem like an overwhelming task, and frankly, it’s not a practical approach. Instead, when incorporating locators, it’s vital to be strategic in your choices, focusing on the elements that hold significance for your test cases.

Let’s break down this strategy:

• Prioritize essential elements: Concentrate your efforts on elements that play a pivotal role in your test scenarios. For instance, when testing the login functionality, it’s imperative to assign locators to key elements like the email field, password field, and login button. In essence, your focus should be on elements directly tied to the primary user flows.
• Unique identifiers for vital buttons: As a best practice, refrain from using similar locators for multiple buttons, particularly when they share common attributes like class names. Consider this scenario: You have five buttons on a page, all adorned with the same class,”btn btn-sm bg-info”. While this may initially seem convenient, it becomes precarious when you need to distinguish between them or if even a minor style alteration occurs. To resolve this, supplementing each button with a unique name is the key. This not only streamlines locator creation but also ensures that your queries remain concise and free from unnecessary complexities.

In essence, embracing unique IDs, names, and class names for your locators simplifies the testing process. It leads to shorter, more efficient queries that don’t rely on extraneous anchors. By adopting this strategic approach to element selection, you pave the way for smoother and more effective UI testing.

Can AQA engineers add “test_id” independently or is developer involvement necessary?

The power to add “test_id” to elements is not restricted solely to developers. In fact, AQA professionals possess the capability to do so. However, this task isn’t without its considerations.

To effectively add “test_id” identifiers, AQA should possess a solid understanding of the project’s codebase and be intimately acquainted with its intricacies. While there’s no absolute prohibition on AQA undertaking this responsibility, there are instances where enlisting developer assistance is not only expedient but also reduces potential risks.

As highlighted earlier in this article, fostering a spirit of collaboration is pivotal. Working together as a cohesive team is the key to achieving the highest level of project quality. So, whether it’s AQA or developers, the ultimate goal is to harness collective expertise for the project’s benefit.

What else could help us with UI automation and locators specifically?

You might already be aware of tools that come to our rescue when it comes to writing locators for UI automation. Selenium IDE, for instance, offers the convenience of recording and playback for automated UI tests, along with a spectrum of locator options like ID, name, class name, and XPath. Appium Inspector steps in for mobile apps, allowing you to inspect the DOM tree and identify elements and their locators.

Now, while these tools are undoubtedly valuable, it’s essential to recognize that we’re living in an era where AI is no longer confined to the realms of fiction. The question naturally arises: what about AI-based tools specifically tailored to our needs?

Enter a new wave of AI-powered tools designed to revolutionize the lives of UI automation engineers. These tools are poised to elevate your capabilities in the field, making your journey as smooth as possible. Here’s a glimpse of some AI-based tools that could be your game-changers:

1. Testim: This AI-based tool can automatically generate locators for web elements. It uses machine learning to identify the elements and their locators. (https://www.testim.io/)
2. Katalon Studio: This tool provides a variety of locators, such as ID, name, class name, and XPath. It also has a built-in locator generator that can help you find the best locators for each element. (https://katalon.com/)
3. Applitools: Applitools is an AI-powered visual testing platform that helps you to create and maintain high-quality automated visual tests. It uses computer vision to identify and locate elements on a web page, even if the UI changes. (https://applitools.com/)
4. Functionize: Functionize is an AI-powered test automation platform that helps you to automate your tests without writing code. It uses machine learning to identify and locate elements on a web page, and it also generates test scripts automatically. (https://www.functionize.com/)

To conclude, we are living in a world of constant change. Therefore, each team should decide what approach works best for them when it comes to writing automated UI tests. However, it is important to remember that we are all part of the same team, and only by working together can we build a reliable environment for automated tests.

Get in touch with Grid Dynamics to learn more about UI test automation.