416559 - Hard-coded auto-completion pop-ups foreground color

Status: VERIFIED FIXED

(Toolkit :: Autocomplete, defect)

Description

[Andrés Delfino]

User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9b4pre) Gecko/2008020908 Minefield/3.0b4pre
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9b4pre) Gecko/2008020908 Minefield/3.0b4pre

Hard coded black color makes it difficult for persons using dark themes to see the suggestions.

See attachment.

Reproducible: Always

Comment 1

[Andrés Delfino]

Attachment: Screen shot.

Screen shot.

Comment 2

[:Gavin Sharp [email: [e-mail]]]

Does this only apply to the search box autocomplete results, or are all autocomplete popups affected? Do you know where the color is hardcoded?

Comment 3

[Andrés Delfino]

(In reply to comment #2)
> Does this only apply to the search box autocomplete results, or are all
> autocomplete popups affected? Do you know where the color is hardcoded?
> 

All auto-complete pop-ups are affected (location bar, File ▸ Open Location... window, form auto-complete, search suggestions).

Comment 4

[:Gavin Sharp [email: [e-mail]]]

Can you use the DOM Inspector to find where the foreground color is hardcoded?

Comment 5

[:Gavin Sharp [email: [e-mail]]]

I guess that might be hard to do because the autocomplete popup goes away when you switch windows. I don't see anything obvious in http://lxr.mozilla.org/seamonkey/source/toolkit/themes/gnomestripe/global/autocomplete.css .

Comment 6

[Andrés Delfino]

Attachment: Screen shot of native auto-complete pop-up, with same theme.

Comment 7

[Andrés Delfino]

No, I don't know where the color is hardcoded.

I can use DOM Inspector to get to the auto-complete list, but I'm not sure I know how to use the information it provides.

You can get to it following this steps:

1. In DOM Inspector, Search ▸ Select Element by Click
2. Go to browser window with a key binding
3. Focus search bar with <Ctrl> + K
4. Type something
5. Click any suggestion

Comment 8

[Andrés Delfino]

(In reply to comment #7)
> 1. In DOM Inspector, Search ▸ Select Element by Click
> 2. Go to browser window with a key binding
> 3. Focus search bar with <Ctrl> + K
> 4. Type something
> 5. Click any suggestion

This steps should be done after selecting a browser window chrome document to inspect.

Comment 9

[Mike Beltzner [:beltzner, not reading bugmail]]

Ventnor to confirm.

Comment 10

[Mike Beltzner [:beltzner, not reading bugmail]]

Ventnor to confirm.

Comment 11

[Michael Ventnor]

High-contrast inverse (the most common dark theme) doesn't show this problem. So I'd like to know what system colour we use for dropdowns, and also how to get the system colour shown in the native dropdowns.

Comment 12

[Michael Monreal [:micmon]]

General note: many dark gtk themes are broken by design, either because the gtkrc does not cover all common use cases or because the engine does not support it properly. Many custom widgets have problems with dark themes, too. There was even discussion to make a dark theme the default on the next unstable gnome to better see where problems occur.

Long story short: if some dark themes show problems, you will have to look very closely if firefox is really the problem.

Comment 13

[Ian Spence]

Throwing out a possible cause

We essentially have "menupopup > tree"
According to a quick glance at the style rules shown in the dom inspector, the elements have the color -moz-fieldtext while being painted over a rectangle with the CSS "-moz-appearance: menupopup;"

In the style he is using, the text entries use black text since the background is a light gray.  However, menupopup has a much darker background, leading to this problem. So a fix is likely to add the following

.autocomplete-tree,
.autocomplete-richlistbox {
  color: MenuText !important;
}

in toolkit/themes/gnomestripe/global/autocomplete.css

Comment 14

[Andrés Delfino]

(In reply to comment #12)
> Long story short: if some dark themes show problems, you will have to look very
> closely if firefox is really the problem.

But I have already shown that auto-complete looks OK in native GTK+, see attachment 416559 [details].

Comment 15

[Ian Spence]

Attachment: Fixes text color for autocomplete dropdowns

My guess in comment #13 was actually pretty close

This fixes the issue with normal autocompletes as well as the awesomebar

Comment 16

[Asaf Romano (gone)]

Comment on attachment 309087 [details] [diff] [review]
Fixes text color for autocomplete dropdowns

r=mano

Comment 17

[Damon Sicore (:damons)]

Comment on attachment 309087 [details] [diff] [review]
Fixes text color for autocomplete dropdowns

a1.9+=damons

Comment 18

[Reed Loden [:reed]]

Checking in toolkit/themes/gnomestripe/global/autocomplete.css;
/cvsroot/mozilla/toolkit/themes/gnomestripe/global/autocomplete.css,v  <--  autocomplete.css
new revision: 1.19; previous revision: 1.18
done