Testing & Debugging: Cypress.io - dotherightthing/wpdtrt-plugin-boilerplate GitHub Wiki

Summary

Cypress is used to automate end to end testing.

End-to-end testing is a methodology used to test whether the flow of an application is performing as designed from start to finish. The purpose of carrying out end-to-end tests is to identify system dependencies and to ensure that the right information is passed between various system components and systems. ~ https://www.techopedia.com/definition/7035/end-to-end-test

Applies to

Generated plugins

Status

Requires DTRT WordPress Plugin Boilerplate 1.5.7+
Stable @ 1.6.8
Needs further documentation and testing re Tenon Accessibility testing via WordPress

Usage

yarn run test

./node_modules/.bin/cypress open

Configuration

Base URL

Configuration is handled by the DTRT WordPress Plugin Boilerplate Generator, but you may also edit this as follows:

Edit cypress.json:

"baseUrl": "http://dontbelievethehype2.dan"

Tenon

See Set up environmental variables - Tenon API key.

Writing tests

DOM Assertions

Cypress bundles the popular Chai assertion library, as well as helpful extensions for Sinon and jQuery, bringing you dozens of powerful assertions for free.

Chai-jQuery's assertions are used with with chai's expect or should assertions:

have.attr
have.class
have.css
have.data

etc.

// default viewer attributes
// when element is offscreen
cy.get( '@galleryViewerBelowFold' )
    .should( 'have.class', 'wpdtrt-gallery' )
    .should( 'have.class', 'gallery-viewer' )
    .should( 'have.attr', 'data-has-gallery', 'false' )
    .should( 'have.attr', 'data-expanded', 'false' );