6

Cypress 10 was released just days ago with a ton of major breaking changes. As a first time Cypress user (migrating from Protractor with Cucumber), I was not aware of this. I'm trying to install Cypress with Cucumber, but all of the documentation (and perhaps the cypress-cucumber-preprocessor plugin itself) are all written/configured for Cypress 9.

Has anyone successfully configured or migrated cypress-cucumber-preprocessor for Cypress 10 in an Angular project and, if so, what are the steps?

Fody
  • 23,754
  • 3
  • 20
  • 37
Kyle Vassella
  • 2,296
  • 10
  • 32
  • 62
  • Yes, I have migrated `cypress cucumber` with `cypress 10`. Can you please show me your project directory structure? – Krupal Vaghasiya Jun 11 '22 at 07:01
  • I won't be migrating, but rather installing `Cypress 10` from scratch. It installs just like Cypress 10 or 9 would install on an Angular project. With the differences of index.ts is now e2e.ts, integration folder is now e2e folder, .spec.ts is now .cy.ts, and cypress.json is now cypress.config.ts. An enormous breaking change for which there are zero instructions on the internet of how to properly configure Cucumber So the folder structure would be similar to your project if in Angular. – Kyle Vassella Jun 11 '22 at 07:26
  • You have to keep the integration folder the same if you migrate as `e2e` then it will throw an error. other migration you have to change according migration – Krupal Vaghasiya Jun 11 '22 at 08:14
  • @KrupalVaghasiya thanks. In Cypress 9 w/ cucumber you're supposed to add `"testFiles": "**/*.feature"` to cypress.json. In Cypress 10, we're supposed to use `specFiles': 'e2e/**/*.feature'` in `cypress.config.ts`. This works, but now it can't recognize my step files. Can you tell me what you have in `cypress.config.ts`? – Kyle Vassella Jun 11 '22 at 21:07
  • Also need to replace `"testFiles": "**/*.feature"` with `specPattern: 'cypress/integration/**/*.feature'` – Krupal Vaghasiya Jun 13 '22 at 05:15

2 Answers2

4

You can go ahead with the default steps it asks for migration during Cypress 10 & versions above installation. However , among few folder/file name changes , 'integration' folder name gets changed to 'e2e' which would fail the test run if you are using cypress-cucumber-preprocessor / BDD setup in the framework.

Inorder to make it work, you can follow the below steps:

  • Go to node_modules under your project folder
  • And navigate to the path -> /node_modules/cypress-cucumber-preprocessor/lib/stepDefinitionPath.js
  • Amend the below line of code

Before Change: const relativePath = confStepDefinitions || cypress${path.sep}integration;

After Change: const relativePath = confStepDefinitions || cypress${path.sep}e2e;

e2e change

Once this is done, if you trigger your test, it should work successfully.

Note: There are other lib files which still has 'integration' folder path in it and you can change those if needed. I have just answered for the query here.

Sab
  • 69
  • 3
2

There's an issue raised Update plugin to be compatible with Cypress 10 #722 which is ongoing and include Cypress team and Badeball.

My experience is the plugin migration is a problem, as per danbord

The features are detected by cypress but when running it I end up with a "TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined"

but others claim to have it working, including far11ven who shares a repo here.

I'm using "cypress-cucumber-preprocessor": "^4.2.0"

which is quite an old version and comes from TheBrainFamily and is no longer listed in their repositories.

Now resolved

Under RC status, see 722#issuecomment-1153256645

Fody
  • 23,754
  • 3
  • 20
  • 37