1706366 - The theme icons from the "Themes" slide of the new users Onboarding page are not visible in Windows "High Contrast" mode

Status: VERIFIED FIXED

(Firefox :: Messaging System, defect, P2)

Description

[Marius Coman [:mcoman], Ecosystem QA]

Attachment: ss of the issue.png

[Affected versions]:

• Firefox Beta 89.0b1 - Build ID: 20210419195043
• Firefox Nightly 90.0a1 - Build ID: 20210420095122

[Affected Platforms]:

• Windows 10 x64

[Prerequisites]:

• Have a new Firefox profile.
• Have the "High Contrast" system mode activated.

[Steps to reproduce]:

1. Open the browser with the profile from the prerequisites.
2. Click the "Not now" button from the first slide.
3. Click the "Not now" button from the second slide.
4. Observe the elements from the "Themes" Onboarding slide.

[Expected result]:

• All the elements are correctly displayed and respect the "High Contrast" mode.

[Actual result]:

• The theme icons are not visible.

[Additional Notes]:

• This issue is not reproducible with the "Themes" modal from the existing/updating users Onboarding.
• Attached a screenshot of the issue.

Comment 1

[Ed Lee :Mardak]

The old behavior uses a background image url while the proton behavior uses a background (image) gradient. Looks like only url() are preserved for high contrast.

Comment 2

[Ryan Casey]

Attachment: system-theme-swatch.svg

Comment 3

[Ryan Casey]

Attachment: light-swatch.svg

Comment 4

[Ryan Casey]

Attachment: dark-swatch.svg

Comment 5

[Ryan Casey]

Attachment: alpenglow-swatch.svg

Comment 6

[Ryan Casey]

Added svg versions of the theme swatches to replace gradient versions.

Comment 7

[Emily McMinn :emcminn]

Attachment: Bug 1706366 - Update builtin theme icons to reuse on about:welcome, customize and upgrade dialog r=emcminn a=pascalc

Comment 8

[Ed Lee :Mardak]

Attachment: welcome contrast.png

Comment 9

[Ed Lee :Mardak]

Attachment: upgrade contrast.png

Comment 10

[Ed Lee :Mardak]

Attachment: customize chevron down buttons.png

Comment 11

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/69811ad1a854
Update builtin theme icons to reuse on about:welcome, customize and upgrade dialog r=emcminn

Comment 12

[Dorel Luca [:dluca]]

Backed out changeset 69811ad1a854 (bug 1706366) for Browser-chrome failures in browser/components/customizableui/test/browser_1007336_lwthemes_in_customize_mode.js. CLOSED TREE

Log:
https://treeherder.mozilla.org/logviewer?job_id=338253393&repo=autoland&lineNumber=5170

Push with failures:
https://treeherder.mozilla.org/jobs?repo=autoland&group_state=expanded&revision=69811ad1a8541d5eed13dbe44cd50c94778facc4

Backout:
https://hg.mozilla.org/integration/autoland/rev/3505125fe5715617ff323358156f229f42253fc3

Comment 13

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/68a3d2c973a4
Update builtin theme icons to reuse on about:welcome, customize and upgrade dialog r=emcminn

Comment 14

[Atila Butkovits]

https://hg.mozilla.org/mozilla-central/rev/68a3d2c973a4

Comment 15

[Ed Lee :Mardak]

Comment on attachment 9219042 [details]
Bug 1706366 - Update builtin theme icons to reuse on about:welcome, customize and upgrade dialog r=emcminn a=pascalc

Beta/Release Uplift Approval Request

• User impact if declined: MR1/Proton about:welcome and upgrade dialog show empty circles in high contrast mode
• Is this code covered by automated tests?: Yes
• Has the fix been verified in Nightly?: No
• Needs manual test from QE?: Yes
• If yes, steps to reproduce: 1. turn on high contrast mode

2. open about:welcome
3. move to theme screen and see icons

• List of other uplifts needed: none
• Risk to taking this patch: Low
• Why is the change risky/not risky? (and alternatives if risky): Primarily updating css to use updated builtin theme icons
• String changes made/needed: nonee

Comment 16

[Pascal Chevrel:pascalc (PTO until April 26)]

Comment on attachment 9219042 [details]
Bug 1706366 - Update builtin theme icons to reuse on about:welcome, customize and upgrade dialog r=emcminn a=pascalc

Low risk proton uplift, approved for 89 beta 8, thanks.

Comment 17

[Pascal Chevrel:pascalc (PTO until April 26)]

https://hg.mozilla.org/releases/mozilla-beta/rev/9108df804a8b

Comment 18

[Cosmin Sabou [:CosminS]]

Backed out from beta for causing bc failures on browser_1007336_lwthemes_in_customize_mode.js

Push with failures: https://treeherder.mozilla.org/jobs?repo=mozilla-beta&group_state=expanded&resultStatus=testfailed%2Cbusted%2Cexception%2Cusercancel&revision=f0b1759e46ef165705f6180c1ec8de097ee133b9&test_paths=browser%2Fcomponents%2Fcustomizableui%2Ftest

Failure log: https://treeherder.mozilla.org/logviewer?job_id=338638651&repo=mozilla-beta

Backout link: https://hg.mozilla.org/releases/mozilla-beta/rev/c86a0651209309f2f6ea06c3d792b7fc5fddda45

Comment 19

[Marius Coman [:mcoman], Ecosystem QA]

I have verified that this issue is no longer reproducible with the latest Firefox Nightly (90.0a1 Build ID - 20210504092024) installed on Windows 10 x64. Now I can confirm that the theme icons from the "Themes" slide of the Onboarding page are visible in Windows "High Contrast" mode.

Comment 20

[Ed Lee :Mardak]

Test failure on mozilla-beta but not on mozilla-central was because bug 1702116 landed on m-c and wontfix for beta, so I updated the patch for mozilla-beta copying over 1 line fix.

Comment 21

[Pascal Chevrel:pascalc (PTO until April 26)]

https://hg.mozilla.org/releases/mozilla-beta/rev/375daa7c32d4

Comment 22

[Romain Testard [:RT]]

Confirming here that we (UX and PM) want this uplifted for MR1 to Beta.

Comment 23

[Marius Coman [:mcoman], Ecosystem QA]

I have verified that this issue is no longer reproducible with the latest Firefox Beta (89.0b9 Build ID - 20210506185706) installed on Windows 10 x64. Now I can confirm that the theme icons from the "Themes" slide of the Onboarding page are visible in Windows "High Contrast" mode.