Grunt-regress NPM

grunt-regress

CSS regression Testing Plugin based on PhantomJS 2

Getting Started

This plugin requires Grunt ~0.4.5

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-regress --save-dev

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

grunt.loadNpmTasks('grunt-regress');

The "regress" task

Overview

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

grunt.initConfig({
  regress: {
    options: {
      // Task-specific options go here.
    },
    your_target: {
      // Target-specific file lists and/or options go here.
      options: {
        viewports: [
          {
            "name": "phone",
            "width": 320,
            "height": 480
          },.. 
        ]
      },

      scenarios: [
        {
          "label": "getbootstrap.com",
          "url": "http://getbootstrap.com"
        }, ...
      ]
    },
  },
});

Usage Examples

Default Options

In this example, we test the responsiveness of the bootstrap page

grunt.initConfig({
  regress: {
    options: {
      // Task-specific options go here.
      dest: 'css_regression'
    },
    your_target: {
      // Target-specific file lists and/or options go here.
      options: {
        viewports: [
          {
            "name": "phone",
            "width": 320,
            "height": 480
          }, {
            "name": "tablet_v",
            "width": 568,
            "height": 1024
          }, {
            "name": "tablet_h",
            "width": 1024,
            "height": 768
          }
        ]
      },

      scenarios: [
        {
          "label": "getbootstrap.com",
          "url": "http://getbootstrap.com"
        }, ...
      ]
    },
  },
});

To generated the reference screens just execute the task grunt regress:your_target:generate