Error: We've tried to resolve your step definitions at src/integration/ but that doesn't seem to exist

Question

I am trying to configure cucumber with cypress in my Angular project. I have changed Cypress.json as followed :

{
    "fileServerFolder": ".",
    "fixturesFolder": "./src/fixtures",
    "integrationFolder": "./src/integration",
    "pluginsFile": "./src/plugins",
    "supportFile": "./src/support",
    "testFiles": "**/*.feature",
}

Then under integration folder, I have organized files and folders as shown in the screenshot bellow:

Then I have added this under my package.json file :

  "cypress-cucumber-preprocessor": {
    "step_definitions": "./e2e/src/integration",
    "nonGlobalStepDefinitions": true
  }

When I run cypress, then run the feature firstOne.feature, I get the following error:

Answer 1

Your feature files should not be in a separate folder. They should be where you specified in your package.json at stepDefinitions

Cypress-cucumber-preprocessor recommends this folder structure when you set "nonGlobalStepDefinitions": true and "stepDefinitions": "./src/integration" in package.json.

See doc here.

- src/
  - integration/
    - firstOne.feature
    - firstOne/
      - firstOne.js
    - secondOne.feature
    - secondOne/
      - secondOne.js

So:

1. Create your .feature file in ./src/integration
2. Create a folder with the same name as your .feature file, also in cypress/integration
3. Create a .js file in the newly created folder with your step definitions