1792063 - Firefox uses white font on gray ground in the menu for the highlighted item

Status: VERIFIED FIXED

(Toolkit :: General, defect)

Description

[alex]

Since Firefox 105, <select > menus on websites have a grey background with black foreground text, but the highlighted item has a grey background with white foreground text (when using a dark theme), which is very hard to read.

This may be related to Bug 1784328.

As soon as I give a <select> a background-color property, the dropdown menu uses the style of the context menus and main menus and has a dark background with white text and highlighted items have a blue background. The bug seems to only affect unstyled widgets.

In general it seems that Firefox stopped using the old theme colors and changed something with the menus between version 104 and 105.

Comment 1

[:Gijs (out for now; he/him)]

This really needs a bit more context in order to be fixable.

What browser theme are you using? And what is your content appearance setting in the Firefox settings? And can you link to a website where you reproduce this problem (and/or does it reproduce on just data:text/html,<select><option>A</option><option>B</option>) ?

The bug report indicates you're on Linux - which window manager and what window manager theme are you using?

Comment 2

[alex]

• WM: Kwin
• Gtk-Theme: Clearlooks-Phenix (light color scheme)
• Firefox Theme: Default Black theme
• URL to reproduce:
  data:text/html,<select><option>A</option><option>B</option>
• URL where it does not happen (Dark menu item background, NO blue):
  data:text/html,<select style="background: blue"><option>A</option><option>B</option>

Comment 3

[alex]

Dark menu item background, NO blue
The widget itself is blue (with black foreground text and a frame that does not match the color, also a square shape instead of the rounded default), but the popup menu is dark themed.

Comment 4

[:Gijs (out for now; he/him)]

The selectparent actor code suggests this bug should live in Toolkit::General, though that feels somewhat unsatisfying.

Emilio, any idea what's up here?

Reporter: if you're sure about this being a regression and have time, it could help us if you ran https://mozilla.github.io/mozregression/ to work out which specific change broke this. (104 - 105 still includes 1000s of changes so isn't enough in and of itself, though it's a good clue...)

I'm also still curious about this:

And what is your content appearance setting in the Firefox settings?

That is, if you search the settings for "Website appearance", does changing the website colour scheme there make any difference?

Comment 5

[alex]

Sorry, I overread the part with the content preference. It is set to "light"
I can try mozregression later.

Comment 6

[alex]

And setting it to dark doesn't change anything.

I wonder if the data url shouldn't have a dark background on dark website preference. about:blank has one.

Comment 7

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1792063 - Fix menuhover background computation in some gtk themes. r=stransky

When figuring out menuhover background, make sure not to come up with
the exact same color as the menu background. This ensures we also try
gradients / background-images before giving up.

This is only an issue with the dark theme in this case, because
otherwise we use native drawing.

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/0d1e3f187317
Fix menuhover background computation in some gtk themes. r=stransky

Comment 9

[alex]

7:02.60 INFO: Narrowed integration regression window from [ef655438, 41bff817] (3 builds) to [ef655438, 93b9d555] (2 builds) (~1 steps left)
7:02.60 INFO: No more integration revisions, bisection finished.
7:02.60 INFO: Last good revision: ef6554388dda8b2a6b7b2627cc59dabdf8aeb0d9
7:02.60 INFO: First bad revision: 93b9d5559192c11f08f01904d677645fe3c7e3d5
7:02.60 INFO: Pushlog:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=ef6554388dda8b2a6b7b2627cc59dabdf8aeb0d9&tochange=93b9d5559192c11f08f01904d677645fe3c7e3d5

Comment 10

[:Gijs (out for now; he/him)]

(In reply to alex from comment #9)

7:02.60 INFO: Narrowed integration regression window from [ef655438, 41bff817] (3 builds) to [ef655438, 93b9d555] (2 builds) (~1 steps left)
7:02.60 INFO: No more integration revisions, bisection finished.
7:02.60 INFO: Last good revision: ef6554388dda8b2a6b7b2627cc59dabdf8aeb0d9
7:02.60 INFO: First bad revision: 93b9d5559192c11f08f01904d677645fe3c7e3d5
7:02.60 INFO: Pushlog:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=ef6554388dda8b2a6b7b2627cc59dabdf8aeb0d9&tochange=93b9d5559192c11f08f01904d677645fe3c7e3d5

Thanks! I've updated the regressor - looks like Emilio has written and landed a patch already. TBC exactly which version that first goes out in. :-)

Comment 11

[Cristian Tuns]

https://hg.mozilla.org/mozilla-central/rev/0d1e3f187317

Comment 12

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

The patch landed in nightly and beta is affected.
:emilio, is this bug important enough to require an uplift?

• If yes, please nominate the patch for beta approval.
• If no, please set status-firefox106 to wontfix.

For more information, please visit auto_nag documentation.

Comment 13

[alex]

The main menu bar is affected as well:

Dark theme:
On mouseover the main menu items have blue background and white text (The color should probably not be changed at all, see Bug 1792216), on click it has blue background and light blue text, which is hard to read.

Light theme:
When the menu is open, the entry in the menubar has a light gray background and white text, which is almost impossible to read.
(On mouseover it has light grey background with black text which is readable, even when there probably should be no highlight, see Bug 1792216)

Comment 14

[Emilio Cobos Álvarez (:emilio)]

Can you share a screenshot of the issue? I can't repro on the latest nightly, I think my patch also fixes what you're seeing.

The "mouseover activates menubar item" is an issue only with the non-native themes ("light" / "dark"). The system theme seems to work as you expect).

