-
Notifications
You must be signed in to change notification settings - Fork 794
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(color-contrast): add special case for new sr-only technique #2985
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you add and/or update a test to go with this?
Score +1 for proper testing; in firefox the false positive described in the ticket doesn't show up at all due to differences in the bounding rect calculations, leading me to think my code fixed the issue. Pushed a better fix that adds a new special case to the sr-only detection, and added a test for it. |
lib/commons/dom/is-visible.js
Outdated
if ( | ||
!screenReader && | ||
(isClipped(style) || | ||
style.getPropertyValue('opacity') === '0' || | ||
(getScroll(el) && parseInt(style.getPropertyValue('height')) === 0)) | ||
(getScroll(el) && elHeight === 0) || |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is there a reason you left this at 0?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, turns out it wasn't relevant to the case I was trying to address so I left it alone. Would you rather it be bumped up too?
lib/commons/dom/is-visible.js
Outdated
(getScroll(el) && elHeight === 0) || | ||
(style.getPropertyValue('position') === 'absolute' && | ||
elHeight <= 1 && | ||
style.getPropertyValue('overflow') === 'hidden')) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
6 line if statement's a bit much. Can you isolate some of the logic on this?
Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com>
* bump up height requirement for sr-only to 1px * add special case for sr-only method * use less than 2 Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com> * make if smaller Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com>
* bump up height requirement for sr-only to 1px * add special case for sr-only method * use less than 2 Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com> * make if smaller Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com>
* bump up height requirement for sr-only to 1px * add special case for sr-only method * use less than 2 Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com> * make if smaller Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com>
The minimum CSS that makes the element from the example visually hidden is a combination of:
So if the user is doing that, they are probably trying to hide the element visually and axe-core should recognize that.
Note that the repro case will not fail in Firefox even without this code.
Closes #2962