feature extension. WebStorm integrates with Cucumber.js and recognizes features written in Gherkin so you can run Cucumber,js test right from the IDE.
In the embedded Terminal (Alt+F12), type one of the following commands:
npm install cucumberfor local installation in your project.
npm install -g cucumberfor global installation.
npm install --save-dev cucumberto install Cucumber.js as a development dependency.
Creating test definitions
Place the cursor at the step without a definition, press Alt+Enter, and select Create step definition or Create all step definitions.
Alternatively, hover the mouse over the step and use the links in the popup.
In the dialog that opens, specify the name for the new file and the language version to write the definitions in.
If such file already exists, WebStorm displays a popup where you have to select a file to add the definition to or choose to create a new file.
Cucumber.js tests are launched only through a run/debug configuration.
Create a Cucumber.js run configuration
Select a test file in the Project tool window and select Create <filename> from the context menu. The Run/Debug Configuration: Cucumber.js dialog opens.
In the Feature file or directory field, specify the tests to run. Type the path to a specific
.featurefile or to a folder, if you want to run a bunch of features.
In the Cucumber package field, specify the path to the folder where the
cucumberpackage is stored or the location of the
cucumber-js.bat, or other executable depending on your operating system.
Specify the working directory of the application. By default, the Working directory field shows the project root folder. To change this predefined setting, specify the path to the desired folder or choose a previously used folder from the list.
If you are using TypeScript for step definitions, click in the Before launch area, select Compile TypeScript from the list, and then specify the tsconfig.json file to use. WebStorm will run the TypeScript compiler with this tsconfig.json before running Cucumber.js.
To debug tests written in TypeScript, open your tsconfig.json and set
"sourceMap": trueto enable source maps.
In the Name Filter field, type the name of a specific scenario to run instead of all the scenarios from the feature file or directory.
Specify the command line arguments to be passed to the executable file, such as
--tags TAG_EXPRESSION), or
--coffee. For details, see native built-in help available through the
Run tests via a run configuration
Select the Cucumber.js run/debug configuration from the list on the main toolbar and click to the right of the list.
The test server starts automatically without any steps from your side. View and analyze messages from the test server in the Run tool window.
Monitor test execution in the Test Runner tab of the Run tool window.
With WebStorm, you can jump between a file and the related test file or from a test result in the Test Runner Tab to the test.
Open the file in the editor and selector from the context menu, or just press Ctrl+Shift+T.
To jump from a step in a .feature file to the step definition, place the cursor at the step and press Ctrl+Shift+T.
To jump from a test result to the test, select the test name in the Test Runner tab and choose Jump to Source from the context menu. The test file opens in the editor with the cursor placed at the test definition.
Configuring syntax highlighting
You can configure Cucumber.js-aware syntax highlighting according to your preferences and habits.
In the Settings/Preferences dialog (Ctrl+Alt+S), go to .
Select the color scheme, accept the highlighting settings inherited from defaults or customize them as described in Configuring Colors and Fonts.