Skip to content
This repository has been archived by the owner on Dec 30, 2024. It is now read-only.

QW-ACT-R37 yields false for positive for high opacity text on transparent background #22

Closed
Tellus opened this issue Aug 10, 2023 · 2 comments

Comments

@Tellus
Copy link
Contributor

Tellus commented Aug 10, 2023

Hey guys,

I think we've hit a bug similar to the ones in #19 and #9 - I'm creating a separate issue because I think there may be a slight difference in specificities.

Our example: https://www.brs.dk/da/borger/om-redningsberedskabet-i-danmark/redningsberedskabet-i-danmark/det-kommunale-redningsberedskab/beskyttelsesrum-og-sikringsrum/

QW-ACT-R37-bug-example

I took a dive into the code itself, and for us I think the issue is how the contrast between foreground and background is calculated. Our example differs from the two referenced in that there's no funny business with pseudo-classes or odd placements - just a transparent backgruond.

In our example, both foreground and background have very dark colours, but the background colour has very low opacity (10%). This allows the much whiter background to shine through in the finally rendered image. For an end user, there isn't an issue with contrast.

The current code correctly identifies the opacity of the background, but doesn't actually use it when trying to figure out the final contrast.

I've been mulling over how to solve the issue. You'd probably need to identify that the background is not opaque (alpha < 1) and then blend the background colour downwards into parent elements until you hit an opaque background color. I fear this required might changes in @qualweb/qw-element as well as this repo, so I've held off on trying out any solutions (hacking on the code across 3+ repos is quite cumbersome :-X )

@carlosapaduarte
Copy link
Contributor

#23 should fix this

@Tellus
Copy link
Contributor Author

Tellus commented Nov 9, 2023

As @carlosapaduarte notes, 90f49ec should fix this issue. Closing.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants