1239087 - CSS errors when opening the browser console - Property contained reference to invalid variable. Error in parsing value for 'background-color'. Falling back to 'initial'.

Status: RESOLVED FIXED

(DevTools :: Console, defect)

Description

[:Gijs (he/him)]

Complete list from the browser console itself:

Property contained reference to invalid variable.  Error in parsing value for 'background-color'.  Falling back to 'initial'. webconsole.css:359:7687
Property contained reference to invalid variable.  Error in parsing value for 'border-top-color'.  Falling back to 'initial'. webconsole.css:360:7744
Property contained reference to invalid variable.  Error in parsing value for 'border-top-style'.  Falling back to 'initial'. webconsole.css:360:7744
Property contained reference to invalid variable.  Error in parsing value for 'border-top-width'.  Falling back to 'initial'. webconsole.css:360:7744
Property contained reference to invalid variable.  Error in parsing value for 'color'.  Falling back to 'inherit'. webconsole.css:379:8164
Property contained reference to invalid variable.  Error in parsing value for 'color'.  Falling back to 'inherit'. webconsole.css:389:8585

The CSS is from https://hg.mozilla.org/mozilla-central/diff/ea6053144e51/devtools/client/themes/webconsole.css#l360 but I don't know if this isn't a regression from something that took those definitions away from the browser console, which is harder to track down. ntim, any chance you know what's going on here?

Comment 1

[:Gijs (he/him)]

(In reply to :Gijs Kruitbosch from comment #0)
> The CSS is from
> https://hg.mozilla.org/mozilla-central/diff/ea6053144e51/devtools/client/
> themes/webconsole.css#l360 but I don't know if this isn't a regression from
> something that took those definitions away from the browser console, which
> is harder to track down.

Specifically, because I don't see this on beta, but that cset landed on nightly for 44a01, according to hg.mozilla.org

Comment 2

[Tim Nguyen :ntim]

(In reply to :Gijs Kruitbosch from comment #0)
> The CSS is from
> https://hg.mozilla.org/mozilla-central/diff/ea6053144e51/devtools/client/
> themes/webconsole.css#l360 but I don't know if this isn't a regression from
> something that took those definitions away from the browser console, which
> is harder to track down. ntim, any chance you know what's going on here?

Maybe the CSS variables are loaded after webconsole.css ?

Comment 3

[Tim Nguyen :ntim]

(In reply to Tim Nguyen [:ntim] from comment #2)
> (In reply to :Gijs Kruitbosch from comment #0)
> > The CSS is from
> > https://hg.mozilla.org/mozilla-central/diff/ea6053144e51/devtools/client/
> > themes/webconsole.css#l360 but I don't know if this isn't a regression from
> > something that took those definitions away from the browser console, which
> > is harder to track down. ntim, any chance you know what's going on here?
> 
> Maybe the CSS variables are loaded after webconsole.css ?
In case my sentence was confusing: Maybe the file that loads the CSS variables is loaded after after webconsole.css

Comment 4

[Nicolas Chevobbe [:nchevobbe]]

These errors are not visible anymore in the browser console when opening the web console