Using cucumber with cypress - cucumber

Question

Can anyone help me getting Cucumber to work with Cypress? Absolutely every guide I can find has this step in the setup:
X.
Add the relevant configurations to your Cypress environment files accordingly.
Under plugins/Index.JS file add the following:
const cucumber = require('cypress-cucumber-preprocessor').default
module.exports = (on, config) => {
on('file:preprocessor', cucumber())
}
However, my project doesn't HAVE a cypress/plugins/index.js file. It DOES, however, have a cypress/plugins/index.ts file. I thought TypeScript was the going standard for Cypress, and not JavaScript?
The code above gives me errors on "require" (TS2591: Cannot find name 'require'), "module" (TS2591: Cannot find name 'module') and the parameters "on" and "config".
Apparently, the index.ts file WAS index.js once, since this is still included in the file:
// This example plugins/index.js can be used to load plugins
But obviously something is wrong here. But how come apparently no one else on the "entire internet" have had this problem? ( :-) )
To keep on trying, I skipped this part - also since I read some hints that it isn't longer necessary (not sure, though).
I also added this dependency to the project pom.xml:
<dependency>
<groupId>io.cucumber</groupId>
<artifactId>cucumber-cypress</artifactId>
<version>5.7.0</version>
</dependency>
Then did the npm installs, maven clean install, refresh etc. etc., and creted a test.feature file in the /integration folder.
It seems that IntelliJ reconizes the file as a Cucumber feature file, because I get the option to run both the feature and the test inside.
However, that just gives me the following error when the feature tries to run:
Error: Could not find or load main class cucumber.cli.Main
Caused by: java.lang.ClassNotFoundException: cucumber.cli.Main
Figuring it was due to the cucumber.cli.Main missing in the run config, I opened it and saw that it wasn't. Nor was it working:
[![enter image description here][1]][1]
[1]: https://i.stack.imgur.com/ib9ZT.png
(The "cucumber" part of the line is makred red in "Main class".)
Changing this to " io.cucumber.core.cli.main" (which I believe is newer?) didn't help.
The last step I've tried is installing the Cucumber Js plugin in the plugin browser. Didn't seem to do any difference.
I'm afraid to try much more, since in my experience messing around too much with maven is likely to ruin any project to the point of me just having to scratch it and start over again.

Answer 1

Have you looked at https://github.com/TheBrainFamily/cypress-cucumber-typescript-example/?
It seems that you can use Cypress in Typescript but still define the plugins with JavaScript. That is you should convert your plugins.ts to plugins.js and everything should work as expected.

Answer 2

When you mentioned pom.xml, it must mean you are trying to set up Cypress and run in a Maven build.
You should first set up Cypress the node.js way first using npm install -D cypress#<an older version> because npm i -D cypress will install cypress 10 for you. Then after that, follow the steps in the link shared by #https://stackoverflow.com/users/5389127/ga%c3%abl-j to set up Cucumber for the older versions of cypress but use this for the later version of cypress.
You can set the repo up in maven using this article in this answer.
For a comprehensive guide on how to use Cypress, you can checkout this youtube link