DEPRECATED: No longer maintained. For details, see: #22
Run Gherkin scenarios with Cypress without a single line of code.
By adding a few HTML attributes:
<input … data-test="email input" />
<input … data-test="password input" />
<button … data-test="login button">Login</button>Cypress Scenario Runner can run Gherkin scenarios without you needing to write any Cypress code like cy.visit() or cy.click():
Feature: Login
===
Scenario: Successful login
---
Given I navigate to "login"
And I set "email input" to "name@example.com"
And I set "password input" to "abc123"
When I click "login button"
Then I should be on "home"Requires:
- Node.js 8.0+
cypresscypress-cucumber-preprocessor
npm install --save-dev cypress cypress-cucumber-preprocessor cypress-scenario-runner && $(npm bin)/install-cypress-scenario-runnerTest scenarios are written in Gherkin syntax:
Feature: Login
===
Scenario: Successful login
---
Given I navigate to "login"
And I set "email input" to "name@example.com"
And I set "password input" to "abc123"
When I click "login button"
Then I should be on "home"Each line in the scenario is called a step. cypress-scenario-runner works by using a predefined set of reusable step templates:
| Step | Description |
|---|---|
I navigate to {route} |
… |
I click {element} |
… |
I set {element} to {string} |
… |
I set: |
… |
I wait for {element} to disappear |
… |
I wait {float} seconds |
… |
I pause |
… |
I debug |
… |
I should be on {route} |
… |
I should not be on {route} |
… |
{element} should be visible |
… |
{element} should not be visible |
… |
{element} should have {int} occurrences |
… |
{element} should be {string} |
… |
elements should be: |
… |
{element} should be set to {string} |
… |
{element} should not be {string} |
… |
{element} should contain {string} |
… |
elements should contain: |
… |
{element} should not contain {string} |
… |
Text in {brackets} above are parameters whose values must be (double) quoted in the scenario. For example, this step template:
I set {element} to {string}would appear as this in the scenario:
And I set "email input" to "name@example.com"In addition, the full Gherkin specification is supported along with additional enhancements by cypress-cucumber-preprocessor. For instance, you can use scenario templates/outlines, data tables, and tags in your scenarios.
See the cypress/integration/ directory for more examples.
HTML attributes are used to map {element} step parameters to their corresponding HTML elements. data-test attributes is used by default, but this is configurable.
<!-- login.html -->
<input name="email" data-test="email input" />
<input name="password" data-test="password input" />
<button type="submit" data-test="login button">Login</button>Routes need to provided for navigation steps like these to work:
Given I navigate to "login"A map of all label => path routes should be provided to addSteps() in the cypress/support/step_definitions/index.js file created during installation. Route paths can be relative to the web root or absolute URLs.
const { addSteps } = require('cypress-scenario-runner')
addSteps({
+ routes: {
+ login: '/#',
+ },
})Scenario files can be run directly with Cypress:
$(npm bin)/cypress run [files]or, using the Cypress UI:
$(npm bin)/cypress openComing soon.