Re: [cssom][css-variables] value on CSSStyleDeclaration of longhand properties set by a shorthand with variable references

Cameron McCormack:
>> Consider:
>>    <style>
>>     p {
>>      var-a: url("a") green;
>>      background-color: red;
>>      background: var(a);
>>    }
>>    </style>
>>    <script>
>>      var decl = document.styleSheets[0].cssRules[0].style;
>>      alert(decl.getPropertyValue("background-color"));
>>    </script>
>> What should be alerted?
>> Conceptually, I think of 'background-color' having a specified value of
>> something like 'extract-background-color( var(a))'.  Setting 'background'
>> overrides whatever value was given to 'background-color' earlier in the
>> declaration.
>> Chrome alerts "red", but that's misleading, since 'background-color' is
>> overridden.  My WIP patches for Firefox return " var(a)" but that's also not
>> right.
>> I'd be happy with returning an empty string, in lieu of anything more
>> useful.

Tab Atkins Jr.:
> I answered this same question when raised by someone else last
> February:<>
> I said I'd edit it in, and then failed to do so.  It's *actually*
> edited in now.  ^_^
> (The answer is "" for your code.  If you called getComputedStyle(), it
> would be "green".)

A related question is how to serialise the whole declaration when you 
have one of these longhands-set-by-a-shorthand-with-variables.  So if 
you had:

   p { var-a: url("a") green; background: var(a); }

what should you get if you get the cssText of the rule or its 
declaration?  It makes less sense here to use "" as the values for 
background-color, background-image, etc., since that would cause the 
returned string not to be reparseable.  (I'm assuming we're not caring 
about roundtripability here.)

Received on Friday, 6 September 2013 05:40:30 UTC