If you have ever run into a job application for a QA engineer, software tester or similar roles, one of the job requirements or at least a benefit is some experience in test automation. Many junior QAs and testers have encountered this obstacle and potentially missed a great job opportunity because they did not know how to start with test automation (as have I in the past). If you recognize yourself in this description, let's get to know a beginner friendly test automation tool - Cypress.

What is Cypress?

Cypress is a test automation tool built for the modern web. It can be used for writing unit, integration and end-to-end tests and can test anything that runs in the browser. It consists of a free, open source, locally installed application and a dashboard service. QA engineers and developers have been using it widely because of the numerous advantages which will be covered in the next couple of sections.

Starting test automation with Cypress

Before starting with test automation, I had very little programming experience. I covered some basics of C and Python in my university studies and I used Selenium with Python for a brief period. Manual testing was always (and always will be) my first love, but the project I was working on required some automated tests and it was a perfect opportunity for me to start learning. The developers I worked with at the time advised me to choose Cypress, for the simple reason of reviewing my code more easily (because they were working with JavaScript). As I had almost no experience with neither Cypress nor Selenium, the tool choice made no difference - I had to start from scratch either way. 

It was my first time cloning a project from git and actually creating a branch, so it was a big scary step. Luckily, my team guided me through the process - otherwise, I would have probably given up after my first merge conflict. :D

Initial test setup

My Cypress test automation journey began with my usual QA procedure: I took a good look at the app I had to test, wrote down the functionalities and started writing tests for each of those functionalities in a simple excel sheet (note: we did not have a test management tool, but it made no difference at the time - integration with a test management tool would be a long way down). I proceeded to read the official Cypress documentation. This is where I want to point out the first good thing about Cypress - the documentation is amazing, it covers everything you need in order to get started. After reading the basics, it was time to install Cypress in the project previously cloned from git. Another good thing about Cypress - the installation process is very straightforward and easy (I immediately remembered how difficult it was for me to set up Selenium - not criticizing, it’s just really confusing for a beginner). Cypress was then installed as a dev dependency in my project within minutes. The structure of the project was immediately visible - the folders were created for me and I just had to position my test files in the right folders. 

The first thing I did was create a test file inside the integration folder, write a single step - to navigate to the url of the page I wanted to test - and run it. That’s when it happened - the selector playground opened. The biggest beginner advantage of Cypress, in my opinion. For someone who did not understand how to find an element via xpath and with very little understanding of html tags, this was a gift from heaven. I was able to click on an element and the selector was given to me - pure magic from a beginner perspective. 

I used the selectors to write my first test - a simple login with valid credentials. With the help of the documentation, I wrote the test and ran it. My username and password were being automatically input, I was logging in without actually doing anything myself - it was a proud moment!

The tests are written - what’s next?

Over the next month, I wrote a bunch of tests which were extremely simple, all alike - define the test, find the elements and do a simple action. My job seemed to be done! Of course, that’s when I realized my tests were far from optimal - they were extremely time consuming and the code did not look nice.

The following month was spent on optimization which was complicated (for me), but I managed to tackle it thanks to the great Cypress community and a few Udemy courses. The biggest challenge was finding the optimal selectors. As already stated, the selector playground is very helpful, but it can only work with what it has been given. If there are no attributes like ids, the playground will most likely give you a selector that is likely to change. That puts your tests in danger of failing, so I had to dig into the HTML and set the attributes myself (more on best practices). That was the most stressful part of the work for me - I was extremely worried about messing something up. Luckily, my team led me through it. From a junior QA tester who did not even know how to clone a git project, I learned about intercepting requests, API testing and covered every part of the app with E2E tests. 

What are the (dis)advantages?

More experienced automation engineers often argue about the disadvantages of Cypress - surely there are some. Just like any tool, Cypress has its perks and flaws, including the inability to test native mobile apps. If you’re looking to test mobile apps, Cypress will definitely not be your weapon of choice. Some also argue that running in a browser is unnecessary and slower than headless execution, that the limitation of multi-tabs is a great flaw and that not supporting other programming languages apart from JavaScript is a major disadvantage.

However, not many QA engineers start with mobile test automation anyway. Web automation is far less complex to start with and that’s where Cypress comes in. Apart from the documentation, installation process and many advantages that were already mentioned, Cypress also captures snapshots so you can see what happened at a particular step. Moreover, there is no need for you to write implicit or explicit wait commands because Cypress covers that automatically. In version 10 (released in June 2022), Cypress added support for component testing, which proves that it is improving with each new version. The future of Cypress is looking bright!

Why Cypress is great for beginners?

As far as I’m concerned, if you’re a beginner in test automation and you’re looking for a tool to start with, consider Cypress. It has a straightforward installation process and great documentation. Even if the projects you’re working on do not require test automation, just choose an app you like and give it a go. If you don’t know much, you might as well start anywhere, right?