cypress-io / cypress

Fast, easy and reliable testing for anything that runs in a browser.
https://cypress.io
MIT License
47.07k stars 3.19k forks source link

Cypress Cucumber Setup #16883

Closed nazeer100 closed 1 year ago

nazeer100 commented 3 years ago

Hi, While running cypress cucumber feature file with Cypress 7.5 version below error is displayed.

Error: Webpack Compilation Error
./cypress/integration/Google.feature 1:16
Module parse failed: Unexpected token (1:16)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> Feature: Google Main Page
| 
|   I want to open a search engine

I followed the below steps. https://github.com/TheBrainFamily/cypress-cucumber-preprocessor https://www.npmjs.com/package/cypress-cucumber-preprocessor

Let me know any changes are required?

thomassjogren commented 3 years ago

@nazeer100 I think you will get better and more relevant answers posting this issue on the package repo.

Also, you have to provide us with more information (configs, code and so on) in order for us to be able to help you.

That said. Even with this little information, the problem is that your specs are parsed by webpack and it doesn't understand the file.

Thimmaraju commented 3 years ago

npm i cypress-cucumber-preprocessor run this again and check ur package.json should have this dependency

PavanGurram-DevOps commented 3 years ago

@jennifer-shehane - Is there any update on it as I'm facing same issue on Windows 10 laptop? Please let me know if I need to share any details for investigation. Thanks

PavanGurram-DevOps commented 3 years ago

@nazeer100 Is it resolved for you please? If yes kindly help

Saurabhj89 commented 2 years ago

Add below code in 'cypress/plugins/index.js' file. This worked for me.

const cucumber = require('cypress-cucumber-preprocessor').default module.exports = (on, config) => { on('file:preprocessor', cucumber()) }

peteCarey commented 2 years ago

I had a similar error message. It turned out to be an ES Lint parsing problem with .js files. I was able to fix it by adding to the .eslintignore file to omit the necessary files. The Cypress/Cucumber tests were then able to run.

KRT-DEMO commented 2 years ago

I am experiencing the same issue in our project. @peteCarey can you please share the files or types of files that you added to the .eslintignore that resolved this issue?

dil-snagy commented 2 years ago

hi guys,

today I had the same issue. My solution was the following: My problem was that I accidently put the cypress configuration (see screenshot below) to the folder 'cypress/support/index.js' instead of the file 'cypress/plugins/index.js'. After I fixed it the issue become solved.

I hope I was able to help you.

Sandor

image

ps: I also added the eslintignore file, but I do not think hat solved it. Mine has the following:

{ "extends": ["airbnb-base", "prettier"], "plugins": ["cypress", "prettier"], "env": { "browser": true, "cypress/globals": true, "jest": true }, "rules": { "prettier/prettier": "error" } }

Himanshu-tester commented 2 years ago

I am having the same issue. I updated the index.js file with below code but still getting the same error. Any suggestions?

const cucumber = require('cypress-cucumber-preprocessor').default

module.exports = (on, config) => { on('file:preprocessor', cucumber()) }

Error message: Error: Webpack Compilation Error ./cypress/integration/Basic_Tests/BDD/reportgen.feature 1:13 Module parse failed: Unexpected token (1:13) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders

pwpatton commented 2 years ago

If you are using the cypress-allure plugin you can also get this error if you don't specify allure and cucumber in the plugin/index.ts file correctly. I had to make that on("file:preprocessor", cucumber(options)); was called before allureWriter(on, config);

const cucumber = require("cypress-cucumber-preprocessor").default;
const browserify = require("@cypress/browserify-preprocessor");
const allureWriter = require('@shelex/cypress-allure-plugin/writer');

module.exports = (on, config) => {
  const options = {
    ...browserify.defaultOptions,
    typescript: require.resolve("typescript"),
  };

  on("file:preprocessor", cucumber(options));

  allureWriter(on, config);
  return config;
};
tar-aldev commented 2 years ago

For me, in cypresss.json, I had "pluginsFile": false for some reason. Maybe this is not an issue in your case, but it is worth checking

palnic-chisel commented 1 year ago

If you are using Cypress > 10 you need to add your configuration in cypress.config.ts like this (I'm using typescript, if you are not, avoid to copy the options part:

import { defineConfig } from 'cypress';

const browserify = require('@cypress/browserify-preprocessor');
const cucumber = require('cypress-cucumber-preprocessor').default;
const resolve = require('resolve');

export default defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      const options = {
        ...browserify.defaultOptions,
        typescript: resolve.sync('typescript', { baseDir: config.projectRoot }),
      };
      on('file:preprocessor', cucumber(options));
    },
    specPattern: ['./**/*spec*.ts', '**/*.{feature,features}'],
  },
});
emilyrohrbough commented 1 year ago

I am going to close this issue. It sounds like the original issue was possibly(?) with setting up the cucumber-preprocessor and several people have provided solutions to setting this up in projects with various tools.

mahRukh-133 commented 1 year ago

I'm facing this issue installing cucumber in #Cypress

Screenshot_36
nagash77 commented 1 year ago

@mahRukh-133 Can you please open a new issue with a reproducible example of your steps that lead up to the problem please?