I am trying to work out the correct behavior for computed value serialization of a few families of properties, background-* and animation-* (and their partners mask-* and transition-*, though I will ignore them for the moment for simplicity) and need some clarification as WPT currently has divergent expectations.

Specifically, this issue is looking at what the behavior of serialization of longhands should be when the base property is either omitted or has fewer entries (though, the same question arises for the case where the base property has more entries, complicating things with both cases will only serve to make this more complicated, and I think we will likely be able to infer one answer from the other). Currently WPT seems to expect that background-* properties to truncate to the length of background-image, whereas animation-* properties don't truncate to the length of animation-name.

This lack of consistency seems unfortunate and somewhat contrary to the note in CSS Animations spec after describing how to handle multiple values that states:

NOTE: This is analogous to the behavior of the background-* properties, with background-image analogous to animation-name.

To more clear, here are specific examples.

background-* Example

For the background-* behavior, suppose we are given the element:

<div id="test1" style="background-repeat: repeat-x, repeat-y, space, round"></div>

and assuming it has no other relevant styles applied to it, what should be the result of the following:

window.getComputedStyle(document.getElementById('test1'))['background-repeat']

WPT (in this test for instance) expects the result to be truncated down to just the first element due to no corresponding background-image entries:

 "repeat-x"

animation-* Example

Conversely, for the animation-* behavior, suppose we are given the element:

<div id="test2" style="animation-fill-mode: none, forwards, backwards, both;"></div>

and assuming it has no other relevant styles applied to it, what should be the result of the following:

window.getComputedStyle(document.getElementById('test2'))['animation-fill-mode']

WPT (in this test for instance) expects the result to NOT be truncated down to just the first element due to no corresponding animation-name entries, and instead be the full set:

 "none, forwards, backwards, both"

My initial instinct is that the non-truncation behavior of the animation-* properties is probably correct, as it would seem to adhere to the rule set out for coordinating list property group that states pretty clearly:

The computed values of the coordinating list properties are not affected by such truncation or repetition.

And animation-* were defined to be a coordinating list property group in CSS Animations Level 2.

Questions

But the inconsistency is still unfortunate. So this leaves me with the following questions:

• Should the background-* properties be defined to be a coordinating list property group and adopt the truncation behavior?
• Or alternatively, should the background-* properties be defined to be a coordinating list property group and the behavior for all such groups be redefined to truncate for computed style? (A reason to potentially prefer the truncation behavior is that it can be implemented more efficiently in some cases by allowing knowledge of the final length as determine by the length the base property).