NV / CSSOM

Unmaintained! ⚠️ CSS Object Model implemented in pure JavaScript. Also, a CSS parser.
https://nv.github.io/CSSOM/docs/parse.html
MIT License
752 stars 99 forks source link

CSSStyleDeclaration#setProperty with Number 0 as value breaks getPropertyValue #81

Closed acusti closed 8 years ago

acusti commented 8 years ago

Here’s an illustration of the problem (see it demonstrated in this Tonic notebook):

var cssRule = require('cssom').parse('body {opacity: 0}').cssRules[0];
console.log(cssRule.cssText); // "body {opacity: 0;}"
cssRule.style.setProperty('opacity', 0.1); 
console.log(cssRule.cssText); // "body {opacity: 0.1;}"
cssRule.style.setProperty('opacity', 0);
console.log(cssRule.cssText); // "body {opacity: ;}"
cssRule.style.setProperty('opacity', '0');
console.log(cssRule.cssText); // "body {opacity: 0; opacity: 0;}"

When the cssText getter calls this.getPropertyValue(name) and the value is the Number 0, return this[name] || ""; returns the second part of the condition.

I quickly checked the spec and saw that setProperty takes value of type DOMString, and that a DOMString, by MDN’s description, is effectively just a JS string. This is already how the CSSOM.parse part of the API works, of course, so I propose having setProperty coerce it’s value argument to a string, i.e. change CSSStyleDeclaration.js:54 to:

        this[name] = value + "";