better-cypress-axe
TypeScript icon, indicating that this package has built-in type declarations

1.0.8 • Public • Published

Better Cypress-Axe

PRs Welcome


Accessibility

This package extends the existing and already awesome cypress-axe package. This package bundles the required axe-core dependencies, which is the reason why I felt it should be a separate package to cypress-axe.

Who is this for?

  • You're battling with a Webpack setup issue.
  • You want custom logging in the cypress console.
  • You don't want the a11y issues failing the entire e2e tests - this can be an issue if you're adding this to a existing project.

Installation

Assuming you already have cypress installed and setup.

npm install --dev better-cypress-axe
 
# Alternatively if using yarn 
yarn add dev better-cypress-axe

NOTE: There is no need to add axe-core or cypress-axe as they're already bundled into this package to get around the issues mentioned above.

Then follow the steps from cypress-axe setup...

  1. Import better-cypress-axe by adding to cypress/support/index.js

    import "better-cypress-axe"
  2. injectAxe

  3. configureAxe - note this isn't required

  4. checkA11y

Custom Logging and Reporting

You can define a custom cypress loggers and violation handing by passing in an object to the checkAlly command.

This is useful for ensuring the logging follows a certain format, or that the final report doesn't fail a build.

You'll need to add a cypress task to log to the terminal console.

const customViolationLogger = violation => cy.task("log", violation)
const customViolationHandler = violation => cy.task("log", violation)
 
cy.checkA11y(
    context, // can use undefined
    options, // can use undefined
    {
        logger: customViolationLogger,
        asserter: customViolationHandler
    }
)

Typescript

Add to cypress/typings.d.ts

import "better-cypress-axe"

Development

# Use nvm or node version as per .nvmrc 
nvm use
 
# Install Dependencies 
npm i
 
# Build for deploy 
npm run build
 
# Lint files 
npm run lint

Contributing

Contributions and PR's welcome

Package Sidebar

Install

npm i better-cypress-axe

Weekly Downloads

88

Version

1.0.8

License

MIT

Unpacked Size

1.64 MB

Total Files

6

Last publish

Collaborators

  • olmesm