Merge pull request #8 from Olical/prevent-mutation

Prevent mutation

src/Element.js

@@ -203,21 +203,21 @@ Element.prototype.getElementById = function (id) {
 
 Element.prototype.toReact = function (index) {
   index = index || 0
-  var props = this.props
+  var props = clone(this.props)
+  props.style = clone(props.style)
 
   function uniqueKey () {
     return 'faux-dom-' + index
   }
 
   if (typeof props.key === 'undefined') {
-    props = clone(props)
     props.key = uniqueKey()
-
-    delete props.style.setProperty
-    delete props.style.getProperty
-    delete props.style.removeProperty
   }
 
+  delete props.style.setProperty
+  delete props.style.getProperty
+  delete props.style.removeProperty
+
   return React.createElement(this.nodeName, props, this.text || this.children.map(function (el, i) {
     if (el instanceof Element) {
       return el.toReact(i)

test/react.js

@@ -53,3 +53,11 @@ test('pre-built React elements are rendered into the tree', function (t) {
   t.plan(1)
   t.equal(tree.props.children[0].props.foo, 'bar')
 })
+
+test('toReact does not mutate the state', function (t) {
+  var el = mk().node()
+  t.plan(2)
+  t.equal(typeof el.props.style.setProperty, 'function')
+  el.toReact()
+  t.equal(typeof el.props.style.setProperty, 'function')
+})

test/style.js

@@ -35,3 +35,14 @@ test('style object methods do not leak through', function (t) {
   t.equal(typeof r.props.style.getProperty, 'undefined')
   t.equal(typeof r.props.style.removeProperty, 'undefined')
 })
+
+test('when using a key the style object is still cleaned', function (t) {
+  var el = mk().node()
+  el.setAttribute('key', 'test')
+  el.style.backgroundColor = 'red'
+  var r = el.toReact()
+  t.plan(3)
+  t.equal(typeof r.props.style.setProperty, 'undefined')
+  t.equal(typeof r.props.style.getProperty, 'undefined')
+  t.equal(typeof r.props.style.removeProperty, 'undefined')
+})