How can I create a common steps definition folder to be used by all .feature files in cypress/cucumber?

Question

I have a framework built using cucumber on top of cypress (javascript).

I'm using this version: cypress-cucumber-preprocessor: ^4.0.1

According to the docs (confirmed by the behavior), it is mandatory for cucumber to have a folder at the same level and with the same name as the feature file, so cucumber knows where to look for the steps. As such, my file structure is:

-integration
---myApp
-----users
-------login.feature
-------login
---------login.steps.js
-------signup.feature
-------signup
---------signup.steps.js
-----someotherentity
-------foo.feature
-------foo
---------foo.steps.js

So login.feature, needs a folder at the same level called "login" where I store the step definitions and so on.

All those feature files need these 2 steps for example

Given('I visit the homepage', () => {cy.visit('https://myhomepage.com)})

When('I click Ok', () =>{cy.get('#proceedButton').click()})

I have those 2 steps defined in all 3 files so It would make sense to have a common folder for common step definitions regarding navigation, clicks, etc.

How can I do that here?

Answer 1

Please, have a look here:

https://github.com/TheBrainFamily/cypress-cucumber-preprocessor#cypress-configuration

In case you decide to change the Cypress Cucumber Preprocessor Style pattern you must pay attention to the corresponding information in package.json file

For example: "cypress-cucumber-preprocessor": { "commonPath": "common", "stepDefinitions": "step_definitions" }

allows you to have a separate folder for common step definitions