cypress-axe: False positives when using Cypress-axe
I started using cypress-axe to catch a11y issues when running end to end tests automatically, but I am finding it challenging to get the tests to pass. I get two errors which I believe are false positives:
- page-has-heading-one
- landmark-one-main
I use react-axe, which prints a11y issues to browser console in development mode, but I don’t see these two issues reported by that package. I tried auditing using Axe Chrome extension, but I do not see these.
I would be happy to provide more information, but at this point, I believe it to be a bug with cypress-axe.
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Comments: 20
Thanks, @JoshuaKGoldberg for posting the repo for verification. I verified with default Cypress setup (using browserify as the preprocessor), as well as a setup with the webpack preprocessor (no TS). With your TS setup, it looks like this update covers the scenarios that seemed to be causing problems.
Maybe it’s a timing issue with cypress-axe testing page content before it’s fully loaded? I don’t work on cypress-axe myself, but I used to be on the axe-core team and I maintain the cypress docs in Gatsby. So I have lots of ideas of things to try if you aren’t getting a response from the maintainer!
Some things you could do to play around with it:
cy.get('header')or some other element that contains the h1 instead ofcy.waitto see if anything changes with DOM readinessLooks like better-cypress-axe bundles axe-core with it instead of a peer dependency, maybe it’s related to an axe-core version? not sure.