grunt-cucumberjs

Generates documentation from Cucumber features

grunt-cucumberjs

Runs cucumberjs features and output results in various formats including html.

This plugin requires Grunt ~0.4.1

If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

npm install grunt-cucumberjs --save-dev

Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

grunt.loadNpmTasks('grunt-cucumberjs');

In your project's Gruntfile, add a section named cucumberjs to the data object passed into grunt.initConfig().

grunt.initConfig({
  cucumberjs: {
    options: {
      format: 'html',
      output: 'my_report.html',
      theme: 'bootstrap'
    },
    my_features: ['features/feature1.feature', 'features/feature2.feature'],
    other_features: {
      options: {
        output: 'other_report.html'
      },
      src: ['other_features/feature1.feature', 'other_features/feature2.feature']
    }
  }
});

If all your feature files are located in the default location of features/ then just leave the feature configuation as an empty array. See following:

cucumberjs: {
  options: {
    format: 'html',
    output: './public/report.html',
    theme: 'foundation'
  },
  features : []
}
#runs all features specified in task
$ grunt cucumberjs
 
#you can override options via the cli
$ grunt cucumberjs --require=test/functional/step_definitions/ --features=features/myFeature.feature --format=pretty

Type: String Default: ''

Passes the value as --steps parameter to cucumber.

Type: String Default: ''

Passes the value as --require parameter to cucumber. If an array, each item is passed as a separate --require parameter. Use if step_definitions and hooks are NOT in default location of features/step_definitions

Type: String|Array Default: ''

Passes the value as --tags parameter to cucumber. If an array, each item is passed as a separate --tags parameter.

Type: String Default: 'foundation' Available: ['foundation', 'bootstrap', 'simple']

Specifies which theme to use for the html report

Type: String Default: 'features/templates'

Location of your custom templates. Simply name the template the same as the one you are trying to override and grunt-cucumberjs will use it over the default template

Type: String Default: 'features_report.html'

Type: String Default: 'html' Available: ['pretty', 'progress', 'summary', 'html']

Type: Boolean Default: 'false' Available: ['true', 'false']

To keep or not the generated json file, applicable for options.format = html only. It will be saved as options.output + '.json'

Type: Boolean Default: 'false' Available: ['true', 'false']

ends the suite after the first failure

Type: Boolean Default: 'false' Available: ['true', 'false']

A flag to turn console log on or off

Type: Boolean Default: 'false' Available: ['true', 'false']

A flag to enabling debuggin from IDE like WebStorm. Limitation of this flag is it only does not support the HTML output, yet ;)

Type: Boolean Default: 'undefined' Available: ['true', 'false']

A flag to enable Parallel execution. It requires dependency on parallel-cucumber npmjs module

Type: Number Default: '8' Available: '1 to 8'

The number of features that will be executed in parallel.

If you are using WebDriverJS (or related framework) along with cucumber-js for browser automation, you can attach screenshots to grunt-cucumberjs HTML report. Typically screenshots are taken after a test failure to help debug what went wrong when analyzing results, for example

this.After(function (scenariocallback) {
        if(scenario.isFailed()){
            driver.takeScreenshot().then(function (buffer) {
                scenario.attach(new Buffer(buffer, 'base64').toString('binary'), 'image/png');
                 driver.quit().then(function () {
                                callback();
                 });
            });
        }
});

If you are using WebDriverJS (or related framework) along with cucumber-js for browser automation, you can attach texts to grunt-cucumberjs HTML report. This helps in debugging or reviewing your results in particular to your tests data.

this.After(function (scenariocallback) {
  scenario.attach("test data goes here");
});

Below are some sample HTML reports with screenshots (note that javascript to collapse/expand a screenshots doesn't appear to respond in htmlpreview site below, but they should work fine on locally generated reports,

  1. Bootstrap Theme Reports
  2. Simple Theme Reports
  3. Foundation Theme Reports

Sample pie chart is available at Bootstrap Theme Report with Pie Chart

Two pie charts are displayed on report

  1. Features: number of passed/failed features
  2. Scenarios: number of passed/failed/pending scenarios.

Please note that Pie Charts are available only for Bootstrap Theme