[css-transitions-1] Clarify priority `transition-property` over `transition-timing-function` in `transition`

[cdoublev]

I'm surprised I cannot find a related issue or thread in the archive because transition exists since quite a long time, so I hope I have not missed any, or something in the spec.

In transition: ease, what should match ease? Obviously, everyone assumes it should match transition-timing-function and it does in all browsers (I think), but this match priority over transition-property does not seem defined, neither by the syntax or in prose.

Below transition definition table, the priority of transition-duration over transition-delay is defined. Below transition-property definition table, it is defined that an unrecognized property name as <single-transition-property> is valid, and that none and CSS-wide keyword are invalid.

Solution I am thinking to: move [ none | <single-transition-property> ] to the end of transition syntax and add in prose below transition definition table, that transition-timing-function has priority over transition-property.

Somewhat related: #6946

Aside: imho, something like <'transition-duration'> || <'transition-timing-function'> || <'transition-delay'> || <'transition-property'> for transition, and none | [all | <custom-ident>]# for transition-property (keeping in mind that # is ignored when parsing transition), would be much clearer and would illustrate what is defined in prose.

[Loirooriol]

Seems there is interoperability that transition-timing-function has more priority:

var s = document.body.style;
s.transition = "ease linear";
[s.transitionTimingFunction, s.transitionProperty]; // [ "ease", "linear" ]

[tabatkins]

Hm, this is well specified for 'animation' (https://drafts.csswg.org/css-animations/#animation), but it seems the same text doesn't exist in Transitions.

[cdoublev]

Changed the title to include the new longhand transition-behavior. The issue has been discussed in the related PR.

I think dbaron is right that the order does not matter in | and || for parsing purpose. But you can either:

1. allow transition-property to match ease and define that transition-timing-function has priority
2. disallow transition-property to match ease

In case 1, ordering accordingly helps translating the priority rules defined in the prose.