Migrating cypress test from old version to latest version throws error

Question

I am trying to migrate my test from Cypress 8.7.0 version to Cypress 10.10.0 version. Installed the latest version and did the below settings, but getting below error. Using below versions: Cypress 10.10.0, "@badeball/cypress-cucumber-preprocessor": "^11.4.0", node v18.4.0, @bahmutov/cypress-esbuild-preprocessor": "^2.1.5"

Expected to find a global registry (this usually means you are trying to define steps or hooks in support/e2e.js, which is not supported) (this might be a bug, please report at https://github.com/badeball/cypress-cucumber-preprocessor)

Because this error occurred during a before each hook we are skipping all of the remaining tests.

I have added the error handling in e2e.js file and support/index.js file but still could not resolve this issue. I have .env file which has the environment variable in my root location. Could someone please advise on this issue ?

//Detail error log:

Because this error occurred during a `before each` hook we are skipping all of the remaining tests.
    at fail (tests?p=tests/cypress/e2e/login/loginBase.feature:964:15)
    at assert (tests?p=tests/cypress/e2e/login/loginBase.feature:971:9)
    at assertAndReturn (tests?p=tests/cypress/e2e/login/loginBase.feature:975:9)
    at getRegistry (tests?

Cypress version : v10.10.0

//tests/cypress/e2e/login/login.feature

@regression
   @login
  Feature: Login to base url
  
    Scenario: Login to base url
    Given I go to base url

//step defintion:

tests/cypress/stepDefinitions/login.cy.js  



 import { Given, When, Then, Before, After, And } from "@badeball/cypress-cucumber-preprocessor";

When('I go to base url', () => {
  cy.visit(Cypress.config().baseUrl);
})

// tests/cypress/support/index.js file

    // Import commands.js using ES2015 syntax:
    import './commands'
    Cypress.on('uncaught:exception', (err, runnable) => {
      // returning false here prevents Cypress from
      // failing the test
      return false
    });


   

//tests/cypress/support/e2e.js

    // Import commands.js using ES2015 syntax:
    import './commands'
 
    Cypress.on('uncaught:exception', (err, runnable) => {
        // returning false here prevents Cypress from
        // failing the test
        return false
    })

//.cypress-cucumber-preprocessorrc.json // add this file in project root location

    {
      "stepDefinitions": [
        "[filepath].{js,ts}",
        "tests/cypress/stepDefinitions/**/*.{js,ts}"
      ]
    }

// cypress.config.js

    const { defineConfig } = require('cypress')
    const createBundler = require("@bahmutov/cypress-esbuild-preprocessor");
    const addCucumberPreprocessorPlugin = require("@badeball/cypress-cucumber-preprocessor")
    const createEsbuildPlugin = require("@badeball/cypress-cucumber-preprocessor/esbuild").createEsbuildPlugin;
    const dotenvPlugin = require('cypress-dotenv');
    
    async function setupNodeEvents(on, config) {
        await addCucumberPreprocessorPlugin.addCucumberPreprocessorPlugin(on, config);
        on(
            "file:preprocessor",
            createBundler({
                plugins: [createEsbuildPlugin(config)],
            })
        );
        //webpack config goes here if required
        config = dotenvPlugin(config)
        return config;
    }
    
    module.exports = defineConfig({
        e2e: {
            baseUrl: 'https://bookmain.co',
            apiUrl: 'https://bookmain.co/api/books/',
            specPattern: "tests/cypress/e2e/**/*.feature",
            supportFile: false,
            setupNodeEvents
        },
        component: {
            devServer: {
                framework: "next",
                bundler: "webpack",
            },
        },
    });

// package.json

"cypress-cucumber-preprocessor": {
    "nonGlobalStepDefinitions": true,
    "stepDefinitions": "tests/cypress/stepDefinitions/**/*.{js,ts}",
    "cucumberJson": {
      "generate": true,
      "outputFolder": "tests/cypress/cucumber-json",
      "filePrefix": "",
      "fileSuffix": ".cucumber"
    }
  },

Answer 1

In cypress.config.js add the following:

const {dotenvPlugin} = require('cypress-dotenv');

module.exports = (on, config) => {
  config = dotenvPlugin(config)
  return config
}

This will resolve the issue.