react-bucharest / mugshot-demo

Visual regression testing demo with Mugshot and React Component Playground

mugshot-demo

Visual regression testing demo with Mugshot and React Component Playground

How to run in Docker

You first need to install Docker for Mac: https://docs.docker.com/docker-for-mac/

yarn install
yarn run docker:test:visual

How to run locally

• Install required packages

  yarn install

• Install selenium-standalone and start a server

  yarn install selenium-standalone@latest -g
  selenium-standalone install
  selenium-standalone start

• Run a Component Playground instance locally

  yarn run playground

  The visual test suite will iterate through each component/fixture pair in the playground and check for differences.

• Run the visual test suite

  yarn run test:visual

  This will generate the baseline screenshots the first time and will check for differences in subsequent runs.

• Make a change to the styles of any component (ex: button.less) and re-run the tests.

• Finally inspect the diffs inside the reporter by opening visual-report/statics/index.html in any browser.