1268618 - [GTK3] Webpage backgrounds appear grey instead of white with GTK3 3.20+

Status: UNCONFIRMED

(Core :: Layout, defect)

Description

[Atri Bhattacharya]

Attachment: Grey bkg on ffx built against openSUSE's gtk3 v3.20.3 (left) vs ffx from mozilla.com (right)

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:46.0) Gecko/20100101 Firefox/46.0
Build ID: 2016042500

Steps to reproduce:

Tested with ffx compiled against gtk3 v3.20.3 on openSUSE. This issue is not seen with default ffx binaries from mozilla.com (which is built with gtk3 < 3.20 I believe), nor with default openSUSE ffx 46.0 built against gtk2.

1. Go to http://www.slate.com/ or http://www.msnbc.com/ for example.


Actual results:

You will see grey bars on the sides and/or at the top (you may have to zoom out for them to show up). 


Expected results:

These bkg regions ought to be white, and they are when ffx is built against gtk2 or gtk3 < 3.20.

Comment 1

[Karl Tomlinson (:karlt back Feb 10)]

The computed value of background-color is transparent.
I don't see any CSS rules, so I guess this is the default and the color is a background color from the theme, which may have changed with a different version of GTK.

I see grey background with GTK+ 3.16 and Adwaita.

I guess layout code chooses to get a background color from nsLookAndFeel, but I'm not clear there is a bug here.

Comment 2

[Atri Bhattacharya]

(In reply to Karl Tomlinson (ni?:karlt) from comment #1)
> The computed value of background-color is transparent.
> I don't see any CSS rules, so I guess this is the default and the color is a
> background color from the theme, which may have changed with a different
> version of GTK.
> 
> I see grey background with GTK+ 3.16 and Adwaita.

Yes, I see your point regarding how the background colouring works, but nonetheless, I should mention that using the default mozilla.com binaries I still cannot reproduce the grey background; it still appears white. Only when I compile firefox against gtk3 >= 3.20 does it appear grey.

> 
> I guess layout code chooses to get a background color from nsLookAndFeel,
> but I'm not clear there is a bug here.

Well, I suppose firefox intends to achieve consistency between how web pages look when built with gtk2 and gtk3. Fwiw, I have noted above that epiphany also shows the background as white although it is built with gtk3 (3.20+ for good measure). So there is probably a bug here.

Comment 3

[Atri Bhattacharya]

Attachment: NYMag.com in all its ugliness. The bkg should be all white instead.

Comment 4

[Leho Kraav (:macmaN @lkraav)]

The problem here is that the user is being put through some tech nonsense blah pain. I would vote for defaulting to white instead of transparent.

Comment 5

[Atri Bhattacharya]

Sorry, I stick around with firefox for all the good reasons, but it gets beat at basic stuff like rendering a web-page by *every* other browser (including epiphany, google chrome, opera), and that is just painful to see. I would post side-by-side screenshots of how singularly terrible firefox makes the web-pages (and there are numerous sites where this is the issue) look because of this one problem, but apparently the devs have long stopped caring.

Comment 6

[Andrew Church]

Still present in SeaMonkey 2.49.5. Workaround is to add a rule to userContent.css:

/* Work around mozilla snobbery https://bugzilla.mozilla.org/show_bug.cgi?id=1268618 */
html>body {background-color: white;}

Comment 7

[Andrew Church]

Attachment: Simplistic patch

Here's a better (albeit still simplistic) fix which should also work on pages that explicitly set a transparent background color. Tested with SeaMonkey 2.49.5.

Comment 8

[WGH]

Still present in SeaMonkey 2.49.5. Workaround is to add a rule to userContent.css:

/* Work around mozilla snobbery https://bugzilla.mozilla.org/show_bug.cgi?id=1268618 */
html>body {background-color: white;}

This workaround breaks websites that style html itself. Better workaround would be to style html directly instead (haven't found any breakage at least).

Comment 9

[WGH]

Attachment: Test case for workaround 1 (html>body)

Comment 10

[WGH]

Attachment: Test case for workaround 2 (html)

Comment 11

[WGH]

Sigh, "styling html workaround" breaks some other sites after all. For examples, sites that use background-size: cover on body. I've attached two HTML testcases that show that neither workaround works properly.

Comment 12

[WGH]

(In reply to Andrew Church from comment #7)

Created attachment 9101486 [details] [diff] [review]
Simplistic patch

Here's a better (albeit still simplistic) fix which should also work on pages that explicitly set a transparent background color. Tested with SeaMonkey 2.49.5.

I can confirm that this patch helps on Firefox 68.7.0. Any reason why it's wrong and can't be applied?

Comment 13

[Andrew Church]

(In reply to WGH from comment #12)

I can confirm that this patch helps on Firefox 68.7.0. Any reason why it's wrong and can't be applied?

The Mozilla developers would have to answer as to whether the patch is "correct". For example, I don't know if eColorID_WindowBackground is the correct color ID to check for, or if using that ID also affects other contexts where it shouldn't be applied. I don't know my way around the Mozilla codebase and only did enough to fix my immediate problem.

That said, if it works for you, I can't think of any reason it wouldn't be safe to just apply locally.

Comment 14

[Ramón Cahenzli]

I found a fix for this:

Preferences -> Fonts and Colors -> Colors... -> uncheck "Use system colors"

The problem would otherwise even appear today on Firefox 82.0.3, openSUSE Tumbleweed, gtk3 3.24.23, Adwaita theme. I also heard reports that even the Flatpak version is affected.