Tutorial 15 – Add support for feature files in Cypress cucumber
What you will Learn :
Add support for feature files to your cypress project
nonGlobalStepDefinitions configuration
Cucumber (Gherkin) Full Support plugin
Add support for feature files to your cypress project
Until now, we have learnt that, cypress supports javascript files and by default, cypress runs Tests which have .js extension
However, if you want to run cucumber files, cypress should trigger the Gherkin scenario.
We create these scenarios in a file with .feature extension. So we call them as feature files. So, the file in which you write your scenario, that file is called a feature file in cucumber terminology. That feature file should be written with a .feature extension.
So if you want to run cucumber framework, you have to execute .feature files. But until now, by default, cypress has been running the files with .js extension. So we have to explicitly tell cypress to execute .feature files as well. We can do this by adding the below line in cypress.json
As of now, we don’t have any entry inside cypress.json file
Now, let us copy the line, see below
Paste it inside cypress.json
Save the cypress.json file.
So now, cypress can run .js and .feature files
nonGlobalStepDefinitions configuration
We have studied that, each line of a scenario is a ‘step’. We further define these steps by writing the actual cypress code inside the ‘Step Definition’ file.
Now, how does the feature file (recall that feature file contains a scenario, which in-turn contain steps and each step linked to step definition) know where is my step definition file? You can define that globally by setting one attribute. Once you do that, the feature file will check the step definition file in the global folder.
So to do that, copy the below section
Paste it inside package.json, see below
Make sure that you start with a comma (see line#14 below)
Save the package.json file.
Cucumber (Gherkin) Full Support plugin
This plugin adds rich language support for the Cucumber (Gherkin) language to Visual Studio code, example: syntax highlight, formatting, auto completion of steps etc.
To install this plugin, go to https://marketplace.visualstudio.com/items?itemName=alexkrechik.cucumberautocomplete&ssr=false#overview
Click Install
You would see the below popup
Click Continue
Another popup comes up
Click ‘Open Visual Studio Code’
Visual studio opens up and you would see below
Click Install button that you see in above snapshot
You would now see ‘Installing’, see below
After a minute or so, the plugin gets installed
We are all set now. We are now ready to start our scenarios and their respective step definition files.
Thank you for reading!