@badeball/cypress-cucumber-preprocessor

What is @badeball/cypress-cucumber-preprocessor?

@badeball/cypress-cucumber-preprocessor is a plugin for Cypress that allows you to use Cucumber syntax for writing your end-to-end tests. It enables you to write tests in a more human-readable format using Gherkin language, which can improve collaboration between developers, testers, and non-technical stakeholders.

What are @badeball/cypress-cucumber-preprocessor's main functionalities?

Writing Gherkin Scenarios

This feature allows you to write test scenarios in Gherkin syntax, which is a human-readable language. The example demonstrates a simple login scenario.

Feature: Login functionality

  Scenario: Successful login
    Given I am on the login page
    When I enter valid credentials
    Then I should be redirected to the dashboard

Step Definitions

This feature allows you to define the steps for your Gherkin scenarios using JavaScript. The example shows how to implement the steps for the login scenario.

import { Given, When, Then } from '@badeball/cypress-cucumber-preprocessor';

Given('I am on the login page', () => {
  cy.visit('/login');
});

When('I enter valid credentials', () => {
  cy.get('input[name="username"]').type('user');
  cy.get('input[name="password"]').type('password');
  cy.get('button[type="submit"]').click();
});

Then('I should be redirected to the dashboard', () => {
  cy.url().should('include', '/dashboard');
});

Data-Driven Testing

This feature allows you to run the same scenario with different sets of data using the Scenario Outline and Examples keywords. The example demonstrates how to test unsuccessful login attempts with different credentials.

Feature: Login functionality

  Scenario Outline: Unsuccessful login
    Given I am on the login page
    When I enter <username> and <password>
    Then I should see an error message

    Examples:
      | username | password |
      | user1    | wrongpass|
      | user2    | wrongpass|
      | user3    | wrongpass|

Other packages similar to @badeball/cypress-cucumber-preprocessor

cypress-cucumber-preprocessor

cypress-cucumber-preprocessor is another plugin for integrating Cucumber with Cypress. It provides similar functionality to @badeball/cypress-cucumber-preprocessor, allowing you to write Gherkin syntax for your tests. However, @badeball/cypress-cucumber-preprocessor is a fork of this package and may have additional features or improvements.

jest-cucumber

jest-cucumber is a package that allows you to use Cucumber with Jest, a popular JavaScript testing framework. While it provides similar Gherkin syntax support, it is designed for unit and integration testing rather than end-to-end testing like Cypress.

README

cypress-cucumber-preprocessor

This is a fork and complete re-write of cypress-cucumber-preprocessor. It's not meant for the general public, although you're obviously free to try. I generally don't provide support in any way at this point. It differs from the original in the following ways.

• Somewhat simpler configuration options
• Tested differently
• Using TypeScript
• No support for Cucumber JSON reports
• No support for "all.features"
• Supports newest Gherkin syntax (IE. Rule-keword)

$ npm install @badeball/cypress-cucumber-preprocessor

It incidentally also fixes the following issues (non-exhaustive).

• TheBrainFamily/cypress-cucumber-preprocessor#104
• TheBrainFamily/cypress-cucumber-preprocessor#143
• TheBrainFamily/cypress-cucumber-preprocessor#170
• TheBrainFamily/cypress-cucumber-preprocessor#196
• TheBrainFamily/cypress-cucumber-preprocessor#237
• TheBrainFamily/cypress-cucumber-preprocessor#348
• TheBrainFamily/cypress-cucumber-preprocessor#395
• TheBrainFamily/cypress-cucumber-preprocessor#406
• TheBrainFamily/cypress-cucumber-preprocessor#428
• TheBrainFamily/cypress-cucumber-preprocessor#448
• TheBrainFamily/cypress-cucumber-preprocessor#458

Changelog

v12.0.0

Breaking changes:

• A minor change to step definitions has been introduced, affecting users of Cypress v10 or higher. When upgrading to v11.0.0 of the processor, users was instructed to remove certain prefixes from their step definitions. This is no longer required and said prefixes can be re-introduced when upgrading to v12.0.0 of the preprocessor. In other words, if your configuration looks like this

{
  "stepDefinitions": [
    "[filepath].{js,ts}",
    "cypress/support/step_definitions/**/*.{js,ts}"
  ]
}

.. then it should now look like this (notice the addition of cypress/e2e)

{
  "stepDefinitions": [
    "cypress/e2e/[filepath].{js,ts}",
    "cypress/support/step_definitions/**/*.{js,ts}"
  ]
}

Note: Step definitions doesn't necessarily have to be put in cypress/e2e and alongside your feature files. They can be contained in an entirely separate directory, if desired. This fixes #748.

Other changes:

• Updated all @cucumber/* dependencies.

• Added native support for HTML reports using @cucumber/html-formatter, fixes #780.

• Correct an issue with non-array stepDefinitions, fixes #781.