1338850 - [e10s] Background on select options is transparent

Status: VERIFIED FIXED

(Core :: Layout: Form Controls, defect)

Description

[Fanolian]

Attachment: [e10s] 2017-02-09 transparent background

User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Build ID: 20170211030205

Steps to reproduce:

(Hope I use the terminologies right)

1. Go to https://www.zagg.com/eu/en_eu/keyboards/ipad-air-2-keyboard/zagg-folio-ipad-air-2
2. Select the drop-down list under the price
3. Observe the background on select options


Actual results:

(Please refer to screenshot)
Background is transparent. The text overlaps those underneath the drop-down list.

Comment 1

[Fanolian]

From Mozregression:
Last good Nightly: 2017-02-08
First bad Nightly: 2017-02-09
https://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=3a95aa4246653a7863914ffec032897d13359fb0&tochange=b772e0f4138540113e91a46c99bb0d14ecc8acca

Further bisection:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=9da1857374780d5fc4c8babf11bf2d1ac8443bd4&tochange=4dafc922f1cbfef52fbd736f6b6cb5c15d9bd3f1

It should be regressed by bug 1336301.

Comment 2

[Fanolian]

Attachment: [e10s] 2017-02-08 GOOD

What it looks like in 2017-02-08 build.

Comment 3

[Fanolian]

Attachment: [non-e10s] 2017-02-08 and 09

It looks completely different in non-e10s mode.

Comment 5

[Daniel Holbert [:dholbert]]

This also affects pages like https://www.rei.com/rei-garage/product/897242/black-diamond-voyager-lantern
(The dropdown menus for "Qty" and "Size/Color" are both transparent)

Comment 6

[Jared Wein [:jaws] (please needinfo? me)]

Try push, https://treeherder.mozilla.org/#/jobs?repo=try&revision=de75178c11ba6758b862831ccbc6eb26420cb008

Comment 7

[Jared Wein [:jaws] (please needinfo? me)]

Attachment: Bug 1338850 - Only set the background color and foreground color on the select element if it is not transparent or equal to each other.

Review commit: https://reviewboard.mozilla.org/r/112770/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/112770/

Comment 8

[Mike Conley (:mconley) (:⚙️)]

Comment on attachment 8837725 [details]
Bug 1338850 - Only set the background color and foreground color on the select element if it is not transparent or equal to each other.

https://reviewboard.mozilla.org/r/112770/#review114312

Thanks!

::: toolkit/modules/SelectParentHelper.jsm:46
(Diff revision 1)
>      stylesheet.hidden = true;
>      stylesheet = menulist.appendChild(stylesheet);
>  
>      let sheet = stylesheet.sheet;
> -    if (selectBackgroundColor != uaSelectBackgroundColor ||
> -        selectColor != uaSelectColor) {
> +    let ruleBody = "";
> +

Can you add some commentary here about the cases we're attempting to deal with here? Just for future code spelunkers who might have to deal with similar things down the road.

Comment 9

[Jared Wein [:jaws] (please needinfo? me)]

Comment on attachment 8837725 [details]
Bug 1338850 - Only set the background color and foreground color on the select element if it is not transparent or equal to each other.

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/112770/diff/1-2/

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/233d2f9b0cce
Only set the background color and foreground color on the select element if it is not transparent or equal to each other. r=mconley

Comment 11

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

https://hg.mozilla.org/mozilla-central/rev/233d2f9b0cce

Comment 12

[Timea Zsoldos [:zstimi/tzsoldos], Desktop QA]

I have reproduced this issue using Firefox 54.0a1 (2017.02.09) on Win 8.1 x64.
I can confirm this issue is fixed, I verified using Firefox 54.0b2 on Win 8.1 x64, Win 10 x64 Mac OS X 10.11 and Ubuntu 14.04 x64.
Note: There is another issue with the list box border:
		Win 10 : http://imgur.com/a/tihhS
		Linux: http://imgur.com/a/TDmQO
On Mac there is a problem in listbox view:
		Mac :    http://imgur.com/a/bbToX