[css-properties-values-api] Composition behavior of lists

[andruud]

When doing a composite:'add' between two custom property lists, what should happen? Are the lists concatenated, or are they added component-wise?

There doesn't seem to be a default behavior specified anywhere for simple lists.

See also relevant text in web-animations-1, under accumulate.

CC: @birtles (@flackr wants to know your opinion!)

[flackr]

Just to add some thoughts on the matter, this depends a lot on how the particular custom list is used. This may be an argument for supporting either behavior, though it feels to me that longterm maybe the custom property should specify what the right additive behavior is.

For example, lets say that the custom property represents top / left / bottom / right border attributes, concatenating will not do what you want. However, if the custom property represents where to draw bubbles in a background image, then either could make sense, and if the lists are of different lengths you probably wanted to concatenate them.

[birtles]

Generally composite: 'add' becomes list concatenation and composite: 'accumulate' becomes component-wise addition. This matches the behavior in SVG.

For iterationComposite, we only allow accumulate because we were concerned that if you repeat an animation 1000 times doing list concatenation you'll end up with a really long list. (I think we later worked out that wasn't such a big deal, but I can't remember why.)

[flackr]

Just to confirm @birtles, the edit you pointed me at today https://drafts.csswg.org/web-animations-1/#by-computed-value means that composite: add will do component-wise addition now, right?

[birtles]

Yes, that's right. As in, it will do whatever "addition" means for each component (which, if it's not defined for the type of the component, means just return the second argument, i.e. no addition).