An introduction to Cypress- The All-in-one testing framework

Whenever we think of an open source test automation tool, the first thing that comes to our mind is Selenium. Of course, Selenium has been a trendsetter in the area and brought in a big revolution in the software testing space. But, that was way back in 2004. Selenium, of course, has a lot of benefits like support for multiple OSs and browsers and many more and has proved itself to be a great tool without a doubt. But, there are other open source automation tools available for website testing today which are equally good or even better than Selenium for few things and ease of use. There are tools like Protractor and WebDriver.iO. But one common thing with many of these tools is that they still used the Selenium server. But I have heard many people, especially developers, complaining ‘Selenium API sucks’! Well, if you are one among them, and wanting to get rid of Selenium, this blog is for you! In this blog, we will be taking a look at one of the latest solution for end to end testing automation which does not use Selenium or WebDriver in its architecture. It is cypress.

What is Cypress?

Cypress website claims it to be a next generation front-end testing tool built for the modern web. It is an open source tool. Cypress can be used to test anything that runs in a browser. The cypress ecosystem, in fact, consists of two products – cypress test runner and Dashboard. The test runner is open source and the dashboard is a paid service. The cypress test runner is all that you need to write and run your tests. The Dashboard service is to record your tests later after building up your suite of tests and integrating cypress with CI provider. It is a completely optional, value-added service.

Why Cypress?

Cypress is very easy to set up. You simply need to install the .exe file and all drivers and dependencies are automatically installed and configured for you. Cypress is written in JavaScript and also uses JavaScript to write tests. JavaScript is web developer’s language and hence the most comfortable language for web developers. Hence, Cypress can be considered to be a developer-friendly test automation framework. It can be used for end-to-end testing, integration testing or Unit testing.
Cypress makes it simple to set up your tests, write tests, run tests and debug tests. Cypress was primarily designed in order to overcome some of the pain points of using Selenium, namely the slowness, and difficulty in implementation and set up. Hence, Cypress comes with an architecture very different from Selenium. Selenium, as you know operates by running outside the browser and executes remote commands across the network. But Cypress works the opposite way- it runs inside the browser and it is executed in the same run loop as your application under test. Behind the Cypress is a Node.js server which constantly communicates, synchronizes and performs tasks along with Cypress on behalf of each other. Having access to both backend and frontend gives cypress the ability to respond to any of the application’s events in real time, while at the same time work outside of the browser for a task requiring a higher privilege. Cypress also works at the network layer by reading and alerting web traffic. This makes cypress capable to control the entire automation process from top to bottom and is able to understand everything inside and outside of the browser. Thus, Cypress delivers more consistent results compared to any other testing tool. Tests run much more quickly and reliably than Selenium-based tests in Cypress.
Cypress comes with many features that set it apart from other open source testing frameworks currently available. Here is an overview of some of the features of Cypress making it unique:

Cypress takes snapshots and videos as your tests run. You simply have to hover over commands in the command log to see and you can see the snapshots to understand what exactly happened at each step.
Cypress makes debugging easy and lets you debug directly from tools like ChromeDevTools.
Cypress has an automatic waiting feature and this frees you from adding waits and sleeps to your scripts. It automatically waits for commands and assertions before moving on thus taking off the pain of synchronization hell while writing scripts. Once the browser launches and the elements are loaded on to a webpage, it automatically waits for the element with its control property.
Cypress is an all-in-one testing framework with a testing library, assertion library, mocking libraries, all bundled in. Mocha, Chai, and Sinon are all bundled in cypress.
Cypress allows network traffic control and enables you to easily control, stub, and test edge cases without involving your server.

Limitations of Cypress

All the above features definitely are very cool features to have in any automation testing tool! But wait; don’t assume cypress is a super tool with powerful capabilities and can easily replace Selenium. Cypress isn’t yet there. Selenium, of course, has its strengths. Although cypress overcomes many of the pain points that you had with Selenium, Cypress does have limitations. Here are a few tradeoffs if you use cypress:

There is no cross-browser support as of now. It currently supports only Chrome.
Iframe support is somewhat limited.
You cannot use cypress to drive multiple browser tabs at the same time.
Cypress supports only JavaScript for scripting.

Of course, one automation tools is not really “better than other”. Each tool would have its own strengths and limitations. You have to choose a tool which is most suitable for your needs. QTP would be the best tool for some teams, while for some Selenium is the best choice, or for some cypress might be better. It varies from team to team based on your automation needs, resources, and many other factors. Cypress is a more developer friendly tool aimed more towards making TDD and works if your testing team has more developers and you are not particular about cross-browser testing. But Selenium works for your team if your team has more testers, or use a language stack other than JavaScript or you need to do testing across browsers.

Getting Started with Cypress

Cypress is easy to set up and learn and you can start writing meaningful tests with minimum efforts as it has an easy learning curve to get over. Here a few links to get started with Cypress. The first one and most suggested one is the documentation from cypress itself. They also have demo videos.

That was all about cypress. It definitely is a tool that is worth trying your hands on if you are a developer and wants to get your unit testing/end to end testing done faster. Happy Testing!