Diffy Steps

Overview

Diffy Steps adds step definitions to Webship-js 2.0.x for the markup the platform itself renders, regardless of theme or distribution, so scenarios read as plain sentences instead of CSS selectors. It is a plugin for Webship-js: it ships one file of step definitions you drop into an existing test project, and it composes with the built-in steps rather than duplicating them.

Install

npm install --save-dev @webship-js/diffy-steps

Then add its step file to cucumber.js beside the Webship-js steps:

require: [
  'node_modules/webship-js/tests/step-definitions/**/*.js',
  'node_modules/@webship-js/diffy-steps/tests/step-definitions/*.js',
  'tests/step-definitions/**/*.js',
]

Steps

• When I resize window to "1200"
• Then I take screenshot
• Then I take screenshots for all breakpoints
• Then send screenshots to diffy with name "baseline"
• Then create diffy comparison
• Then create diffy comparison with name "release-2.0"
• Then create diffy screenshot from "production" environment
• Then compare diffy "prod" with "stage"
• Then upload folder "./screenshots/baseline" to diffy as "baseline"
• Then wait for diffy comparison to complete

Every assertion step reads both polarities from one definition: should see and should not see are the same step. Source and issues: github.com/webship/diffy-steps.