Cypress Match Repeat Snapshot
A Cypress plugin aims to test interaction easily.
Install
Install with npm
$ npm install cypress-repeat-snapshot --save-dev
Configure
// cypress/plugins/indexconst addMatchRepeaterPlugin = ;module {;};// cypress/support/commands;;// Command name is `toMatchRepeatSnapshot` by default.// Options can be passed as a default options here or you can pass it to `toMatchRepeatSnapshot` command.;
At this point, the command is available.
// sometest.spec.jscy
It you need typescript intellisense support, add triple slash directive to your spec file.
/// <reference types="cypress-repeat-snapshot" />
Usage
basic
You can pass the snapshot(JSON file from repeater), then the repeater will run automatically.
// sometest.spec.js// just take a screenshotcy// repeat actions and take a snapshotcy// repeat actions and take a snapshot whose file name is `snapshotName`cy// pass options in single testcy// take a screenshot of selected elementcy
Or you can just write it by yourself, the file will looks like this:
After the test finished, you can check screenshots in /cypress/__repeater__snapshots
.
Options
You can pass any options which is jest-image-snapshot
or cy.screenshot
options.
For example, you can set customSnapshotsDir
or customDiffDir
which is the property of the jest-image-snapshot
's options:
cy
Custom event properties
Any event properties can be added in repeater JSON file and it will be passed to event triggered.
// repeater.json
Updating snapshots
Run Cypress with --env updateSnapshots=true in order to update the base image files for all of your tests.
Preventing failures
Run Cypress with --env failOnSnapshotDiff=false in order to prevent test failures when an image diff does not pass.
Other features
How it works
The workflow of call toMatchRepeatSnapshot(name, json)
:
- dispatch all events from json
- use cypress image snapshot to save and diff screenshot