[csswg-drafts] [css-transitions] Serialization of `transition` with ambiguous longhand values (#12467)

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

== [css-transitions] Serialization of `transition` with ambiguous longhand values ==
I closed #7897 because the definition of `<custom-ident>` in the spec actually ensures that `transition: ease-in ease-out` expands with `transition-timing-function: ease-in` and `transition-property: ease-out`.

However, [serializing a shorthand value](https://drafts.csswg.org/cssom-1/#serialize-a-css-value) requires ordering its longhand values in canonical order. And the canonical order of `transition` longhands puts `transition-property` before `transition-timing-function`.

So I think warning about placing `transition-property` after any other longhand when appropriate, would be helpful.

But how should `transition` serialize when, for example, all its longhands are declared with their initial value, but `transition-property` is declared with `ease`?

(1) with `transition: ease ease`?

(2) Always serializing all longhand values, as with many shorthands in mainstream browsers, is simple but goes against the shortest serialization principle.

(3) I do not known if replacing an unknown `transition-property` with `unknown` or `not all` (like for invalid `<media-query>`) or `none` (which requires accepting in `<single-transition-property>`), would break back-compat.

**Note:** both Chrome and FF serialize `transition: ease` for the above case, which does not round-trip, noting that Chrome puts the value of `transition-property` last, like `animation-name` in `animation`, which is convenient to disambiguate `<custom-ident>` when reading grammars from left to right.

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


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

Received on Wednesday, 9 July 2025 14:05:48 UTC