[cssom] Specify serialization principle for shorthands

[zcorpan]

https://drafts.csswg.org/cssom/#serialize-a-css-declaration-block

The spec currently tries to serialize properties with the minimal set of component values, i.e. omitting optional ones that are the initial value. But @dbaron points out that some properties may need to be different because of browser legacy and web compat. So the principle should be minimal with exceptions for web compat.

[dbaron]

Though the compat principle I was talking about was different: that when new features are introduced to a property, and a value can be expressed in an old-style syntax or a new-style syntax, we try to serialize to the old-style syntax even if it's longer than the new-style syntax.

[dbaron]

It's probably also worth trying to list principles for serialization more generally, such as:

• round-tripping
• preferring older syntax if the syntax has evolved over time
• preferring shorter (fewer components, not fewer characters)
• not breaking existing interop

(probably more)

[litherum]

Does this actually belong in a spec? Is the audience spec editors to help them make good specs, or is it implementors who would refer to this to know how to implement correct serialization for properties?

[emilio]

Given that generally spec editors don't tend to specify the exact serialization of all the given values of a given property, relying on CSSOM instead, I think it should be on a spec, yeah...

[dbaron]

I also think it's sometimes a good idea for one spec to have material that is targeted at other spec authors. This can help make sure design principles are appropriately agreed on and widely-enough known, and help others catch when they're not followed. I think this is a case where that would be a good idea.

[tabatkins]

Yeah, we write guidelines for spec editors in specs at times, if for no other reason than to serve as an opportunity for non-editors to catch the inconsistency and tell us we've done something wrong.

[xfq]

Another place to mention this might be https://w3ctag.github.io/design-principles/

[cdoublev]

I do not know if it can be defined as a serialization principle but I think that a shorthand should serialize if (this serialization would round trip and) its reset-only sub-properties are declared with their initial value or the initial keyword. Firefox does not serialize the shorthand when a reset-only sub-property is declared with initial. It could even be defined that reset-only sub-properties should be declared with a value equivalent to their initial value.

style.border = '1px solid black'
style.borderImageOutset = '0'
console.log(style.border) // Chrome/Firefox: '1px solid black
style.borderImageOutset = '0px'
console.log(style.border) // Chrome/Firefox: ''

[emilio]

I do not know if it can be defined as a serialization principle but I think that a shorthand should serialize if (this serialization would round trip and) its reset-only sub-properties are declared with their initial value or the initial keyword.

Why? I don't think we should special-case initial over other css-wide keywords.

[dbaron]

I agree with @emilio's objection to the initial rule; I think we should stick to the rule for CSS-wide keywords that a shorthand cannot serialize if any of its subproperties have different CSS-wide-keyword state. That is, a shorthand can serialize only if all of its subproperties are the same CSS-wide keyword (in which case it serializes to that keyword) or if none of its subproperties are a CSS-wide keyword.

I agree that a shorthand should serialize if its reset-only subproperties are their initial value (i.e., what they're reset to).

Much of this should be specified generally in CSSOM rather than specified as a principle for other specifications to follow. I'm not sure that it is, though.

[cdoublev]

I expressed myself badly because I do not have a strong opinion on whether a shorthand should serialize even if one of its sub-property is initial. I wrote this based on what I observed from the output in Chrome and because initial is equivalent to the initial value (I think). Actually I think it makes shorthand serialization easier to implement.

I guess you also both think that border should not serialize when border-image-outset is 0px instead of 0 (initial value).

Much of this should be specified generally in CSSOM rather than specified as a principle for other specifications to follow. I'm not sure that it is, though.

Ok. Sorry to be off topic then. I am pretty sure it is not defined in CSSOM.

Off topic

I would expect to see these "rules" in serialize a CSS value, in which the serialization principles are also defined.

I cannot find your comment in which you list these "rules". I was quite relieved to realize that it was identical to mine (I think).

A shorthand must serialize to:

• '' if it cannot exactly represent the values of all the properties in list
  • some longhand is not declared
  • some longhand is declared with a different priority
  • some longhand is declared with a CSS-wide keyword (except if all are declared with the same keyword)
  • some longhand is declared with a substitution value of its own
  • some longhand is a reset-only sub-property declared with a value that is not its initial value
  • some longhand is declared with a value that the shorthand cannot represent according to its grammar
• the (loose) equal CSS-wide keyword declared for all its longhands
• the (strict) equal pending-substitution value declared for all its longhands
• the value composed from the declaration values for its longhand sup-properties according to the shorthand grammar and the shortest representation principle