QA Automation Labs

Cypress BDD: Use of Data Table, Background in Cypress — Cucumber

image-2-1024x431

Cypress BDD: Use of Data Table, Background in Cypress — Cucumber

Pre-Condition:

For Cucumber step up please go through this blog

https://qaautomationlabs.com/how-to-grow-cucumber-in-cypress-in-just-10-steps/embed/#?secret=poKmv7s7vh#?secret=tFTQ2D0vaQ

What is Data Table in Cucumber?

Data tables are used when we need to test numerous input parameters of a web application.

What is Background in Cucumber?

Background in Cucumber is used to define a step or series of steps that are common to all the tests in the feature file.

Scenario Covered

Web -Site http://automationpractice.com/ used for covering scenario

Scenario 1: Login as a new sign up user with valid data

Scenario 2: Login as a new sign up user with invalid data

Scenario 3: Search T-shirts from the site

Feature file looks like below

Steps definition looks like below

// Scenario 1

Given(“I navigate to the Website”, () => {

cy.visit(“http://automationpractice.com/”);

});

When(“I entered valid crediential”, (datatable) => {

datatable.hashes().forEach((element) => {

cy.contains(“Sign in”).click();

cy.get(“#email”).clear();

cy.get(“#email”).type(element.email);

cy.get(“#passwd”).clear();

cy.get(“#passwd”).type(element.validpassword);

});

});

When(“User click on sign in button”, () => {

cy.get(“#SubmitLogin”).click();

});

Then(“Validate the title after login”, () => {

cy.title().should(“eq”, “My account — My Store”);

});

// Scenario 2

When(“I entered invalid crediential”, (datatable) => {

datatable.hashes().forEach((element) => {

cy.contains(“Sign in”).click();

cy.get(“#email”).clear();

cy.get(“#email”).type(element.email);

cy.get(“#passwd”).clear();

cy.get(“#passwd”).type(element.invalidpassword);

});

});

When(“User click on sign in button”, () => {

cy.get(“#SubmitLogin”).click();

});

Then(“Error message should display”, (datatable) => {

datatable.hashes().forEach((element) => {

cy.contains(element.errormessage);

});

});

// Scenario 3

When(“I entered the search criteria”, (datatable) => {

datatable.hashes().forEach((element) => {

cy.get(“#searchbox”).type(element.serachtext);

});

});

And(“Click on serach button”, () => {

cy.get(‘[name=”submit_search”]’).click();

});

Then(“Validate the T-shirt name”, (datatable) => {

datatable.hashes().forEach((element) => {

cy.contains(element.tshirtName);

});

});

Video of all steps is attached below

Result

Leave a Comment

Your email address will not be published. Required fields are marked *

Recent Posts

Let’s Play with Cypress Feature “Test Replay”

Problem Statement Before Cypress v13, test failures in CI have historically been captured through screenshots, videos, and stack trace outputs, b
Read More

Handling Shadow DOM Using Cypress

The idea of componentization has completely changed how we design and maintain user interfaces in the field of web development. The advent of Shadow D
Read More

Gear up for upcoming Conferences of 2024! ✨✨

Gear up for our upcoming Conferences of 2024! ✨ ✨ #TheTestTribe #SoftwareTesting #Testers #Community #Worqference #Worqference2024 #QonfX 
Read More