Closed Bug 1802314 Opened 2 years ago Closed 1 year ago

The description of the DevTools settings items have white text on light-gray background in dark-theme mode

Categories

(DevTools :: General, defect)

Unspecified
macOS
defect

Tracking

(firefox-esr102 unaffected, firefox107 wontfix, firefox108 wontfix, firefox109 verified)

VERIFIED FIXED
109 Branch
Tracking Status
firefox-esr102 --- unaffected
firefox107 --- wontfix
firefox108 --- wontfix
firefox109 --- verified

People

(Reporter: pmagyari, Assigned: emilio)

References

(Regression)

Details

(Keywords: regression)

Attachments

(3 files)

Found in

  • Firefox DevEdition 108.0b5

Affected versions

  • Firefox 107.0
  • Firefox Beta 108.0b5
  • Firefox Nightly 109.0a1

Affected platforms:

  • MacOS 11
  • MacOS 12
  • MacOS M1

Unaffected platforms

  • Ubuntu 20.04
  • Windows 7/10

Steps to reproduce

  1. Open Firefox.
  2. Go to about:addons -> themes -> enable Dark theme.
  3. Press (Fn) F12 to open DevTools panel.
  4. Click on Console in the DevTools panel (or any of the ones that have a settings cogwheel).
  5. Click on the settings cogwheel in the upper right corner of the panel.
  6. Hover over any of the items from the list to get a description of them.

Expected result

  • The description is visible and in dark-theme mode accordingly.

Actual result

  • The description has white text on a light gray background and it is hard to read.

Regression range

:emilio, since you are the author of the regressor, bug 1796849, could you take a look?

For more information, please visit auto_nag documentation.

Flags: needinfo?(emilio)

Bug 1796849 implemented proper non-native tooltips so that we can draw
them in mismatched themes in GTK. That uses the InfoBackground /
InfoText color pair, which is the right color pair.

However on macOS InfoBackground didn't have dark-mode support (while
InfoText did), causing contrast issues.

Assignee: nobody → emilio
Status: NEW → ASSIGNED
Flags: needinfo?(emilio)

We implemented a basic ThemeGeometry-based tooltip in
https://hg.mozilla.org/integration/autoland/rev/e8d65866112f, but now
that we have non-native theme support for these it seems ok to just use
it.

Pushed by ealvarez@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/1c749710bb41
Return a contrasting color for Infobackground in dark mode. r=spohl
https://hg.mozilla.org/integration/autoland/rev/b848ef87dae2
Use non-native tooltips in the cocoa non-native theme too. r=spohl
Status: ASSIGNED → RESOLVED
Closed: 1 year ago
Resolution: --- → FIXED
Target Milestone: --- → 109 Branch

I have verified the fix on Nightly 109.0a1 (20221208094253) on MacOS 11 and MacOS 12.

Status: RESOLVED → VERIFIED
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: