Cannot bind to custom CSS property variables

[zero298]

It seems that you are unable to bind to custom CSS property variables using style bindings. I saw this issue on the Stack Overflow question: Using CSS3 Variables in Knockout Style Binding.

The issue seems to stem from knockout/src/binding/defaultBindings/style.js.

Specificially how the style property is set using Array syntax instead of CSSStyleDeclaration#setProperty.

The custom properties don't seem to be enumerated on the actual Object and instead have to be set through setProperty. I'm not sure if the appropriate action would be to have everything use setProperty or if you should check the styleName for "--", say it is a variable, and only use setProperty for that particular instance.

[brianmhunt]

I wrote and expect to include a style-map binding for tko that accomplishes this. Css vars are amazing and it’s be a shame not to support them. The ordinary binding could be altered to support them too, by -as mentioned- observing if the first two chars are ‘—‘