Building UI test automation for your web application is tricky—it takes days to implement, and after a few runs, you find the automated tests failing.
The root cause in most cases is *not* a bug in the application. More often than not, it turns out to be a flaky test due to data or environment issues.
In this post, I’ll walk you through how I successfully automated testing for a complex UI workflow and ensured it is resilient in multiple test runs. And you know what was a refreshing change? I was asked to try a low-code test automation tool - DevAssure.
I’ll share the exact steps I followed, the challenges faced and how DevAssure made it more reliable compared to traditional tools like Selenium or Playwright.
Who is This Blog for?
If you are an:
- Engineering Leader seeking to automate regression tests and seamlessly integrate them into the CI/CD pipeline.
- QA Manager who wants thorough regression coverage by reliably automating P0, P1 tests.
- Test Analyst who needs to automate tests quickly and do in-sprint test automation.
This guide is for you.
See the Automation In Action Before We Jump Into the Details!
I took up Akasa Air’s booking flow which involves several steps and completed the test automation for a scenario where there is a single passenger booking a flight. Let's start with the video and see how it works.
Major Steps in Automating Akasa Air’s Flight Booking
The flight booking process consists of several sequential steps:
- Selecting Source and Destination locations
- Selecting the travel date
- Selecting the number of passengers
- Searching for available flights
- Choosing the desired flight
- Adding passenger details
- Selecting a seat
- Making the payment
While these steps might seem straightforward, automating them introduces several complexities, especially due to dynamic content and changing UI states. Additionally, depending on the ticket type (such as Flexi fare), the steps may slightly differ.
Making the Automation Data-Driven
Some key fields in the booking process — specifically Source, Destination,Date Selection and Seat Selection — are better handled through data-driven testing to increase flexibility and prevent failures due to hardcoded values.
1. Dynamic Source & Destination Fields
To achieve this, I created a Test Data Table with two columns: Source and Destination, and populated multiple rows of data combinations.
DevAssure automatically reads this data and injects it into the test script, ensuring varied test scenarios with ease.
2. Handling the Date Field Dynamically
Initially, I hardcoded the travel date to a specific value, say 1st March, 2025. However, this approach made the test brittle as the test will fail as soon as the current date passes the hard coded date value.
To fix this, I wrote a JavaScript code block that dynamically calculates a future date:
- It fetches the current date.
- Adds a configurable integer value to the current date month.
- Outputs a valid future date every time the test runs.
const options = {
day: '2-digit',
month: '2-digit',
year: 'numeric',
};
const currentDate = new Date();
const futureDate = new Date(currentDate);
if (delta != 0) {
futureDate.setDate(Number(futureDate.getDate()) + Number(delta));
}
const formattedFutureDate = futureDate.toLocaleString('en-GB', options);
This ensures that the booking date is always valid and eliminates unnecessary failures.
Cracking the Automated Seat Selection Problem — My Eureka Moment!
One of the biggest challenges in airline booking flow is the automation of the seat selection step. Do you know why?
If the test script had a hard coded seat number, then the same test will fail in the second run itself because the seat is already booked. It's obvious that there needs to be dynamic seat selection.
But the catch is, we do not know upfront which seats are available, especially because it's a visual seat map. And I found a way to crack this challenge. Let me tell you how
First, I inspected Akasa Air's seat map using browser dev tools and discovered:
let number = Math.floor(Math.random() * max);
- Choose an unbooked seat using the array element having that number dynamically!.
The above steps might sound complex and difficult to implement but as you can see from the below screenshot it is only 3 lines of code when I use DevAssure.
(p.s. If I had to do this using Selenium or PlayWright, It would have taken several hours to code this)
This approach guaranteed dynamic seat selection every time the test ran, without failures due to already booked seats. DevAssure’s Web Actions played a vital role in executing this logic smoothly.
Why DevAssure Made This Automation Easier & More Reliable
After 2.5-days of initial orientation with the DevAssure tool, I was able to automate the booking flow in just 3 hours.
While Selenium and Playwright are powerful, they often introduce flakiness, especially when:
- Pop ups, modals, and iframes are involved.
- Element locators or text content changes dynamically.
Here’s how DevAssure tackled these common pain points:
1. Handling Iframes & Shadow DOMs Easily
For instance, Akasa Air’s payment portal is embedded within an iframe.
Testing this seamlessly is often a challenge in Selenium/Playwright.
DevAssure, however, handles iframes and shadow DOMs effortlessly, making the automation smooth and reliable.
2. Intelligent Backup Locators
Sometimes, button texts or element properties change (e.g., from “Get a demo” to “Ask for demo”), leading to test failures.
DevAssure introduces the concept of Backup Locators:
- If the primary locator fails, DevAssure intelligently identifies alternative locators on its own.
- This drastically reduces flaky test failures caused by minor UI changes.
3. Explicit Wait for Page Load
Some pages, like flight search or payment portals, may take longer to load.
With DevAssure, it’s straightforward to assign explicit wait times for particular pages, ensuring the script proceeds only when the page is ready.
4. Built-in Data-Driven Testing Support
DevAssure makes data-driven testing effortless. I created a Test Data Table with Source and Destination columns, added rows, and DevAssure automatically injected this data into the test script, added a function to calculate date dynamically and also automatic seat selection in the seat map — no extra configuration needed.
5. Report Generation When the Test Scripts Have Run
DevAssure automatically generates an HTML report at the end of each test execution, providing comprehensive details such as the total number of tests executed, their pass/fail status, test duration, and other key metrics.
Advanced Test Verification Using API Validation
Another key enhancement planned is integrating API response validation to make the automation more robust and reliable.
Suppose we are searching for flights from Dubai to New York and initially receive four flight results. However, upon performing the same search again, only three flights appear because one might have been booked or become unavailable. If the test case is hardcoded to expect exactly four results, it will fail, even though there is no actual issue or bug in the system.This is a classic example of a “flaky test’.
A right and stable approach is to find out the actual number of flights either by checking the database or better still by doing an API call to the backend engine (in this case, it is the Navitaire PSS) and verify the UI results against the API response. If both match, the test can proceed confidently.
DevAssure already provides built-in functionality to validate API responses and compare them with the front-end output. However, as of now, I do not have backend access, so this step has been skipped. But once access is granted, incorporating API validation will be a straightforward addition to strengthen the testing framework. This aspect is not yet implemented due to access constraints.
Conclusion
UI test automation has been a tricky challenge especially for complex web applications. However, low code test automation tools like DevAssure can help test analysts easily automate and build data driven test automation effectively.
What I liked about the tool was 4 things:
- Fairly easy interface to implement data-driven testing.
- It can handle iframes, modals, and shadow DOMs.
- The resilient backup locators really reduce flaky tests.
- And its one click integration to API makes dynamic validations work.
If you're looking to transition from purely manual testing to partially or fully automated regression tests, I’d be happy to help. Feel free to reach out to us at codewalnut.com.
