cypress-axe
jest-axe
cypress-axe | jest-axe | |
---|---|---|
5 | 4 | |
604 | 1,044 | |
1.2% | - | |
1.9 | 3.0 | |
2 months ago | 11 days ago | |
TypeScript | JavaScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
cypress-axe
-
✨ Accessibility: a gentle introduction ✨
If you’re setting up automated tests (and you probably should), you can even integrate axe with Cypress
-
Automated Accessibility Testing
The same engine can be used with Cypress, thanks to the cypress-axe package. It adds several custom commands to the Cypress API, which utilizes “axe-core” under the hood. It makes it possible to perform a11y audits directly while testing.
-
Starting Your Accessibility Journey: A Developers Guide
Cypress
-
Writing end-to-end tests in 2021
Luckily for us, there’s a new player in town. Cypress is a great tool that provides us with a modern solution for creating, running and maintaining code. Combined with Cypress Testing Library and the accessibility audit tool aXe, you’ll have all the tools you need to gain confidence in your application, and to never deal with manual verifications in prod ever again.
-
Accessibility Scanning Tools
Maybe: https://github.com/component-driven/cypress-axe/issues/82
jest-axe
-
Xbox’s Matt Booty ‘dreams’ of having AI as QA testers
I usually use a combination of Storybook + Chromatic, Cypress, and Jest + Testing Library + jest-axe. Fairly standard, I think? (Aside from Chromatic, but that's mainly for convenience)
-
How to build an inline edit component in React
And finally, we can use a cool library called jest-axe. You can use it to assert that your component doesn’t have any accessibility violations:
-
Study Notes for Kent C. Dodds' Javascript Testing Course
How to test accessibility issues? Use Jest-axe GitHub - nickcolley/jest-axe: Custom Jest matcher for aXe for testing accessibility ♿️🃏
-
Automated Accessibility Testing Is a Good Start - But You Need To Test Manually Too
Tests are another place where plugins can bring more accessibility insights. I've used two, depending on the test setup: jest-axe and cypress-axe. They both add axe-core, Deque's testing solution to the testing environment.
What are some alternatives?
cypress-testing-library - 🐅 Simple and complete custom Cypress commands and utilities that encourage good testing practices.
eslint-plugin-jsx-a11y - Static AST checker for a11y rules on JSX elements.
cypress-real-events - Fire native system events from Cypress.
test-data-bot
axe-core-maven-html - Tools for using axe for web accessibility testing with JUnit, Selenium, and Playwright
Cypress - Fast, easy and reliable testing for anything that runs in a browser.
cypress-plugin-tab - A cypress plugin to add a tab command
lighthouse - Automated auditing, performance metrics, and best practices for the web.
axe-core-npm
msw - Seamless REST/GraphQL API mocking library for browser and Node.js.
jest-dom - :owl: Custom jest matchers to test the state of the DOM