1601413 - In 72 (Dev) and 73 (Nightly) variables from userChrome.css are not processed

Status: RESOLVED INVALID

(Firefox :: Theme, defect)

Description

[wernerfp]

In version 72 (Developer) and 73 (Nighly) variables from userChrome.css are no longer processed consistently. Many instructions are affected, but not all.

Example
This instruction in userChrome.css works up to Firefox 71 but not in version 72 (Developer) and 73 (Nightly):

:root {
   /* red color value */
   --base_bg_selected: #c14e4e;
}
#tabbrowser-tabs {
   /* color mark selected tab */
   --tab-line-color: var(--base_bg_selected) !important;
}

In Firefox 72 and 73 the root variable is not processed, only the direct color value is effective:

#tabbrowser-tabs {
   /* color mark selected tab */
   --tab-line-color: #c14e4e !important;
}

The expected result is that variables in userChrome.css will continue to be processed as up to Firefox 71.

Comment 1

[Danny Colin [:sdk]]

I don't think this is a bug. It's more due to the fact that _ (underscore) character isn't allowed in CSS property names. Try replacing them with a dash character. (e.g --base-bg-selected)

Comment 2

[wernerfp]

It's the same. This and other root variables are not processed in 72 and 73.

:root {
  /* red color value */
  --base-bg-selected: #c14e4e;
}
#tabbrowser-tabs {
  /* color mark selected tab */
  --tab-line-color: var(--base-bg-selected) !important;
}

Comment 3

[Emilio Cobos Álvarez (:emilio)]

Would you be able to use mozregression to find a regression range for this? You can make a copy of your profile and use mozregression --profile /path/to/profile --good 71.

That'd be extremely helpful to pin down what caused it.

Comment 4

[wernerfp]

The pushlog of mozregression is:

7:38.02 INFO: Narrowed inbound regression window from [038ebfdd, d967ac6c] (3 builds) to [038ebfdd, 9644ee96] (2 builds) (~1 steps left)
7:38.02 INFO: No more inbound revisions, bisection finished.
7:38.02 INFO: Last good revision: 038ebfdd141acdc7603d2378a832a572bb267686
7:38.02 INFO: First bad revision: 9644ee96a51a03a8f4e50e9777fb7278f246383c
7:38.02 INFO: Pushlog:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=038ebfdd141acdc7603d2378a832a572bb267686&tochange=9644ee96a51a03a8f4e50e9777fb7278f246383c

Comment 5

[Emilio Cobos Álvarez (:emilio)]

Ah, do you have an @namespace url(.../there.is.only.xul); on your stylesheet by any chance? The root is an HTML now, so that'd make :root not match.

Comment 6

[Emilio Cobos Álvarez (:emilio)]

(If so, this is invalid, you need to fix the css by either using *|*:root, or removing the default @namespace, or changing it to @namespace xul url(...);, and using xul| selectors where appropriate.)

Comment 7

[wernerfp]

Thank you Emilio!
It's exactly what you said.

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

I just tested it from ESR up to Nightly…

*|*:root {
   /* and everything is fine */
}

Sorry, I wasn't up to date on that.

Comment 8

[Emilio Cobos Álvarez (:emilio)]

Cool, thanks for checking and finding the regression range, that made it really easy to figure out what could be happening!