5 Benefits of using Cypress in Test Automation
What is Cypress? It’s a fairly new end-to-end testing framework built by frontend developers, for frontend developers. But what are the benefits of using it in test automation? How is it different from other tools?
Why have we chosen Cypress as a test automation tool in the first place?
There were several approaches to test automation in our company before we finally settled on Cypress. We were looking for a JavaScript alternative to Selenium that would help us quickly boost test coverage numbers. What we wanted was to engage more people in test automation, so we needed a tool that not only QA engineers could code in. Cypress was written in JavaScript, which is the main language for our frontend developers team so it seemed like an obvious choice. We decided to give Cypress a try. One of the teams made a proof of concept automating a piece of our application. It turned out that this tool meets almost all of our expectations and even exceeds them in many cases.
Benefits
We didn’t choose Cypress without a reason. This tool also has a lot of advantages as a test automation framework. Now, after over 6 months of working with it, I can see them even clearer than at the beginning.
Modern tool
First of all, Cypress is more universal than other automation tools. It’s written in Javascript, based on Mocha and Chai, and runs in browser using Node.js. This makes it fast and reliable for testing almost every website, not only ones written in Javascript. So it would be a great choice if you want to test applications built in, for example latest React, Angular, Vue, Elm, etc. In Cypress the test code is executed inside the browser itself, so whatever language a website is built in it can be compiled to JavaScript. Unlike other testing frameworks, Cypress doesn’t run outside of the browser executing remote commands across the network. It uses the same run loop as your application instead. Using built-in Node.js server, it reads and modifies web traffic while operating on the network layer of tests running in browser.
With Cypress you can test literally anything that runs in a web browser. You can also implement Cypress tests to run on a mobile webview. The only limitation is the ability to test on Chrome browser. This could be a problem if you would like to test your applications with a wide range of browsers, but it can also be overcome by using additional tools, browser and device farms, etc.
Fast to set up
When using Selenium I remember that it was always a challenging task to choose proper libraries or dependencies needed for a specific project. With Cypress it’s far simpler. If you have ever used JavaScript, you are almost ready to go. As it is based on Node.js, to install Cypress you just need to execute npm install cypress and you are all set up. All dependencies are already in place for a standard installation. You don’t need any additional libraries, testing engines, servers, drivers, wrappers etc., no configuration, no additional choices to make. Of course you can always add libraries and dependencies of your choice, it’s up to you.
Fast to implement and debug
Cypress not only makes it easier for JS developers to start automated testing, but it’s also a very approachable tool for experienced QA engineers. The Domain Specific Language of Cypress is not pure JavaScript, but is easily readable and understandable, very similar to other testing tools’ DSLs. You can also create your own methods and functions with JavaScript and share and use them all across the entire framework.
Debugging in Cypress is also very easy. Operating within your application, Cypress has native access to every single object which simplifies error analysis. You can debug your application directly with Chrome DevTools while the tests are being executed in browser. But that’s not all. When a test fails, Cypress gives a readable and straightforward error message and even some suggestions on how to change the implementation. You’re given the ability to make screenshots after every test fail or any moment of test run you want, which enables you to time travel back to the state when commands ran. This makes debugging really easy and fast.
Fast to execute
Executing Cypress automated tests is fast. As it automatically waits for DOM to be loaded, you don’t have to implement additional waits, nor implicit or explicit. Cypress follows everything that happens in your application synchronously — it knows when the page is being loaded and when elements send events. That’s why Cypress can wait not only for elements to be visible or the animations to get completed, but also for different requests to be send or returned. Cypress executes the majority of its commands inside the browser, so there is no network lag. So tests run as fast as application is capable of rendering. In order to handle testing of dynamic and complex modern websites, Cypress uses test assertions to establish the desired state of your application and before moving on it waits automatically for your application to reach this state. This is a huge difference comparing to other testing tools such as Selenium. No more wait or sleep in your code!
Last but not least, with Cypress you don’t need to start your tests again after every file saving - it automatically triggers the run in your browser. That sometimes can save a lot of time.
Combining functional testing with API checking
Cypress enables you to write several types of tests: end-to-end tests, integration tests, and even unit tests, although I would not say it is a tool designed to write any of them exclusively. Combining them together is the real power of this framework. In Cypress you have the control and the ability to verify the behavior of functions or server responses, just like in unit testing. In my opinion ability to send and check backend requests in Cypress is one of the biggest benefits of using this framework in end-to-end testing. Therefore you don’t have to combine any other libraries for API testing — you can send requests on the fly while testing frontend application. So, for example, with Cypress you can take shortcuts and code a function to automatically log in with a request, before testing the frontend application upon login. But that’s not all. Taking examples from unit testing, in Cypress you can also use stubs and mocks to imitate backend behavior and even modify DOM elements directly (e.g. by changing their attributes) to mirror application state that you need in your tests. These abilities shorten the running spec time and limits test logic to the real purpose of the test scenarios.
All of these traits make Cypress an accessible testing framework not only for professional QA engineers, but also for developers who just started creating end-to-end tests. Of course Cypress also has its limits, such as running only in Chrome browser, but I guess in most cases this is not a deal breaker. Overall, I think that Cypress is a modern testing tool that is universal to use and is at least worth giving a try!
