Beginners guide to Test Automation with Cypress
In today’s world, test automation has become an essential part of the software development process, aiming to improve the speed, quality, and reliability of software products. While there are several popular frameworks in the industry, Cypress has gained popularity among automation testers due to its unique features.
What is Cypress?
Cypress is an open-source JavaScript-based end-to-end (E2E) test automation tool that provides a set of powerful tools for test scripting, debugging, and test execution. Even though Cypress is an end-to-end testing framework, with its new features, we can even automate component testing and API testing with one framework.
How does cypress elevate your testing experience?
· Easy to setup and use
· Test execution is faster when comparing to other frameworks.
· Cypress takes snapshots at every step and enables us to go back and see what happens.
· Cypress has automatic waiting, therefore we do not need to add waits or sleeps for our test script.
· Easy to debug.
Install Cypress.
Since Cypress requires Node.js to run tests, you have to install Node.js on your computer first. You can download it and install it here: https://nodejs.org/en
Before installing Cypress, we need to run the npm init command and initialize a new Node.js project.
Then run the following command to install the Cypress Lates version:
npm install cypress — save-dev
After the installation, we can open the package.json file and verify the Cypress version in “devDependencies”
Now the installation is complete. The next step is to open the Cypress project. For that, we need to run the following command:
npx cypress open
Next, we will get a window like this. This is called cypress test runner.
Next, we have to select “E2E Testing” or “Component Testing” based on our requirements. Since our focus is on E2E testing, now select E2E testing.
Then Cypress will create the above configuration files for our project automatically. We can continue here.
In the next step, we can choose a browser. Our test scripts will run on the browser we choose now. In every time from now onward, when you run npx cypress open command, you will start from here. Select a browse and start E2E Testing in Cypress.
Next, it will open our test scripts in the selected browser. Since it is our first time opening this Cypress project, we will get a window as follows:
Cypress will give us several example script files to guide us on how to write tests in scripts if we choose “Scaffold example specs”.
But we will select the “Create new spec” option. Now we will get an option to enter our file name. Please note that to each of every file that contains our test scripts must be in the e2e folder, and those file types should end as “cy.js”
ex:- yourFileName.cy.js
Now this will generate our first text script file like this.
Then click on “Run the Spec”
Next cypress will run our spec.cy.js file.
Now we have successfully installed and run the first script.
Next, we will look at the project folder structure.
Open your project folder with a code editor. These are the folder structures.
Downloads: if there are any files downloading when running our test scripts, those files will be downloaded in this folder.
e2e: This folder contains our test scripts. If we need to add a new test file, we need to add it under the e2e folder. For best practices, you can add subfolders and categories of test scripts under the e2e folder and add your test script there as well.
Fixtures: In the fixtures folder, we can save our extra data files and other fields. For example, if we have some pdf files that we need to upload within our test scripts, we can store those files in this folder.
Support: Support folder has mainly two files.
1. command.js : This file contains our custom commands. If we ever need to create some custom commands based on our requirement we can implement those commands inside this file.
2. e2e.js : This file is used to store global configuration and setup code for our test files.
cypress.config.js: This file is used to configure settings in our Cypress project.
Conclusion
Even though Cypress is a great tool for test automation, it does have some limitations, such as it doesn’t support other programming languages.
Cypress is not a tool that we can learn in one night. If you are more interested in Cypress, the official Cypress doc (https://docs.cypress.io/) is the best place to learn advance Cypress topics.