In this article, I introduce the E2E test framework Cypress.

Overview of Cypress

First of all, I described an overview of Cypress as one diagram. And, I will explain some functions in perspective of comparison with other frameworks.

you can also see and download it as Google Slide file.

Do I need any fee to use Cypress?

Cypress is not an absolute open source product. A part of Cypress is provided as an open source and free. But, the rest is paid.

In the dialog above, Cypress provides the TestRunner as open source. It means you can write and execute tests on your local PC without any costs.

Cypress Dashboard is provided as SaaS. Pricing depends on the number of the user accounts and test runs. Cypress DashBoard displays test results received from background executed test processes like CI.

Therefore, if you want to integrate with CI and make a development pipeline from build to E2E test, you need to pay for Cypress Dashboard services.

Cypress Dashboard has a free plan including 3 users and 500 test results. Free plan seems enough for trial and personal uses.

What is the difference between Selenium and Cypress?

Cypress doesn't use Selenium and WebDriver, it runs in the browser. I don’t know the details of it. But this concept might bring us some advantages.

If you are interested in the depth of the mechanism, the following Cypress official document explains the Architecture of Cypress.

docs.cypress.io/guides/overview/key-differe..

Execution speed of testing looks faster than the other products. Additionally, Cypress can intercept network requests from front-end javascript to server-side API. We can intercept the specified URL and replace the response to the test data like JSON. This very useful function would improve productivity of tests. And, the architecture I mentioned before seems to have made it.

Is writing test code easy or difficult?

The Cypress test scenario is written in JavaScript. So, the knowledge of programming is required to write it. Cypress Studio enables us to convert from UI operations to test code automatically, but it is still an experimental feature. Generated source code seems to be required to modify to use as actual test scenarios.

But, Test code with Cypress JavaScript API looks very simple because it doesn’t need complicated waiting codes, which Selenium or WebDriver needs. I think modern test frameworks, such as Selenide or Playwright, provide similar API, too.

So, making Cypress test code is not difficult for people having minimum experience of JavaScript, but it would be hard for non-programmers.

Next

I would introduce some Cypress Tips I found while trial.