Re: [csswg-drafts] [css-color-4] Parse-time clip of HSL negative saturation for modern syntax? (#9222)

• From: Chris Lilley via GitHub <sysbot+gh@w3.org>
• Date: Tue, 20 Feb 2024 16:18:14 +0000
• To: public-css-archive@w3.org
• Message-ID: <issue_comment.created-1954568514-1708445891-sysbot+gh@w3.org>

> And the specified/computed value of `hsl(0, 150%, 40%)` is currently `rgb(204, 0, 0)`, not `rgb(255, 0, 0)`. The following examples shows some differences between legacy/modern syntax, between Chrome and FF.
> 
> ```js
> element.style.color = 'hsl(0, 150%, 40%)'
> getComputedStyle(element).color; // Chrome-FF -> rgb(204, 0, 0)
> element.style.color = 'hsl(0 150% 40%)'
> getComputedStyle(element).color; // Chrome-FF -> rgb(204, 0, 0)
> 
> element.style.color = 'color-mix(in srgb, hsl(0, 150%, 40%), hsl(0, 150%, 40%))'
> getComputedStyle(element).color; // Chrome-FF -> color(srgb 0.8 0 0)
> element.style.color = 'color-mix(in srgb, hsl(0 150% 40%), hsl(0 150% 40%))'
> getComputedStyle(element).color; // Chrome -> color(srgb 1 -0.2 -0.2) ; FF -> color(srgb 0.8 0 0)
> 
> element.style.color = 'rgb(from hsl(0, 150%, 40%) r g b)'
> getComputedStyle(element).color; // Chrome-FF -> color(srgb 0.8 0 0)
> element.style.color = 'rgb(from hsl(0 150% 40%) r g b)'
> getComputedStyle(element).color; // Chrome -> color(srgb 1 -0.2 -0.2) ; FF -> color(srgb 0.8 0 0)
> ```

Confirmed with Chrome Canary Version 123.0.6312.0 (Official Build) canary (64-bit)

```js
$0.style.color = 'hsl(0, 150%, 40%)' 
'hsl(0, 150%, 40%)'
getComputedStyle($0).color
'rgb(204, 0, 0)'
$0.style.color ='color-mix(in srgb, hsl(0, 150%, 40%), hsl(0, 150%, 40%))' 
'color-mix(in srgb, hsl(0, 150%, 40%), hsl(0, 150%, 40%))'
getComputedStyle($0).color
'color(srgb 0.8 0 0)'
$0.style.color ='color-mix(in srgb, hsl(0 150% 40%), hsl(0, 150%, 40%))' 
'color-mix(in srgb, hsl(0 150% 40%), hsl(0, 150%, 40%))'
getComputedStyle($0).color
'color(srgb 0.9 -0.1 -0.1)'
$0.style.color ='color-mix(in srgb, hsl(0 150% 40%), hsl(0 150% 40%))' 
'color-mix(in srgb, hsl(0 150% 40%), hsl(0 150% 40%))'
getComputedStyle($0).color
'color(srgb 1 -0.2 -0.2)'
```

> Unfortunately, I cannot find any test on WPT with a saturation greater than 100% in `hsl()`.

I will add some to [css/css-color/parsing/color-computed-hsl.html](https://github.com/web-platform-tests/wpt/blob/master/css/css-color/parsing/color-computed-hsl.html) and [css/css-color/parsing/color-mix-out-of-gamut.html](https://github.com/web-platform-tests/wpt/blob/master/css/css-color/parsing/color-mix-out-of-gamut.html)

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


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

Received on Tuesday, 20 February 2024 16:18:15 UTC