Fix accidental camelCasing of CSS Variables (#153)

* Fix accidental camelCasing of CSS Variables

* Add test

* Re-add non-dimensional guard (whoops!)

Author: developit

src/util.js

@@ -21,7 +21,7 @@ export function styleObjToCss(s) {
 		if (val!=null) {
 			if (str) str += ' ';
 			// str += jsToCss(prop);
-			str += JS_TO_CSS[prop] || (JS_TO_CSS[prop] = prop.replace(/([A-Z])/g,'-$1').toLowerCase());
+			str += prop[0]=='-' ? prop : (JS_TO_CSS[prop] || (JS_TO_CSS[prop] = prop.replace(/([A-Z])/g,'-$1').toLowerCase()));
 			str += ': ';
 			str += val;
 			if (typeof val==='number' && IS_NON_DIMENSIONAL.test(prop)===false) {

test/render.js

@@ -145,6 +145,13 @@ describe('render', () => {
 			expect(rendered).to.equal(expected);
 		});
 
+		it('should preserve CSS Custom Properties', () => {
+			let rendered = render(<div style={{ '--foo': 1, '--foo-bar': '2' }} />),
+				expected = `<div style="--foo: 1; --foo-bar: 2;"></div>`;
+
+			expect(rendered).to.equal(expected);
+		});
+
 		it('should ignore empty object styles', () => {
 			let rendered = render(<div style={{}} />),
 				expected = `<div></div>`;