Using Cypress with Cucumber in Just 10 steps

Implement BDD using Cypress

This blog originally published in https://qaautomationlabs.com/how-to-run-tests-with-cypress-and-cucumber/

What is Cucumber?

Cucumber is a software tool that supports behavior-driven development (BDD).

What is BDD?

BDD bridges the gap between business stakeholders and the technical team through a common platform. Hence, communication among the team becomes more transparent.

Gherkin is being used as the language in which the test cases are written in a simple format and can also be read and modified by a non-technical user.

Cucumber integration with Cypress In 10 steps

Step 1: Create a folder and Generate package.json

1. Create a new folder, I called mine project cypress_cucumber
2. Type npm init (package.json) is created

Step 2: Install cypress

To install Cypress, still in the project folder, Run > npm install cypress — save-dev

Step 3: Install Cucumber

Run > npm install — save-dev cypress-cucumber-preprocessor

Step 4: Add below line under plugins -> index.js

const cucumber = require(“cypress-cucumber-preprocessor”).default;

module.exports = (on, config) => {

on(“file:preprocessor”, cucumber());

};

Step 5: Add below line in package.json

“cypress-cucumber-preprocessor”: {

“nonGlobalStepDefinitions”: true

}

Step 6: Add below line in cypress.json

{ “testFiles”: “**/*.feature” }

Step 7: Create feature and .spec file

1. Create Folder with name “Login” under integration folder
2. Create login.spec.js file under Login folder
3. Create Login. feature file under integration folder

Folder Structure

Step 8: Enter the Below line under Login. feature file

Our feature file looks like as given below, here we take the example of the login screen for site http://automationpractice.com/

Step 9: Enter the below lines in the step definition file

Step 10: Run the test case and see commands log

Run > yarn run cypress open , Cypress test runner is open

See the result in command log , Steps (Given,When,Then) display in commands log in cypress runner

See more blogs on Cypress and other tools under below link

Blogs - QAAutomationLabs