Can't see the onboarding overlay close button with Windows dark high contrast modes

VERIFIED FIXED in Firefox 57

Status

()

defect
P1
normal
VERIFIED FIXED
2 years ago
2 years ago

People

(Reporter: verdi, Assigned: Fischer)

Tracking

57 Branch
Firefox 57
Points:
---

Firefox Tracking Flags

(firefox57 verified)

Details

(Whiteboard: [photon-onboarding])

Attachments

(9 attachments, 2 obsolete attachments)

Reporter

Description

2 years ago
Posted image closebutton.png
If you use a dark high contrast mode in Windows (#1, #2, or Black), the close button in the onboarding overlay is black on black and can't be seen.
Yura, do we need to support the dark high contrast mode?
Flags: needinfo?(yzenevich)
(In reply to Fred Lin [:gasolin] from comment #1)
> Yura, do we need to support the dark high contrast mode?

This is more of a question to product, but as an a11y person I'm inclined to say yes. Is the issue similar to background images not working in this mode? Would using an img inside a button fix this (This was the approach with the overlay button afaik)?
Flags: needinfo?(yzenevich)
Flags: qe-verify+
Priority: -- → P1
QA Contact: jwilliams
Whiteboard: [photon-onboarding][triage] → [photon-onboarding]
Assignee: nobody → gasolin
Status: NEW → ASSIGNED
Assignee

Comment 4

2 years ago
Take the bug. We could set `fill: currentColor` to have the close svg icon adopt its color to the element's color, which would be adjusted to white in the black high-contrast mode
Assignee: gasolin → fliu
Assignee

Comment 6

2 years ago
Assignee

Comment 8

2 years ago
Comment hidden (mozreview-request)
Assignee

Comment 12

2 years ago
(In reply to Fischer [:Fischer] from comment #11)
> Comment on attachment 8906979 [details]
> Bug 1398987 - Can't see the onboarding overlay close button with Windows
> dark high contrast modes,
> 
> Review request updated; see interdiff:
> https://reviewboard.mozilla.org/r/178738/diff/1-2/
Hi Rex,
Per our test on the window system, solve the issue with `fill: currentColor`. Please see the attached screenshots for the `fill: currentColor` results under different kind of settings, thanks.
Comment on attachment 8906979 [details]
Bug 1398987 - Can't see the onboarding overlay close button with Windows dark high contrast modes,

https://reviewboard.mozilla.org/r/178738/#review183736
Attachment #8906979 - Flags: review?(rexboy) → review+
Assignee

Updated

2 years ago
Keywords: checkin-needed

Comment 14

2 years ago
Pushed by ryanvm@gmail.com:
https://hg.mozilla.org/integration/autoland/rev/649a61cd9381
Can't see the onboarding overlay close button with Windows dark high contrast modes, r=rexboy
Keywords: checkin-needed
https://hg.mozilla.org/mozilla-central/rev/649a61cd9381
Status: ASSIGNED → RESOLVED
Closed: 2 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 57
Comment hidden (obsolete)
Assignee

Comment 17

2 years ago
(In reply to Justin [:JW_SoftvisionQA] from comment #16)
> Created attachment 8908696 [details]
> HighContrastModeBlackWin10.JPG
> 
> I am still not seeing the x in High Contrast Mode Black on Win 10 x64
Hi Justin,
Would you provide your step to turn on the High Contrast Mode Black on Win 10? I would like to see if there was another settings out there we didn't cover.

p.s It seems the attachment 8908696 [details]: HighContrastModeBlackWin10.JPG was not about High Contrast Mode Black.

Thanks
Flags: needinfo?(jwilliams)
Posted image HighContrastModeBlack.JPG (obsolete) —
I was wrong. The x is there it is just very light. I will mark this as verified.
Flags: needinfo?(jwilliams)
Attachment #8908696 - Attachment is obsolete: true
Attachment #8909865 - Attachment is obsolete: true
Status: RESOLVED → VERIFIED
Assignee

Comment 20

2 years ago
(In reply to Justin [:JW_SoftvisionQA] from comment #19)
> Created attachment 8909868 [details]: HighContrastModeBlack.JPG
Hi Justin,
How did you made this type of contrast mode?
The white "x" button looks no good. I would like to investigate it, thanks.
Flags: needinfo?(jwilliams)
Hey Fischer, I just went to the system settings on win 10 and changed to the high contrast Mode Black.
Flags: needinfo?(jwilliams)
Assignee

Comment 22

2 years ago
(In reply to Justin [:JW_SoftvisionQA] from comment #21)
> Hey Fischer, I just went to the system settings on win 10 and changed to the high contrast Mode Black.
After testing, found that if opened one about:newtab(or about:home) before switching to the high contrast Mode Black, that about:newtab wouldn't totally switch to the high contrast Mode Black (almost all visual elements are still painted with normal color) except for the onboarding overlay "x" button became white for the high contrast Mode Black.
If at this moment, opened another about:newtab, that newly opened about:newtab would be painted with the high contrast Mode Black or we could close and reopen Firefox to have everything painted correctly with the high contrast Mode Black. Vice versa when reverting back to the normal color mode. Seems this is more related to the system painting timing not related to the Onboarding here.
I reproduced this issue using Fx 57.0a1(build ID: 20170911100210), on Windows 10 x64. I can confirm this issue is fixed, I verified using Fx 57.0b7, on Windows 10 x64.
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.