Getting started with Cypress

cypress.io

Overview:

In this article, I will be explaining what is Cypress and how we can install it for testing.

Prerequisites:

1. Node.Js installed. (If not installed you can check this link).
2. Visual Studio Code. ( Download Visual Studio Code using this link)

What is Cypress?

Cypress is a next-generation front end testing tool constructed on modern web. It is built on Node.JS and comes packaged as an NPM module. As its basis is Node.js it uses Javascript as a programming language.

Essential features of Cypress:

· Cypress provides a feature to take screenshots during the execution.

· Debugging is easy using developers tools.

· We don’t need to put waits, and sleeps because Cypress takes care of the synchronization techniques.

· Cypress provides proper error logging messages which helps us identify the script failure's cause.

· Cypress has the capability to take screenshots by default on failure.

How fast Cypress is growing:

https://npmtrends.com/cypress

Steps to install Cypress:

1. Open visual studio code and create a new project.
2. Add package.json

Note: Every cypress project has packaje.json file using which testers can use custom commands as per their use. This file makes complicated commands easy to use while creating scripts.

Steps to add package.json to our project:

1. In Visual Studio Code, we need to open the terminal.
2. Create your project folder using the below command

mkdir <project_name>

Visual Studio Code

3. Navigate to the created folder:

cd <project_name>

4. Use the below command to create a package.json file:

npm -i init

Visual studio code

5. Type yes and hit Enter.

Visual studio code

6. Open the folder you have created above in step 2.

Visual Studio Code

7. After opening the folder I will be getting package.json created in the folder.

Visual Studio Code

Now our package.json has been added to our project. Our next aim is to add Cypress to this project.

Adding Cypress to the project:

1. Run the below command to install Cypress into your project:

npm install cypress --save-dev

Visual Studio Code

2. Go to package.json and verify Cypress with the version available in that file.

package.json

we are done with installing Cypress into our project. Now we can use it for testing our web application.

Conclusion:

In this blog, I have explained the steps to install Cypress and the pre requisites for installing it.

References:

JavaScript Component Testing and E2E Testing Framework | Cypress

About the Author:
Shubham Pandey is a Test Engineer here at Version 1.