Skip to content
master
Switch branches/tags
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
bin
 
 
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

Whoopsie

Build Status Coverage Status

Whoopsie is a visual regression tool for testing responsive web sites.

Installation

$ npm install -g whoopsie

Note: Whoopsie requires Node.js 8 or higher and a recent version of ImageMagick.

Configuration

See config/sample.yaml for a sample configuration file.

Usage

Commands

gallery

Run visual regression tests and generate an HTML gallery containing the results. This command is an alias for whoopsie test --reporter gallery.

$ whoopsie gallery path/to/config.yaml

test

Run visual regression tests. Uses the json reporter by default.

$ whoopsie test path/to/config.yaml

validate-config

Check that the configuration file is valid.

$ whoopsie validate-config path/to/config.yaml

Options

Name Default value Description
--reporter json Test result reporter(s) to use.
--concurrency os.cpus().length Number of tests to run concurrently
--verbose <Off> Print extra information while running
--debug <Off> Print extra debugging information while running
--quiet <Off> Only print errors while running

Reporters

Reporters can be specified when running whoopsie test by passing the --reporter flag. More than one reporter can be specified. The default reporter is json.

gallery

Outputs test results as an HTML gallery.

json

Outputs test results as JSON.

{
    "summary": {
        "total": 2,
        "failures": 0,
        "passes": 2
    },
    "results": [
        {
            "base": {
                "type": "selector",
                "selector": ".nw-c-top-stories",
                "id": "capture$ad367858",
                "page": {
                    "path": "/news",
                    "selectors": [
                        ".nw-c-top-stories",
                        ".nw-c-must-see"
                    ],
                    "url": "http://www.bbc.com/news"
                },
                "imagePath": "/tmp/whoopsie-capture$ad367858-0.png"
            },
            "test": {
                "type": "selector",
                "selector": ".nw-c-top-stories",
                "id": "capture$c1dbebb0",
                "page": {
                    "path": "/news",
                    "selectors": [
                        ".nw-c-top-stories",
                        ".nw-c-must-see"
                    ],
                    "url": "http://www.test.bbc.com/news"
                },
                "imagePath": "/tmp/whoopsie-capture$c1dbebb0-0.png"
            },
            "diff": {
                "total": 0,
                "percentage": 0,
                "id": "compare$520b7196",
                "imagePath": "/tmp/whoopsie-compare$520b7196.png"
            },
            "viewport": {
                "width": 640,
                "isMobile": true
            }
        },
        {
            "base": { ... },
            "test": { ... },
            "diff": { ... },
            "viewport": { ... }
        }
    ]
}

Docker

If you prefer to run Whoopsie in a container, you can use the official Docker image:

$ docker pull wildlyinaccurate/whoopsie
$ docker run --rm --volume $PWD:/whoopsie --workdir /whoopsie \
    wildlyinaccurate/whoopsie \
    whoopsie gallery /whoopsie/path/to/config.yaml

License

ISC