Cypress cucumber configuration setup - testing

Question

I am trying to run tests with cypress and Cucumber, but, I am limited by a terrible error when running tests. I don't know much about what's going on, but I have tried to follow all the documentations I could find related to the problem.
The errors I am getting
coder#jessie:~/Desktop/jessie/cypressLearn$ yarn run loginTest
yarn run v1.22.19
warning ../../../package.json: No license field
$ cypress run --spec features/login/login.feature
====================================================================================================
(Run Starting)
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ Cypress: 11.2.0 │
│ Browser: Electron 106 (headless) │
│ Node Version: v16.14.2 (/home/coder/.nvm/versions/node/v16.14.2/bin/node) │
│ Specs: 1 found (login.feature) │
│ Searched: features/login/login.feature │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
────────────────────────────────────────────────────────────────────────────────────────────────────
Running: login.feature (1 of 1)
Oops...we found an error preparing this test file:
> features/login/login.feature
The error was:
Error: Build failed with 7 errors:
node_modules/#badeball/cypress-cucumber-preprocessor/lib/create-tests.js:6:50: ERROR: Could not resolve "#cucumber/tag-expressions"
node_modules/#badeball/cypress-cucumber-preprocessor/lib/create-tests.js:7:39: ERROR: Could not resolve "#cucumber/cucumber-expressions"
node_modules/#badeball/cypress-cucumber-preprocessor/lib/create-tests.js:8:23: ERROR: Could not resolve "uuid"
node_modules/#badeball/cypress-cucumber-preprocessor/lib/registry.js:7:39: ERROR: Could not resolve "#cucumber/cucumber-expressions"
node_modules/#badeball/cypress-cucumber-preprocessor/lib/registry.js:8:50: ERROR: Could not resolve "#cucumber/tag-expressions"
...
at failureErrorWithLog (/home/coder/Desktop/jessie/cypressLearn/node_modules/esbuild/lib/main.js:1574:15)
at /home/coder/Desktop/jessie/cypressLearn/node_modules/esbuild/lib/main.js:1032:28
at runOnEndCallbacks (/home/coder/Desktop/jessie/cypressLearn/node_modules/esbuild/lib/main.js:1446:61)
at buildResponseToResult (/home/coder/Desktop/jessie/cypressLearn/node_modules/esbuild/lib/main.js:1030:7)
at /home/coder/Desktop/jessie/cypressLearn/node_modules/esbuild/lib/main.js:1142:14
at responseCallbacks.<computed> (/home/coder/Desktop/jessie/cypressLearn/node_modules/esbuild/lib/main.js:679:9)
at handleIncomingPacket (/home/coder/Desktop/jessie/cypressLearn/node_modules/esbuild/lib/main.js:734:9)
at Socket.readFromStdout (/home/coder/Desktop/jessie/cypressLearn/node_modules/esbuild/lib/main.js:655:7)
at Socket.emit (node:events:526:28)
at addChunk (node:internal/streams/readable:315:12)
at readableAddChunk (node:internal/streams/readable:289:9)
at Socket.Readable.push (node:internal/streams/readable:228:10)
at Pipe.onStreamRead (node:internal/stream_base_commons:190:23)
This occurred while Cypress was compiling and bundling your test code. This is usually caused by:
- A missing file or dependency
- A syntax error in the file or one of its dependencies
Fix the error in your code and re-run your tests.
(Results)
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ Tests: 0 │
│ Passing: 0 │
│ Failing: 1 │
│ Pending: 0 │
│ Skipped: 0 │
│ Screenshots: 0 │
│ Video: true │
│ Duration: 0 seconds │
│ Spec Ran: login.feature │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
(Video)
- Started processing: Compressing to 32 CRF
- Finished processing: /home/coder/Desktop/jessie/cypressLearn/cypress/videos/logi (2 seconds)
n.feature.mp4
====================================================================================================
(Run Finished)
Spec Tests Passing Failing Pending Skipped
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ ✖ login.feature 0ms - - 1 - - │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
✖ 1 of 1 failed (100%) 0ms - - 1 - -
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
My package.json
{
"name": "cypresslearn",
"version": "1.0.0",
"description": "Learning cypress and cucumber",
"main": "index.js",
"scripts": {
"cy:open": "cypress open",
"cy:tests": "cypress run",
"loginTest": "cypress run --spec features/login/login.feature"
},
"keywords": [
"cypress",
"cucumber",
"testing"
],
"author": "Jexsie",
"license": "ISC",
"devDependencies": {
"#bahmutov/cypress-esbuild-preprocessor": "^2.1.5",
"cypress": "^11.2.0",
"esbuild": "^0.15.16"
},
"dependencies": {
"#badeball/cypress-cucumber-preprocessor": "^14.0.0",
"#esbuild-plugins/node-modules-polyfill": "^0.1.4"
},
"cypress-cucumber-preprocessor": {
"stepDefinitions": [
"cypress/stepDefinitions/[filePath]/*.js"
]
}
}
My cypress.config.js
const { defineConfig } = require("cypress");
const createBundler = require("#bahmutov/cypress-esbuild-preprocessor");
const {
addCucumberPreprocessorPlugin,
} = require("#badeball/cypress-cucumber-preprocessor");
const nodePolyfills =
require("#esbuild-plugins/node-modules-polyfill").NodeModulesPolyfillPlugin;
const {
createEsbuildPlugin,
} = require("#badeball/cypress-cucumber-preprocessor/esbuild");
module.exports = defineConfig({
e2e: {
async setupNodeEvents(on, config) {
const bundler = createBundler({
plugins: [nodePolyfills(), createEsbuildPlugin(config)],
});
on("file:preprocessor", bundler);
await addCucumberPreprocessorPlugin(on, config);
return config;
},
specPattern: "features/**/*.feature",
supportFile: "cypress/support/e2e.js",
baseUrl: "http://zero.webappsecurity.com",
},
});
I tried to run tests using yarn run loginTest for the login and expected the test to be passing