2008234 - [When an opt-in dialog is visible] Insufficient contrast (Weather card)

Status: NEW

(Firefox :: New Tab Page, defect)

Description

[John Northup]

Steps to Reproduce

While the Weather Opt-In dialog is visible, observe the weather information above it.

Expected Behavior

Text contrast is at least 4.5:1. Images that convey information have at least 3:1 contrast.

Actual Behavior

Contrast is 2.57:1.

User Impact

Users with may have difficulty perceiving low-contrast text and images.

WCAG 2.2 References

• WCAG 1.4.3 - Contrast (Minimum)

Recommendations

Use the same colors that are used while the dialog is not present.

Testing Environment

Any

Assistive Technology Used

Any or None

Code Pointers

Further Reference

• WebAIM Contrast Checker

Comment 1

[John Northup]

Attachment: Weather card with low contrast while Opt-in dialog exposed

Comment 2

[Monica Chiorean]

Marking issue as new, but this should be marked as enhancement, not issue.

Comment 3

[❌ Anna Yeddi [:ayeddi] ❌ On leave until 2027-01-04]

It appears that the weather widget is shown in its disabled/inactive state while waiting for a user to opt-in or opt-out (react to the dialog "Do you want to see the weather for your location?" shown). In this case, the WCAG text contrast criterion would not apply, but at Mozilla we're trying to ensure that the on-screen content that is meaningful is still possible to perceive by users and for disabled controls' labels to have 3:1 in color contrast against their background (less than 4.5:1 expected by the WCAG for non-disabled interfaces).

Since the design team decided to still show this inactive version of the Weather widget, it is probably aimed to work as a preview for feature, thus probably we'd like users to still be able to know what could be shown for them, if they opt-in.

Making the text to have 3:1 in color contrast is recommended. If the Weather widget is, in fact, still operable in this state (with the opt-in screen), the accessibility severity should be bumped from access-S4 to access-S2, per the Accessibility triage guidelines