1053721 - CSSLint complains 'Rule is empty' when defining variables

Status: RESOLVED WONTFIX

(Firefox OS Graveyard :: Gaia, defect)

Description

[Wilson Page [:wilsonpage]]

EXAMPLE

:root {
  --my-color: red;
}

Error: 'Rule is empty. line 1, col 1'

Comment 1

[Anthony Ricaud (:rik)]

This is an issue with CSSLint, we should report it at https://github.com/CSSLint/csslint/issues.

We could also disable the empty-rules check in our config. I'd prefer to see this fixed in CSSLint.

Comment 3

[:Eli Perelman]

Filed [1]. I'm curious to know how files like [2] got past the linter when it includes a :root selector with only CSS variables, which should be considered empty.

Also, I'm not sure how active csslint is lately, and I've got something I'll need to land for 2.1 using one of these variables. At this point, I would like to be able to commit without breaking builds. How would you feel about adding a hack to make the rule non-empty for the purpose of committing with the intent to remove? Something like:

  :root {
    display: block; /* The :root html element is display: block anyway, so this should be harmless */
    --software-home-button-height: 4.5rem;
  }

It's either that or disabling the empty-rules check. Thoughts?

[1] https://github.com/CSSLint/csslint/issues/538
[2] https://github.com/mozilla-b2g/gaia/blob/master/shared/elements/gaia-theme/style.css#L8

Comment 4

[Anthony Ricaud (:rik)]

You can add known errors for this file while we wait for CSSLint feedback.

See https://github.com/mozilla-b2g/gaia/blob/2bac78bdd09552ce42fa4eee88d96483b0a66dcf/build/csslint/xfail.list#L77

Comment 5

[:Eli Perelman]

I've also just found that you can use a comment ignore as well:

  /*csslint empty-rules: false*/

Would the xfail.list still be preferable?

Comment 6

[Anthony Ricaud (:rik)]

Is this comment disabling empty-rules for the whole file or just a rule? If it's the whole file, I think xfail.list is preferable.

Comment 7

[BMO Automation]

Firefox OS is not being worked on