[csswg-drafts] [css-variables-2] Substitution takes place at the level of CSS component values (#11316)

cdoublev has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-variables-2] Substitution takes place at the level of CSS component values ==
The note below [substitute a var()](https://drafts.csswg.org/css-variables-2/#substitute-a-var) says that *"var() substitution takes place **at the level of CSS tokens**"*.

If this took place at the token level, the computed value of `color` would be valid in the following example:

```css
style {
  color: var(--custom) );
  --custom: rgb(0 0 0;
```

A CSS parser would see `<function-token>` whose `name` is `rgb`, `<number-token>`s and `<whitespace-token>`s, `<)-token>`.

Actually, in the example above, the declaration for `color` is invalid in the current version of Chrome and FF (#11315). However, per spec ([step 5](https://drafts.csswg.org/css-syntax-3/#consume-a-declaration)) and as shown by the following example, the declaration value of a custom property is consumed as a list of component values:

```css
style {
  opacity: calc(1 / var(--custom));
  --custom: ( 2;
```

The computed value of `opacity` is `0.5` in the current version of Chrome and FF.

Since custom property values are consumed as a list of component values, I presume substitutions should not take place in a list of tokens, right?

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11316 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 3 December 2024 14:11:42 UTC