Why We Chose Cypress.IO

Robert Lara III

Article Header

After continued discussion and deliberation amongst the technical staff, CMHWorks is pleased to announce that we have chosen Cypress.io as our FrontEnd Testing Solution.

Our criteria is selecting a front-end testing solution were that:

  1. The tests needed to be easy to create. NO requirements on antiquated front-end testing frameworks like Selenium.
  2. The test source code needed to reside in the Visual Studio solution
  3. The solution needed to integrate with our existing SCM solution (GitHub)
  4. The solution needed to integrate with our exiting CI/CD Solution
And Cypress.io hit the mark.

Background on Our Decision

Anyone who has attempted end-to-end (E2E) testing knows about the industry's current standard, Selenium. Jason Huggins originally developed it in 2004 at ThoughtWorks. It no surprise the firm that also housed Industry pioneers Martin Fowler, the author of Patterns of Application Architecture, and Jim Highsmith, one of the critical authors of the Agile Manifesto, would draw so much community support.

Since 2004, Google released Angular in September of 2016, Ryan Dahl created NodeJs in 2009, and Google released Chrome in 2008. These industry milestones require development tools to be robust, easy to learn, compatible with CI/CD, and integrate with minimal effort into a developer's everyday processes. Here is why we chose Cypress for our Angular E2E testing.

Cypress Key Features

  • Dashboard to manage tests and see results
  • Integrates with all CI providers
  • Auto-generation of screenshots for failed tests
  • Videos of failed test runs
  • Cross Browser Testing by default
  • GitHub Integration to work with your GitHub workflow

Setup

Cypress installation works with yarn and npm. Cypress installation is a much easier process than installing Selenium due to not having to worry about WebDrivers. With Cypress, our UI developers can install it as a development dependency, and that is it.

Writing and Running Tests

Writing tests can be complicated due to switching between writing a test, working with the test browser, and modifying application code. However, Cypress adds efficiency to the process with hot loading for writing tests and modifying code.

The beauty of Cypress is with the Test Runner and application running, changing the test and application code rebuilds our application and executes our tests again. In real-time, Cypress tests the UI during development.

Another great feature of Cypress is the ability to step through the test with the simple hovering of the mouse. Much like the debugger process when working with code, Cypress gives this precise ability to find issues within a test.

Summary

The process of adopting Cypress is straight forward, and the documentation is simple to utilize. You can try Cypress with their free tier and 30 minutes of spare time, check out the links below and see for yourself.

Resources for More Information


>