1496395 - userContent.css background can affect XUL buttons

Status: NEW

(Core :: CSS Parsing and Computation, defect, P4)

Description

[Silas S. Brown]

User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.139 Safari/537.36

Steps to reproduce:

In userContent.css, put:

* {
   background: black !important;
   text-color: white !important;
}

and start Firefox.


Actual results:

The buttons for Close Tab, New Tab, Reload, Home, Menu etc all had their background set to black.  The foreground colour is however NOT set to white: it is still dark, so it's difficult to see what the button is for.


Expected results:

It was my understanding that userContent.css should affect only the content of pages, and not the buttons of the surrounding XUL interface.  (Note that I am editing only userContent.css, not userChrome.css.)  If however the surrounding buttons must be affected, then both foreground and background colours should be heeded, not just one of the two.  This bug has accessibility implications for people who need alternate colour schemes for medical reasons.

Comment 1

[Alice0775 White]

Regression window:
https://hg.mozilla.org/integration/mozilla-inbound/pushloghtml?fromchange=393be8743349aa97b9c3413cdc164f2d976cf34d&tochange=4c8f6b544de1a3918199086d1bd4474855581bb5

Regressed by:
4c8f6b544de1	Emilio Cobos Álvarez — Bug 1468133: Remove the optimization to lazily load non-SVG styles since it's not relevant anymore. r=heycam

@:emilio,

Your patch causes the regression, can you please look into this?

Comment 2

[Emilio Cobos Álvarez (:emilio)]

Well this is kind of expected, SVG resource documents are not chrome documents, so userContent.css applies to them... It was just pure luck it didn't because it relied on an optimization that was unsound.

We could add an exception so they aren't loaded on SVG resources, but that's not great IMO, because that breaks my eventual desire of loading the same UA sheets on all content documents so we could share resources across them.

(In reply to Silas S. Brown from comment #0)
> * {
>    background: black !important;
>    text-color: white !important;

text-color is not a CSS property, I guess you mean `color`? But you also need to set `fill` so it works with SVG, otherwise it will also break on inline SVGs on HTML documents.

Would such a solution work?

I basically think this is ~expected, but could add a hack to preserve the previous behavior should it be needed.

Comment 3

[Silas S. Brown]

Yes I meant color not text-color, sorry.  Setting both color and fill to yellow works on Firefox 62, thanks.

Comment 4

[Mats Palmgren (inactive)]

Fwiw, I think our intent was that userContent.css should only affect
web content, not UI.  UI is what userChrome.css is for.

Comment 5

[Liz Henry (:lizzard) (relman/hg->git project)]

Marking fix-optional for 64. We could still take a patch in 65.

Comment 6

[Pascal Chevrel:pascalc]

Updating tracking flags as we get closer to the 64 release.