- From: Sebastian Zartner via GitHub <sysbot+gh@w3.org>
- Date: Sun, 29 May 2022 09:39:36 +0000
- To: public-css-archive@w3.org
I've created three fiddles now to check the current behavior of computed values again. One with longhand properties where the length-controlling properties have longer lists than the controlled ones, one with longhand properties where the length-controlling properties have shorter lists than the controlled ones, and one with shorthand properties. Testing with those fiddles, my initial comment on that seems to be slightly incorrect because in Gecko `background-*` longhands are treated special when it comes to the computed value. # Tests Here are my observations regarding the list lengths of computed and used values in tabular form. I don't have access to MacOS/Safari, so maybe someone else can check the test cases there. ## Longhands with controlling property lists longer than controlled ones https://jsfiddle.net/SebastianZ/wyupok0h/ | | Chrome | Firefox | |-------------------|---------|---------| | `background-size` | computed and used: repeated to match controlling property | computed and used: repeated to match controlling property | | `transition-duration` | computed: as authored, used: repeated to match controlling property | computed: as authored, used: repeated to match controlling property | | `animation-duration` | computed: as authored, used: repeated to match controlling property | computed: as authored, used: repeated to match controlling property | ## Longhands with controlling property lists shorter than controlled ones https://jsfiddle.net/SebastianZ/bxj4y3ar/ | | Chrome | Firefox | |-------------------|---------|---------| | `background-size` | computed and used: truncated to match controlling property | computed: as authored, used: repeated to match controlling property | | `transition-duration` | computed: as authored, used: truncated to match controlling property | computed: as authored, used: truncated to match controlling property | | `animation-duration` | computed: as authored, used: truncated to match controlling property | computed: as authored, used: truncated to match controlling property | ## Shorthands with controlling property lists longer than controlled ones https://jsfiddle.net/SebastianZ/wmeLxhtf/ | | Chrome | Firefox | |-------------------|---------|---------| | `background-size` | computed and used: padded with initial value to match controlling property | computed and used: padded with initial value to match controlling property | | `transition-duration` | computed and used: padded with initial value to match controlling property | computed and used: padded with initial value to match controlling property | | `animation-duration` | computed and used: padded with initial value to match controlling property | computed and used: padded with initial value to match controlling property | "Repeated" refers to the [spec. text](https://drafts.csswg.org/css-backgrounds-3/#layering), which currently reads like this: > The lists are matched up from the first value: excess values at the end are not used. If a property doesn’t have enough comma-separated values to match the number of layers, the UA must calculate its used value by repeating the list of values until there are enough. # Summary of current behavior Both Chromium and Gecko special-case the `background-*` longhands by repeating them for the computed value in case they are shorter than `background-image`. When `background-image` is shorter than the longhands, Chromium truncates the longhands while Gecko keeps them as authored. All other list-valued longhands are kept as authored for the computed value in both engines. I guess, from an author's perspective, it may be a little easier to understand what's happening if computed and used values would be the same. That means, repeating when the controlling property list is longer and truncating if it is shorter. @emilio, @tabatkins, @nt1m Could you please check back with your teams regarding the current implementations, the complications, and what would make implementations actually easier? Sebastian -- GitHub Notification of comment by SebastianZ Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7164#issuecomment-1140412764 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Sunday, 29 May 2022 09:39:37 UTC