1849697 - Low contrast on the Re-analyze reviews link when using dark theme

Status: VERIFIED FIXED

(Firefox :: Shopping, defect, P3)

Description

[Alexandru Trif, Desktop Test Engineering [:atrif]]

Attachment: image.png

Found in

• 118.0a1 (2023-08-21)

Affected versions

• 118.0a1 (2023-08-21)

Tested platforms

• Affected platforms: Ubuntu 20, Windows 10x64, macOS 12
• Unaffected platforms: none

Preconditions

• dark theme enabled
• browser.shopping.experience2023.enabled: true
• browser.shopping.experience2023.optedIn: 1

Steps to reproduce

1. Open the following Amazon link or a link with outdated reviews.
2. Observe the Re-analyze reviews link while it is hovered and not hovered.

Expected result

• The link is displayed accordingly.

Actual result

• The link is hard to read especially when hovered.

Regression range

• Not Applicable. New feature.

Additional notes

• Attached a screenshot. In the left side picture the link is hovered.

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

:atrif, if you think that's a regression, could you try to find a regression range using for example mozregression?

Comment 2

[Jared Hirsch [:jhirsch] (he/him) (Needinfo please)]

This link will soon be replaced with a button, so I think a lower priority is appropriate.

Comment 3

[Daniel Holbert [:dholbert]]

Attachment: screenshot comparing light color-scheme to dark color-scheme

I just ran into this as well when foxfooding this feature, and I was about to file, but ran across this already-filed bug.

Here's a screenshot from my system, comparing the light theme to the dark theme.

As shown here, it's not just the link (though that's the most-obvious) -- the yellow-triangle icon is also a bit "fainter-looking" and harder to see in the dark theme.

Comment 5

[Anna Yeddi [:ayeddi]]

Attachment: Bug 1849697 - Increasing color contrast for the Re-analyze reviews link for dark theme. r=mstriemer,hjones

While the message content is likely to be changed and the link removed/replaced, we could still provide better experience for users in the meantime.

Comment 6

[BugBot [:suhaib / :marco/ :calixte]]

The severity field for this bug is set to S4. However, the accessibility severity is higher, .
:ayeddi, could you consider increasing the severity?

For more information, please visit BugBot documentation.

Comment 7

[BugBot [:suhaib / :marco/ :calixte]]

The severity field for this bug is set to S4. However, the following bug duplicate has higher severity:

• Bug 1847970: S2

:ayeddi, could you consider increasing the severity of this bug to S2?

For more information, please visit BugBot documentation.

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/76fd176d83a3
Increasing color contrast for the Re-analyze reviews link for dark theme. r=desktop-theme-reviewers,shopping-reviewers,dao,reusable-components-reviewers,hjones,mstriemer,Gijs

Comment 9

[Sandor Molnar[:smolnar]]

https://hg.mozilla.org/mozilla-central/rev/76fd176d83a3

Comment 10

[Alexandru Trif, Desktop Test Engineering [:atrif]]

Attachment: image.png

Hello! The Launch analyzer on Fakespot.com link is now readable with Firefox 119.0a1 (2023-09-10) by using the Dark theme on Windows 10x64, macOS 12, and Ubuntu 20.04.

However, as stated in comment 3 the icon is not so visible. Should we file something against this as well? Thank you in advance!

Comment 11

[Anna Yeddi [:ayeddi]]

(In reply to Alexandru Trif, Desktop QA [:atrif] from comment #10)

Created attachment 9352458 [details]
image.png

Hello! The Launch analyzer on Fakespot.com link is now readable with Firefox 119.0a1 (2023-09-10) by using the Dark theme on Windows 10x64, macOS 12, and Ubuntu 20.04.

However, as stated in comment 3 the icon is not so visible. Should we file something against this as well? Thank you in advance!

:atrif, thank you for verifying the link color fix. Yes, please do file the bug for the icon color contrast. It would be accessibility severity s3, since the meaning of the image is implied in the text and color and the image is hidden from screen readers, thus it won't be a ship blocker. Thanks a lot!

Comment 12

[Alexandru Trif, Desktop Test Engineering [:atrif]]

(In reply to Anna Yeddi [:ayeddi] from comment #11)

(In reply to Alexandru Trif, Desktop QA [:atrif] from comment #10)

Created attachment 9352458 [details]
image.png

Hello! The Launch analyzer on Fakespot.com link is now readable with Firefox 119.0a1 (2023-09-10) by using the Dark theme on Windows 10x64, macOS 12, and Ubuntu 20.04.

However, as stated in comment 3 the icon is not so visible. Should we file something against this as well? Thank you in advance!

:atrif, thank you for verifying the link color fix. Yes, please do file the bug for the icon color contrast. It would be accessibility severity s3, since the meaning of the image is implied in the text and color and the image is hidden from screen readers, thus it won't be a ship blocker. Thanks a lot!

I filled in bug 1852697. Closing this. Thank you!

Comment 13

[Daniel Holbert [:dholbert]]

I added a few additional details on the followup as well.

Thanks, everyone!