Skip to content
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.

Sign up for GitHub

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

Jump to bottom

False positive: color-contrast rule fails when body height set to 0-8px #1456

Closed
iamrafan opened this issue Mar 22, 2019 · 4 comments
Closed

False positive: color-contrast rule fails when body height set to 0-8px #1456

iamrafan opened this issue Mar 22, 2019 · 4 comments
Assignees
@scurker
Labels
color contrast Color contrast issues fix Bug fixes rules Issue or false result from an axe-core rule support

Comments

@iamrafan
Copy link
Contributor

Color-contrast rule fails when body height is set to 0-8px, irrespective of the presence of sufficient background/foreground contrast ratio.

Demo: https://codepen.io/iamrafan/pen/WmLJmw?editors=1000#0

axe-core version: 3.1.2
axe-Coconut version: 3.7.0
@WilcoFiers WilcoFiers added fix Bug fixes color contrast Color contrast issues rules Issue or false result from an axe-core rule support labels Mar 26, 2019
@WilcoFiers
Copy link
Contributor

That's pretty darn obscure, but jup, that's a false positive.

@scurker
Copy link
Member

scurker commented Apr 10, 2019

I did some digging to see if I could determine the root of the problem.

In the example, there's a link element of which we take the center x/y coordinates in order to determine the background element stack. It just so happens the y coordinate is 17 pixels which when we take into account the body height of 8px and the user agent margin of 8px, body ends up being left out of the background stack with elementsFromPoint().

However, this is a case where the visible canvas has a special background color according to the spec:

CSS3 Backgrounds Spec:

The document canvas is the infinite surface over which the document is rendered. Since no element corresponds to the canvas, in order to allow styling of the canvas CSS propagates the background of the root element (or, in the case of HTML, the <body> element) as described below. However, if no boxes are generated for the element whose background would be used for the canvas (for example, if the root element has display: none), then the canvas background is transparent.

Since the visible HTML canvas has a background color but not a intrinsically defined one that's within the coordinates, the rule fails. We should probably have html inherit its color value from <body> when no background-color exists for html.

@scurker scurker self-assigned this Apr 10, 2019
@scurker scurker mentioned this issue Apr 18, 2019
Merged
4 tasks
@scurker scurker mentioned this issue Apr 25, 2019
Merged
4 tasks
@aellsey aellsey added this to the HTMLTools Sprint 2 milestone May 6, 2019
@WilcoFiers WilcoFiers removed this from the HTMLTools Sprint 2 milestone May 8, 2019
@jeankaplansky
Copy link
Contributor

No docs required.

@chandana7393
Copy link

Color-contrast violation is not throwing when height is set to 0-8px.
color_contrast_height
Tested Environment:
Axe-coconut - 3.8.0.15404v
Chrome - 74v
OS - Windows 10 64 bit.

@kylemh kylemh mentioned this issue Apr 21, 2020
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@scurker scurker

Labels
color contrast Color contrast issues fix Bug fixes rules Issue or false result from an axe-core rule support
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
6 participants
@WilcoFiers @scurker @jeankaplansky @iamrafan @chandana7393 @aellsey