Comment 15

[Emilio Cobos Álvarez (:emilio)]

Comment on attachment 9295858 [details]
Bug 1792063 - Fix menuhover background computation in some gtk themes. r=stransky

Beta/Release Uplift Approval Request

• User impact if declined: Some themes might have poor contrast in menubar / select menuitems.
• Is this code covered by automated tests?: No
• Has the fix been verified in Nightly?: Yes
• Needs manual test from QE?: Yes
• If yes, steps to reproduce: Install https://github.com/jpfleury/clearlooks-phenix, set dark theme, open a select menu from data:text/html,<select><option>A</option><option>B</option></select>
• List of other uplifts needed: none
• Risk to taking this patch: Low
• Why is the change risky/not risky? (and alternatives if risky): Relatively simple / low-risk patch. Linux only.
• String changes made/needed: none
• Is Android affected?: No

Comment 16

[alex]

Attachment: An image of the main menu with a menu open

Comment 17

[Bogdan Maris, Desktop Test Engineering]

Used an old Nightly from 2022-08-14 in order to reproduce this issue: I installed the clearlooks-phenix theme, enabled it and turned on the Dark theme inside Firefox. Hovering over the items from the dropdown data:text/html,<select><option>A</option><option>B</option></select> are white in color with a white hover so basically they are invisible.

Using latest Nightly 107.0a1 from today on Ubuntu 18.04, this is no longer an issue, the text inside the dropdown keeps its dark color and the hover effect is light blue, making the dropdown elements clearly visible while hovering over them.

Comment 18

[Pascal Chevrel:pascalc]

Comment on attachment 9295858 [details]
Bug 1792063 - Fix menuhover background computation in some gtk themes. r=stransky

Low risk, verified on Nightly, approved for 106 beta 6, thanks!

Comment 19

[Pascal Chevrel:pascalc]

https://hg.mozilla.org/releases/mozilla-beta/rev/5651fb6cce1b

Comment 20

[Bogdan Maris, Desktop Test Engineering]

Also verified as fixed using latest beta build (106.0b6) from treeheder https://treeherder.mozilla.org/jobs?repo=mozilla-beta&revision=29cbf057f9e8c8c7c604dac42ad4fece96164101 on Ubuntu 18.04.

Comment 21

[Bogdan Maris, Desktop Test Engineering]

@pascal, I guess this will not reach 105 since we are so close to 106 RC, right? I'm asking because I see that the 105 tracking flag is still set as affected.

Comment 22

[Pascal Chevrel:pascalc]

Ryan, is that something you would consider for uplift in 105.0.2?

Comment 23

[Ryan VanderMeulen [:RyanVM]]

Seems like a great candidate. Emilio, go ahead and nominate :-)

Comment 24

[Emilio Cobos Álvarez (:emilio)]

Comment on attachment 9295858 [details]
Bug 1792063 - Fix menuhover background computation in some gtk themes. r=stransky

Beta/Release Uplift Approval Request

• User impact if declined: see above
• Is this code covered by automated tests?: No
• Has the fix been verified in Nightly?: Yes
• Needs manual test from QE?: Yes
• If yes, steps to reproduce: see above
• List of other uplifts needed: none
• Risk to taking this patch: Low
• Why is the change risky/not risky? (and alternatives if risky): Simple linux-specific tweak.
• String changes made/needed: none
• Is Android affected?: No

Comment 25

[Ryan VanderMeulen [:RyanVM]]

Comment on attachment 9295858 [details]
Bug 1792063 - Fix menuhover background computation in some gtk themes. r=stransky

Approved for 105.0.2.

Comment 26

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/releases/mozilla-release/rev/098d232cad23

Comment 27

[Ryan VanderMeulen [:RyanVM]]

Added to the 105.0.2 release notes:

Fixed poor contrast on various menu items with certain themes on Linux systems

Comment 28

[Bogdan Maris, Desktop Test Engineering]

(In reply to Bogdan Maris [:bogdan_maris], Release Desktop QA from comment #20)

Also verified as fixed using latest beta build (106.0b6) from treeheder https://treeherder.mozilla.org/jobs?repo=mozilla-beta&revision=29cbf057f9e8c8c7c604dac42ad4fece96164101 on Ubuntu 18.04.

Also verified as fixed on Firefox 105.0.2 on the same Ubuntu 18.04.