[csswg-drafts] [conditionial-3] Define if support for custom variable should be tested (#7013)

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

== [conditionial-3] Define if support for custom variable should be tested ==
> A CSS processor is considered to support a declaration (consisting of a property and value) if it accepts that declaration (rather than discarding it as a parse error) within a [style rule](https://drafts.csswg.org/css-syntax-3/#style-rule).

https://drafts.csswg.org/css-conditional-3/#support-definition

All the following declarations used as `<supports-condition>` for `@support` are valid declarations in a style rule, but the `@support` with the declaration that use a custom variable does not apply in Chrome/Firefox.

```html
<style>
  :root {
    --custom-color: red; 
  }
  @supports (color: --custom-color) {
    div:nth-child(1) {
      color: red;
    }
  }
  @supports (--foo: orange) {
    div:nth-child(2) {
      color: orange;
    }
  }
  @supports (color: initial) {
    div:nth-child(3) {
      color: green;
    }
  }
</style>
<div>Custom variable</div> <!-- Should be red but is black -->
<div>Custom property</div> <!-- orange -->
<div>Global keyword</div> <!-- green -->
```

I'm probably missing something again, sorry.

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


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

Received on Thursday, 3 February 2022 20:01:29 UTC