W3C home > Mailing lists > Public > www-style@w3.org > September 2012

Re: [css-variables] How to spec the OM for vars?

From: Garrett Smith <dhtmlkitchen@gmail.com>
Date: Mon, 3 Sep 2012 09:25:02 -0700
Message-ID: <CABZUbM1=5qYWjHatJzeekr6=6Nsmwd+XK=4wd5mc-FY4pQQupQ@mail.gmail.com>
To: "Tab Atkins Jr." <jackalmage@gmail.com>
Cc: www-style list <www-style@w3.org>
On 8/31/12, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
> On Thu, Aug 23, 2012 at 5:46 PM, Tab Atkins Jr. <jackalmage@gmail.com>
> wrote:
>> One of the remaining issues for Variables is what to expose in the OM, and
>> how.
>> Ideally, custom properties would just be exposed alongside all the
>> other properties, so you could do "el.style.varFoo = 'bar';" or "x =
>> getComputedStyle(el).varFoo;".
>> This seems somewhat incompatible with how WebIDL works.  Right now,
>> all the CSS properties are just exposed on CSSStyleDeclaration as a
>> bunch of properties.  (If we were doing things properly, we'd do this
>> by having every spec define a partial interface on it and add their
>> properties.)
>> However, there are an infinite number of custom properties.  I think
>> we want to expose only the custom properties that are valid (set to a
>> non-initial value).
>> How can we do this in WebIDL?
> Based on the feedback in this thread, I've now specced the API:
> <http://dev.w3.org/csswg/css-variables/#cssom>
> I've gone with adding a "var" attribute to CSSStyleDeclaration, which
> is a CSSVariablesDeclaration object.
> The CSSVariablesDeclaration interface just contains a
> getter/setter/creator/deleter.  It accepts property names *without*
> the "var-" prefix, like so:
> el.style.var.foo /* equal to el.style.getPropertyValue('var-foo') */
SyntaxError (or syntax extension) for pre-es5 engines.

> I decided not to do any camelCase to dashes conversion, because it
> wouldn't work if any component of the var name didn't start with an
> ASCII lowercase letter. The shorthand .form only works if your var
> name was a single JS ident, according to normal JS rules.  If your var
> name doesn't match that, just use the array syntax:

The Array syntax?!

> el.style.var['foo-bar'] /* equal to el.style.getPropertyValue('var-foo-bar')
> */
> Is this acceptable?  If so, we need to re-resolve to publish a WD, as
> this is a major change.
Obviously not.

The use of a ReservedWord as an identifier will fail with SyntaxError
in some less-recent implementations (those that did not support what
was then a syntax extension).

Prior to EcmaScript 5 (ES5), the standard was Ecma 262 r3. Ecma 262 r3
specified that property access would throw a SyntaxError the
Identifier was a ReservedWord. In ES5-compliant implementations, "."
property access operator may use a ReservedWord, like `var` or `if`.
However this throws a SyntaxError in older browsers.

For further explanation, here is a page which I have just found to
provide an in-depth explanation:

But that is not the only questionable thing I see.

What is this:-
 | deleter void (DOMString varName);

 | delete the value of a variable. When asked to delete the value of a
 | variable, if varName matches the grammar of a custom property
 | name, invoke removeProperty() by passing varName as its argument,
 | and return the returned value. Otherwise, do nothing and return the
empty string.

What does it mean to "delete the value of a variable"? How can a value
be deleted? It almost looks like an attempt to redefine the delete
operator. What is this?!
Twitter: @xkit
Received on Monday, 3 September 2012 16:25:30 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:21 UTC