As a test automation architect, I am always on the lookout for the best solutions that can help reduce the feedback loop between development and QA. As development cycles speed up, having the ability to release features at breakneck speed has become crucial to the success of many organizations. With software infrastructure becoming ever more complicated, and multiple teams contributing to a single application to accommodate these release cycles, the need for effective solutions to catch bugs as fast as possible has never been greater. Enter Applitools.
Joining The Applitools Hackathon
Applitools has been making waves across the test community for years now by disrupting the traditional means by which test engineers automate their solutions with more coverage, fewer lines of code, and less time spent toward test maintenance. In a stroke of genius, they have invited engineers worldwide to participate in hackathons leveraging the Applitools Ultrafast Grid to show them firsthand how powerful the tool can be. ?
…standing up an automated test solution can easily take hours to lay the groundwork before you write a single test. The best part of leveraging Cypress and Applitools is that it took roughly one hour from start to finish including the development of my tests, which is almost unheard of.
Kerry McKeever
During my first Applitools hackathon, I set up my framework how I traditionally would for any company requiring strong cross-browser compatibility. To do this, I leveraged Selenium and C#, since that is what stack I had been working on for multiple employers up to that point. My challenge to myself for that hackathon was to see how I could build comparable tests in Applitools with as few lines as possible compared to my core Selenium tests.
Once I completed the solution, I ran an analysis on both projects to see where I stood. These comparisons do not account for the shared framework code for the Driver classes, enums to handle driver types and viewport sizes, page object models, and helper classes used between both solutions – just the test code itself. In the end, my core Selenium test project contained 845 lines of just test code.
Conversely, to execute the same tests with the same, or greater, level of confidence in the solution, the number of lines written for the Applitools test code was only 174!
Though we SDETS do all we can to ensure that we have a robust test framework that is as resilient to change as possible, UI test code, by nature, is flaky. Having to maintain and refactor test code isn’t a possibility, it’s a promise. Keeping your test code lean = less time writing and maintaining test code = more time focusing on new application features and implementing other test solutions! ?
My Challenge – Maximize Coverage, Minimize Code
When I saw the opportunity to join Applitools’ Holiday Shopping Hackathon, I jumped on it. This time, I wanted to challenge myself to create both my solution and test framework in not only as few lines as possible, but also as fast as I possibly could.
Traditionally, building out a test framework takes considerable time and effort. If you are working in Selenium, you can spend hours just building out a proper driver manager and populating your page object models.
Instead, I opted to go another route and use Cypress with my reasoning being two-pronged: 1) Cypress allows for fast ramp up of testing, where you can easily have your tests solution up and running against your application in as little as 5 minutes. Seriously. 2) Cypress is used as the test framework at my current place of employment, and it allowed me to build a functioning POC to showcase the power of Applitools to my colleagues. Win-win!
But there is a caveat…While Cypress allows for cross-browser automation against modern browsers, it does not support Safari or IE11. ? For many companies with a large client base using one or both of these browsers, this can be a non-starter. But that’s where Applitools comes in.
While Cypress has a browser limitation, Applitools allowed me to leverage the easy, quick setup of test automation in Cypress without sacrificing the ability to run these tests on Safari and IE11. ❤️ Essentially, my test runs once with Cypress in a single browser, then Applitools re-renders the DOM from my test execution and runs the test against all browser combinations I specify. No browser limitations, no duplication of tests, in as few lines as possible.
How few? Let me share with you my simple solution that covered all necessary scenarios:
That’s it! A whopping 84 lines of very lean code that executes all test scenarios across all supported browsers and viewports.
Fast From Concept To Completion
As mentioned previously, standing up an automated test solution can easily take hours to lay the groundwork before you write a single test. The best part of leveraging Cypress and Applitools is that it took roughly 1 hour from start to finish including the development of my tests, which is almost unheard of.
Beyond just the speed and ease of using Applitools, having such a powerful and succinct dashboard where you can collaboratively work with the entire development team on bugs is where they really shine. Using AI to intelligently identify discrepancies between a base image and the test run, capturing the DOM for easy debugging, controlling A/B testing for variants of your application, and integrating with CI/CD pipelines and Jira…I could go on.
All these capabilities provide great visibility into the health of a product, and allow product owners, managers, developers and QA engineers to work harmoniously together in management of test flows, bugs, and regressions from a single dashboard. In any organization adopting a shift-left mentality, you really can’t ask for much more.
Lead image by James Osborne from Pixabay
