fix(color-contrast): add special case for new sr-only technique#2985
fix(color-contrast): add special case for new sr-only technique#2985WilcoFiers merged 4 commits intodevelopfrom
Conversation
WilcoFiers
left a comment
There was a problem hiding this comment.
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
| (isClipped(style) || | ||
| style.getPropertyValue('opacity') === '0' || | ||
| (getScroll(el) && parseInt(style.getPropertyValue('height')) === 0)) | ||
| (getScroll(el) && elHeight === 0) || |
There was a problem hiding this comment.
Is there a reason you left this at 0?
There was a problem hiding this comment.
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.
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