Re: [csswg-drafts] [css-properties-values-api] Are fallbacks provided for registered properties validated by the CP syntax? (#10455)

@miragecraft Please see @Loirooriol's [comment](https://github.com/w3c/csswg-drafts/issues/10455#issuecomment-2174259218)! The fallback value is checked against the property it is _applied to_, not the custom property in the `var()` construct.

> In the codepen: https://codepen.io/leaverou/pen/oNRpEGO
> 
> `<pre style="--color: red; background: var(--color, lime);">\</pre\>` is rendered as yellowgreen, even though lime is a valid syntax of the registered `--color` property.
> 
> The WPT test mentioned also confirms this: https://github.com/web-platform-tests/wpt/blob/master/css/css-pseudo/highlight-cascade/highlight-cascade-003.html#L8-L14
> 
> <style>
>   @property --bg {
>     syntax: "<color>";
>     inherits: false;
>     initial-value: green;
>   }
>   :root::selection {
>     background-color: var(--bg, red);
>   }
> </style>
> <main>PASS if background-color is green when selected</main>
> 
> Why would it be green if fallback value of red is a valid `<color>`?

In those two cases, the _initial value_ of the custom properties is taken, as it is a valid `<color>` value. So the fallback values are disregarded there.

Put the other way round, if you have this:

```css
@property --foo {
  syntax: "<length>";
  inherits: false;
  initial-value: 100px;
}

:root {
  background-color: var(--foo, yellowgreen);
}
```

the background should be yellowgreen because the `--foo` property is invalid at computed value time while the fallback value `yellowgreen` is a valid value for `background-color`.
At least that's what was resolved on. Though browsers currently fail to apply the fallback value because they validate it against `--foo`'s `<length>` syntax.

Sebastian

-- 
GitHub Notification of comment by SebastianZ
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10455#issuecomment-2738347180 using your GitHub account


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

Received on Wednesday, 19 March 2025 22:39:45 UTC