[css-variables-1] Custom properties and serialization

[kbabbitt]

The CSSWG previously resolved that custom properties must preserve their input exactly for serialization. I've been working on implementing that behavior in Blink, and @andruud brought up some cases in code review that seem worth clarifying:

1. When serializing the computed value of a custom property, is the original text preserved? What about a custom property that has had another custom property substituted into it? Based on the use cases in the discussion, I'd think the answer would be "yes," and this is also what Gecko does.

    --y: /* baz */;
    --x: /* foo */ var(--y) /* bar */;

2. When serializing a specified value containing a var() reference. is the original text preserved? I think the use case of "transport non-CSS text in a custom property" is less compelling here, but Gecko preserves in this case as well.

  color: /* bah */ var(--x);

3. What about registered custom properties? In the case below, I'd expect that the computed value of --z would be /* should preserve */ assuming no other rules apply, but I'm not sure whether that would extend to registered custom properties with more restrictive syntaxes:

  @property --z {
    syntax: "*";
    inherits: true;
    initial-value: /* should preserve */;
  }

Test page for all of these cases: https://jsbin.com/dabegoq/4/edit?html,output

[tabatkins]

For 1), are you saying that you expect the computed-value serialization of --x to be /* foo */ /* baz */ /* bar */?

For 2), this falls under the general umbrella of "uh, specified-value serialization isn't well-defined right now". See #5642.

For 3), custom properties registered with "*" syntax should serialize the same as an unregistered property; custom properties registered with any other type should serialize like other standard properties with that type.

[kbabbitt]

Thanks @tabatkins.

Re: 1), yes, that's what I would expect.

[tabatkins]

I've editted the spec to reflect the point in (1):

Specified values of [=custom properties=] must be serialized
exactly as specified by the author.
Simplifications that might occur in other properties,
such as dropping comments,
normalizing whitespace,
reserializing numeric tokens from their value,
etc.,
must not occur.

Computed values of [=custom properties=] must similarly be serialized
exactly as specified by the author,
save for the replacement of any ''var()'' functions.

Along with an example and some reasoning for this (I remember the UUID case being brought up earlier).

I don't think this change has been approved by the WG, but it's implemented that way in Gecko (and possibly now in Chrome?) so I suspect it'll be a nice easy rubber-stamp. Tagging Agenda+ to get the resolution tho.