Fix false negatives for CSS Variables in alpha-value-notation

[jeddy3]

Clearly describe the bug

There are false negatives for CSS Variables that span multiple parameters in alpha-value-notation, e.g.

a { color: hsl(var(--hsl) / 50%) }

As an aside, this makes me realise how CSS Variables make static analysis less comprehensive. In the past, we were confident that our rules would catch everything, but with CSS Variables that is no longer the case. CSS Variables muddy the waters every time we use the value parser to find (see the find* utilities) a particular value, e.g. a font-size within the font shorthand property or an <alpha-value> within a colour function. A CSS Variable value is only known at runtime when the browser resolves it based on the cascade and DOM.

The best we can do is narrow down the possibilities of what a particular node could represent.

Which rule, if any, is the bug related to?

alpha-value-notation

What code is needed to reproduce the bug?

a { color: hsl(var(--hsl) / 0.5) }

What stylelint configuration is needed to reproduce the bug?

{
  "rules": {
    "alpha-value-notation": "percentage"
  }
}

Which version of stylelint are you using?

13.9.0

How are you running stylelint: CLI, PostCSS plugin, Node.js API?

API via Demo

Does the bug relate to non-standard syntax (e.g. SCSS, Less etc.)?

No.

What did you expect to happen?

The following warnings to be flagged:

test.css
2:4    Expected 0.5 to be 50% (alpha-value-notation)

What actually happened (e.g. what warnings or errors did you get)?

No warnings.