[css3-transitions] transition-property with no supported properties

According to the specification for ‘transition-property’:

> If one of the identifiers listed is not a recognized property name or
> is not an animatable property, the implementation must still start
> transitions on the animatable properties in the list using the
> duration, delay, and timing function at their respective indices in
> the lists for ‘transition-duration’, ‘transition-delay’, and
> ‘transition-timing-function’. In other words, unrecognized or
> non-animatable properties must be kept in the list to preserve the
> matching of indices.

This means that the following rule:

     transition-property: unknown, color;
     transition-duration: 1s, 2s;
     transition-timing-function: linear, ease-in-out;

Is treated as though only the ‘color 2s ease-in-out’ transition applies 
(in browsers that know how to transition color, of course).

The spec does not seem to account for when none of the properties listed 
in ‘transition-property’ are animatable, such as in any of these 

     transition-property: background-image;
     transition-property: unknown;
     transition-property: unknown, another-unknown;

Are we to assume that these would be functionally equivalent to 
‘transition-property: none’? Or is there a special case to be made that 
hasn't been specified?

I ask this because, in researching the answer to the following Stack 
Overflow question:


I found that with the following declaration:

     transition: -webkit-transform 1s, transform 1s;

Firefox and IE10+ apply the transition defined for the ‘transform’ 
property and safely ignore the one for ‘-webkit-transform’, as required 
by the spec. I would expect Chrome to similarly transition 
‘-webkit-transform’ and ignore ‘transform’, however it seems to drop the 
declaration entirely. I suppose I will have to find out if this has been 
reported yet, since it looks clearly like a violation of the spec.

Note that Chrome is able to handle the transition just fine if I specify 
a property that, while not animatable, is at least recognized:

     transition: -webkit-transform 1s, background-image 1s;

Given that prefixes still see prevalent use today, this may also be a 
cause for concern when listing several declarations for various prefixes 
of ‘transition’ and/or other properties, as cascade resolution may lead 
to unexpected behavior as demonstrated in the question I link to.

If the behavior is intentional (i.e. having no animatable properties 
being equivalent to specifying ‘none’ rather than being flat-out 
invalid), it might be worth clarifying anyway, as it does not seem too 
clear to me at the moment.

Daniel Tan

Received on Monday, 17 March 2014 17:01:30 UTC