Closed Bug 1755813 Opened 3 years ago Closed 3 years ago

[MacOS] Focus outline in HCM uses partially transparent accent color

Categories

(Toolkit :: Themes, defect)

Product:
Toolkit
Component:
Themes
Type:
defect

Tracking

()

Status:
VERIFIED FIXED
Milestone:
99 Branch
Tracking Flags:
Tracking Status
firefox-esr91 --- unaffected
firefox97 --- unaffected
firefox98 --- unaffected
firefox99 --- verified

People

(Reporter: ayeddi, Assigned: dao)

References

(Blocks 1 open bug, Regression)

Details

(Keywords: regression)

Attachments

(7 files)

Actual behavior of the focus indication for awesomebar and checkbox on the Edit bookmark panel in MacOS HCM with red accent color
(deleted), image/png
Details
Expected behavior of the focus indication for checkbox on the Edit bookmark panel in MacOS HCM with red accent color
(deleted), image/png
Details
Expected behavior (on Light theme)
(deleted), image/png
Details
Actual behavior (Light theme)
(deleted), image/png
Details
Bug 1755813 - Use -moz-accent-color instead of -moz-mac-focusring on macOS. r=ayeddi
(deleted), text/x-phabricator-request
Details
Video of the focus outline presentation - MacOS with HCM on Dark theme
(deleted), video/quicktime
Details
Video of the focus outline presentation - MacOS with HCM on Light theme
(deleted), video/quicktime
Details

STR

  1. Enable HCM by checking System Preferences > Accessibility > Display > Increase Contrast
  2. Confirm accent color selection in System Preferences > General > Accent Color (i.e. red)
  3. In Firefox, Tab through the active UI controls and observe focus indication, i.e.:
    • Open the "Edit bookmark" panel from the address bar
    • Tab to the "Show editor when saving" checkbox, "Cancel"/"Remove bookmark" and "Save" buttons

Expected
Focus indicator should be clearly visible for all active UI

Actual
Focus indicator is difficult to see since its color is partially transparent focus rink. It is also expected to retain 2px width across the UI, incl. on the awesomebar.

Attached image Expected behavior (on Light theme) (deleted) —
Attached image Actual behavior (Light theme) (deleted) —

Set release status flags based on info from the regressing bug 1755023

status-firefox97: --- → unaffected
status-firefox98: --- → unaffected
status-firefox99: --- → affected
status-firefox-esr91: --- → unaffected
Has Regression Range: --- → yes
Blocks: 1736933
Blocks: 1729031
Assignee: nobody → dao+bmo
Status: NEW → ASSIGNED

If this is the only use for -moz-mac-focusring, can you file a follow-up bug to remove it and ni? me?

Blocks: 1756002
No longer blocks: 1729031

Thank you, Dão Gottwald [::dao] !
The focus outline works as expected on MacOS 12.2 with Increased Contrast/HCM on while on both Dark and Light themes.
Red accent color selected in the OS is respected.

Pushed by dgottwald@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/6b206ec59cfd Use -moz-accent-color instead of -moz-mac-focusring on macOS. r=ayeddi

https://hg.mozilla.org/mozilla-central/rev/6b206ec59cfd

Status: ASSIGNED → RESOLVED
Closed: 3 years ago
status-firefox99: affected → fixed
Resolution: --- → FIXED
Target Milestone: --- → 99 Branch
QA Whiteboard: [qa-99b-p2]

I managed to reproduce this issue on macOS 11 using a Nightly build from 2022-02-16. I can confirm this issue is fixed on Firefox 99.0b8(20220324185704)and Nightly 100.0a1(20220329204247) on macOS 11.

Status: RESOLVED → VERIFIED
QA Whiteboard: [qa-99b-p2]
status-firefox99: fixed → verified
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: