1670439 - 78.3.0esr Horrible Font Issue

Status: UNCONFIRMED

(Core :: CSS Parsing and Computation, defect)

Description

[john-ivan]

Attachment: UglyBearlyReadableWebPage.png

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:78.0) Gecko/20100101 Firefox/78.0

Steps to reproduce:

SYSTEM: Debian Stable 64bit with Firefox from repository
SETTINGS: Firefox Color Settings.
I used custom font colors changing between override, high-contrast override, and never override.

Actual results:

Even with the color setting set to never override, font colors starting messing up badly. I first realized it was a major issue when a msgsafe.io email in my sent box was invisible unless I highlighted it(white text on white background). It messes up pretty much everything though, so I included an example from a not so random webpage.

Expected results:

The font colors should not change when set to never override! I can't believe nobody did seemingly basic testing on this ESR release; I use ESR releases to not deal with this stuff.

Comment 1

[Jonathan Kew [:jfkthame]]

This seems like it's more of a CSS computation issue than text layout. It's not clear to me exactly what settings are behaving badly for the reporter, though.... Emilio, can you reproduce anything like this?

Comment 2

[Emilio Cobos Álvarez [:emilio]]

Hmm, not off-hand, at least on Nightly. I'm assuming the page is this one.

It doesn't seem unreasonable that with a black background and a "Never override" setting, a given page could display poor contrast if they forget to specify the background of their website...

For example, with white text / black background and the "never override" option, something like: data:text/html,<p style="color: grey">abc</p> displays poor contrast (because we use the black for background, and then the page overrides the foreground color with grey). That's not really unexpected (and it's not clear to me how it'd be fixable), but that website has a body { background-color: #fff; } which prevents that here.

Reporter, can you share your precise settings, and also your gtk theme?

Comment 3

[john-ivan]

Hello everyone, thanks for the response. I have tried to add an attachment of a screenshot of my color settings but when I drag and drop or paste the file it shows up as a link('file:///home/user/Pictures/ColorSettings.png'). I guess I will just describe my color settings.

Text:~Orange
Background:Black
Unvisited Links:~Light Green
Visited Links: ~Darker Green
Use System Colors: Not Checked
Underline Links: Checked
Override the colors... :Never

So based on your suggestion to report my theme, I found at-least a temporary fix. My Tweaks->Appearance->Themes->Applications was 'HighContrastInverse'. Changing it to 'HighContrast' seemed to be the only thing to fix the example page, but now that I have changed it back to 'HighContrastInverse', the reported page is still correct; however, if I use any theme(I check all 10 of my other themes) other than the high contrast ones mentioned, the problem remains.

Comment 4

[Emilio Cobos Álvarez [:emilio]]

(You can use the "Attach new file" button for that fwiw)

I think this is the issue I'm talking about in comment 2, in which the page overrides the foreground color but not the background color... There's not much we can do there to fix it auto-magically I think...

Comment 5

[john-ivan]

Attachment: ColorSettings.png

Comment 6

[john-ivan]

uBlock Origin was making the 'Browse for a file' button not appear. Similarly, it might have been blocking the style-sheet specifying the background color of the reported page. Still, I am even having issues when setting it to 'Always' override. In this case, the font is white and the links are ocean blue when they are not supposed to be. I will upload a screenshot.

Comment 7

[john-ivan]

Attachment: NotOverriding.png

Comment 8

[john-ivan]

As you can see the background color and visited links seem to be properly overridden, but the text and unvisited links are not right at all.

I also don't understand why, with overriding colors set to 'always', this website is light colored and perfectly readable, but when set to 'never', this site is dark colored and perfectly readable. I don't know how these settings could toggle a dark theme on this site or how this site could disregard color overrides.

Comment 9

[Emilio Cobos Álvarez [:emilio]]

I think the issues here only happens you're using a high-contrast GTK theme (as otherwise we won't take the colors from the theme), and that seems to be confusing Firefox.

Or at least, if I change my GTK theme to some non-high-contrast one then the settings work as I'd expect.

There's some incremental update issue by which, depending on the order you change the color settings vs. high-contrast-theme we peek one color or another. I think that's the issue you're seeing with the link colors, that blue is the GTK theme blue. I'd argue that we shouldn't be using that blue at all because of the "Use system colors" checkbox being disabled, but maybe we forcibly use system colors when you're using a high-contrast theme (as the theme usually tells us the right overrides...)

Comment 10

[john-ivan]

Okay, yeah I was not expecting the system theme to mess with my color selections. My colors seem to override properly with a different theme(although the other dark themes are all grey and not black like I want).