.svg)
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
GDPR Data Mapping: A How-To Guide
If you don’t know where your business collects, stores, and processes...
Read Now
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
.svg){kind=small}
This blog aims to illustrate pain points we've run into at various stages of development. We hope to help engineers and product folks to overcome similar obstacles by explaining how we overcome our own.
As a small engineering team, we must maximize our resources. Delivering a scalable testing solution for our critical products is important. Our consent management platform is a complex feature that we must support in 40+ languages. Testing cookie consent dialogs across many languages can seem like a daunting task. We were trying to solve a problem with the inability to test these different scenarios at a much larger scale. We also needed a reliable framework to test multiple language translations across different browsers and operating system versions, without the need to manually verify all test cases. Solving this problem has significantly increased our confidence and reduced the amount of time we spend testing.We had three primary objectives:
- Finding a testing framework that could handle multiple languages and consent dialog combinations.
- Significantly increasing test coverage across multiple browser versions.
- Scaling automation with continuous integration and continuous delivery.
We looked at a variety of open-source test framework solutions like WebDriver.io, Cypress and even an enterprise-level platform. Ultimately, we landed on Cypress to solve this specific problem. Cypress is easy to set up and handles web browser interactions really well. It also has great API (Application Programming Interface) documentation. It offers the ability to run tests using its built-in user interface and the ability to run tests in a headless environment for improved efficiency.
In order to test against multiple browsers, we needed a reliable way to start multiple browser instances across multiple platforms (Internet Explorer, Windows, Safari, Firefox, Chrome, etc). Browserstack was the best option for this. It offers an API we can use to run a set of cypress tests against a variety of browsers in parallel, which is awesome for test coverage and confidence.
Using the above tools and platforms, we focused on several key items:
Segmenting the Banner and Cookie Drawer elements by HTML text and component:
Each block of text or element is represented in a JSON (JavaScript Object Notation) object that we can pull from in order to test against expected key-value pairs. These key-value pairs are simply tied to one of the UI elements in the banner itself. This implementation is valuable in allowing us to test against multiple languages and combinations using the same general set of JSON data, regardless of the language being tested.
Pull the keys from the JSON file into the test script
In this example, we’re importing the languages needed for testing, which gives us access to the proper language and any of the related JSON keys and values needed to test the consent banner user interface. Once we’ve imported all language files, we can start to write and run a set of test scripts in order to test the following functionality:
- Simulating a user visiting a web page with a consent banner.
- Verifying the consent banner description is displayed in the correct language.
- Verifying the consent banner Href privacy link exists.
- Finding and clicking the “Accept” button to indicate consent.
- Opening the cookie preferences drawer and validating the description.
- Ensuring the “Essential” and “Marketing” toggles are visible and using the correct translation.
We were able to significantly increase test coverage across all supported language translations in the cookie banner and preferences drawer across many different scenarios. We were also able to significantly reduce the time needed to spend manually testing these scenarios, resulting in higher quality releases with much higher confidence.
If you’re considering implementing a similar solution at your company, it’s important to embrace modern testing tools. Because scalability in testing leads to confidence.
