Multi Tab Support in Selenium Web Driver

Selenium Web Driver is capable of handling multiple browser tabs. Though the requirement to automate workflows that span multiple tabs is one that automation engineers don’t come across all the time, it’s always good to know how it can be done. 

Selenium Custom Locators

Selenium Web Driver supports both Xpath and CSS Locators as element locator strategies. As these strategies are comprehensive ideally there is no need to provide other abstract strategies such as ID and Class, but providing such strategies OOTB the designers of Selenium have lowered the entry barrier to automation using their library. So as framework developers you can take this further and provide other custom locator strategies to the users. The snippet below shows how a custom by class can be made to wrap around the XPath contains function.

A Comparison of Network Interception capabilities between Cypress and Selenium

Both Selenium and Cypress provide network interception capabilities. As the name implies, the capability allows the user to intercept HTTP requests and manipulate the response received for the given response. This is useful when you want to automate UI scenarios where the preconditions and steps required for the expected output can’t be easily produced.

To evaluate this capability I went about automating the 3 scenarios found below,

• Intercepting and waiting for a network resource attached to a web page to be received to the client side.
• Intercepting and simulating 400 and 500 errors.
• Intercepting and changing response payloads.

I found that Cypress provides HTTP level interception while Selenium simulates interception through the Web Driver client. And that interception in general is easier in Cypress. Selenium provides better control over response status code manipulation, but surprisingly selenium doesn’t provide a way to access the HTTP response codes through its client so asserting status code related scenarios may be more troublesome.

Cypress Examples

Selenium Examples

Abstracting the Test Layer using TestNG

The library architecture is popular among test automation framework designers. To follow this pattern, engineers decompose and abstract the automation logic at various conceptual levels, such as at the page, the component or at the element level. But usually, the test layer is left out of these decomposition efforts.

Leaving abstraction out of the test layer can in time lead to duplication of the logic as well as having to spend more time than what is required to script new scenarios. This post will discuss how the test layer can be abstracted and decomposed using TestNG.

High-level Steps

1. Start with designing and implementing test cases so that they are atomic
2. Encapsulate the test layer by scripting the test steps and adding assertions required to validate the component. Then put a mechanism in place to read the test data from an object that can be passed from one test class to another as required.
3. Finally, use the Factory feature in TestNG to compose the larger scripts using the test classes.

Let’s take a crude example of validating a web page with a dropdown[1]. For this example, I have identified the two test cases seen below,

1. Validate that the dropdown page loads the dropdown and that the values are as expected.
2. Validate that the dropdown allows the user to select the option he wants to select.

The test layers for the two test cases were scripted as seen below and were joined together using the factory annotation in the DropDrownTest class. Notice how the same test data object is passed between the two test cases.

Test Class 1

Test Class 2

Factory Class

[1] - https://the-internet.herokuapp.com/dropdown

[repo] - https://github.com/handakumbura/SeleniumAutomationEmployerProfile/tree/feature/atomic_test_cases

Portability testing a web application UI with Selenium

Portability testing of web application UI can easily be handled with Selenium. To handle cross browser testing you can implement a driver instantiation pattern like the one shown below,

For cross mobile agent testing, you can use a TestNG data provider to pass in the device types into your test method and repeat the test for as many emulated devices as you would like.

Find the complete project here, https://github.com/handakumbura/SeleniumAutomationEmployerProfile/tree/feature/cross_browser_cross_agent

How to read the user selection from a radio button group using Selenium?

SeleniumUtil library has been occupying my free time for the past couple of months. Since I’ve already written at length about what it is I won’t do that again here but if you really want to know you look here [1] [2].

When I implemented the abstraction wrapper for the HTML radio button group I ran into a problem. How would someone go about reading the user selection form a radio button group? Take a look at this HTML block,

According to the HTML5 spec, Radio Buttons belonging to the same group would have the same name attribute value. So toggling a given radio button using Selenium is not too difficult, but unlike Checkbox's the Radio Buttons I've seen in the wild (including this W3C example) doesn't append a checked attribute upon user selection. This complicates things.

I first tried retrieving the selection using the $0 variable that stores the user selection. But it turned out it was a browser specific variable that is not exposed to JavaScript. So how can we get a handle on this element and read its value? I did this,

But you can save all the pain because this snippet and bunch of other JavaScript goodies are available in SeleniumUtil 0.7.5.  

[1] - https://abuginthesystem.blogspot.com/2022/12/i-just-started-open-source-project-to.html

[2] - https://abuginthesystem.blogspot.com/2023/01/seleniumutil-070-is-now-available-with.html

SeleniumUtil 0.7.0 is now available with a few Java Script utility methods

Abstraction helps to promote code reuse and reduce development time among other benefits. When considering Selenium based test automation, you can abstract at many different points such as at dependency, infrastructure, technology, page, component or even at the element or locator level. SeleniumUtil is an open source library that aims to provide generic abstractions and other useful utilities so that you don’t need to worry about them in your Selenium based test automation projects.

Version 0.7.0 is now available in maven central and it provides a few technology level abstractions in the form of a few parameterized Java Script methods.

Usage

[repo] - https://github.com/handakumbura/Seleniumuntil 

Moving from Selenium to Protractor for Web Automation

99x Technology invests heavily in Quality Assurance, and this one of the reasons why the company has been able to carve out a name as a trusted product engineering company. The brunt of the QA work at 99x is achieved using automation, specifically protractor. 

As someone who is familiar with Selenium,TestNG and Java, I found myself a little intimidated at the prospect of learning a new stack including a new language(javascript) but to my delight I found the experience to be relatively pain-free and intuitive. In hindsight, I can clearly see the reasons as to why making the shift from Selenium to protractor makes sense.The main reasons as I see it are,

The fact that Angular and JS is taking over the web

As a technology invented and backed by Google, it was just a matter of time before AngularJS piggy backed into becoming the dominant web application technology around. Naturally, as Protractor is custom built to test angular apps, it makes sense to use it to test angular apps.  

Not having to meddle around with the web drivers 

Downloading the latest greatest web driver for each browser being tested and then setting up the driver in code and all the other steps that follow are pains associated with Selenium. As protractor is built as an API encapsulating selenium, it takes care of most of these pains. All you have to do is run the command to update and start the drivers and the API takes care of the rest. 

Not having to meddle around browser weights(sort of!)

Unlike Selenium Protractor provides is hard-wired for implicit weights for elements, it also supports explicit waits in the way of actions and browser sleep operations.

The backing of a Healthy community

Personally, i found the protractor community to be more active compared to that of Selenium’s. Maybe this is because its relatively. As protractor is built as an Node.JS package, it benefits from the NPM community. You can easily find extensions like reporters and data providers.    

....

Moving on, when making the switch(given you’re moving from java to javascript,  I did), give special attention the fact that JS is an asynchronous language, meaning, the language may process two program statements inside a code block parallelly as opposed to processing them sequentially as we expect in Java. The protractor API hides the complexities of working with the asynchronous nature of JS whenever you’re performing an action on the browser but whenever you’re receiving data from the browser to the test code, you need to explicitly handle the logic required to handle the parallelism, this is done through a mechanism named promises.

I’ve put together a project[1] that automates a set of test-cases for a banking app put up by way2automation tutorials site. The project uses most features available in protractor as well as some of the main functionality of jasmine and some of its extensions such as the html/screenshot reporter. The project embeds protractor as node module, therefore it can be executed as follows(not the project is expected to be run on windows).

npm run webdriver-update

npm run webdriver-start

npm run start