How to set up Cucumber in Cypress 10?
As not long ago we were introduced to Cypress v10 with breaking changes. The process of installation of cypress is quite simple and easy but we’ll look at how to install and configure cucumber with it.
Before we start, let's talk about what cucumber is and why we use it here
What is Cucumber?
Cucumber is a tool that supports behavior-driven development (BDD). It runs automated acceptance tests written in BDD format. Cucumber provides a way to write tests that anybody can understand, regardless of their technical knowledge. It explains test steps and application behavior in simple English using the Gherkin language.
You can read further about cucumber here
Let's add cucumber to cypress and automate a simple login flow
There are a few prerequisites before we can start installing cucumber, you need to have these tools to initiate project setup.
Step 1: Install cucumber
- Type the below command on the terminal to install cucumber
- The next step is to set the configurations in
- Create a new file named
.cypress-cucumber-preprocessorrc.jsoninside the root directory of your project and specify the location of step definitions as follows
Step 2: Write scripts
As we are finished with the basic configuration, we are now ready to write up the script. We will be using https://opensource-demo.orangehrmlive.com/ for this purpose and automating the Login test case for demonstration.
Create a file called
login.feature in the
e2e folder, see the snippet below
Then create a file called
login.js in the following directory
cypress/support/step_definitions, see the snippet below
Step 3: Run scripts
At this point, add the script in your
package.json to run cypress. You can directly open cypress Launchpad from here
Now we can run the below command to open cypress UI
login.feature from your feature files inside the Spec Explorer
I hope you found this article helpful. Follow the above steps and run your first test case with cypress and let me know how it went in the comments.
Link to GitHub code