Merge pull request #159 from staltz/master

Fix patch() so that the root is patched instead of recreated

snabbdom.js

@@ -39,7 +39,9 @@ function init(modules, api) {
   }
 
   function emptyNodeAt(elm) {
-    return VNode(api.tagName(elm).toLowerCase(), {}, [], undefined, elm);
+    var id = elm.id ? '#' + elm.id : '';
+    var c = elm.className ? '.' + elm.className.split(' ').join('.') : '';
+    return VNode(api.tagName(elm).toLowerCase() + id + c, {}, [], undefined, elm);
   }
 
   function createRmCb(childElm, listeners) {

test/core.js

@@ -136,6 +136,17 @@ describe('snabbdom', function() {
         done();
       }
     });
+    it('is a patch of the root element', function () {
+      var elmWithIdAndClass = document.createElement('div');
+      elmWithIdAndClass.id = 'id';
+      elmWithIdAndClass.className = 'class';
+      var vnode1 = h('div#id.class', [h('span', 'Hi')]);
+      elm = patch(elmWithIdAndClass, vnode1).elm;
+      assert.strictEqual(elm, elmWithIdAndClass);
+      assert.equal(elm.tagName, 'DIV');
+      assert.equal(elm.id, 'id');
+      assert.equal(elm.className, 'class');
+    });
   });
   describe('pathing an element', function() {
     it('changes the elements classes', function() {
@@ -670,7 +681,7 @@ describe('snabbdom', function() {
           {remove: function(_, rm) { rm2 = rm; }},
         ]);
         var vnode1 = h('div', [h('a', {hook: {remove: function(_, rm) { rm3 = rm; }}})]);
-	var vnode2 = h('div', []);
+        var vnode2 = h('div', []);
         elm = patch(vnode0, vnode1).elm;
         assert.equal(elm.children.length, 1);
         elm = patch(vnode1, vnode2).elm;
@@ -686,7 +697,7 @@ describe('snabbdom', function() {
         var result = [];
         var parent = document.createElement('div');
         var vnode0 = document.createElement('div');
-	parent.appendChild(vnode0);
+        parent.appendChild(vnode0);
         function cb(vnode, rm) {
           result.push(vnode);
           rm();
@@ -725,7 +736,7 @@ describe('snabbdom', function() {
             h('span', 'Child 2'),
           ]),
         ]);
-	var vnode2 = h('div');
+        var vnode2 = h('div');
         patch(vnode0, vnode1);
         patch(vnode1, vnode2);
         assert.equal(result.length, 1);
@@ -752,7 +763,7 @@ describe('snabbdom', function() {
             h('span', 'Child 2'),
           ]),
         ]);
-	var vnode2 = h('div');
+        var vnode2 = h('div');
         patch(vnode0, vnode1);
         patch(vnode1, vnode2);
         assert.equal(created, 4);
@@ -770,7 +781,7 @@ describe('snabbdom', function() {
           '',
           h('span', 'Third child'),
         ]);
-	var vnode2 = h('div');
+        var vnode2 = h('div');
         patch(vnode0, vnode1);
         patch(vnode1, vnode2);
         assert.equal(created, 2);
@@ -790,7 +801,7 @@ describe('snabbdom', function() {
             h('span', ['Text 1', 'Text 2']),
           ]),
         ]);
-	var vnode2 = h('div');
+        var vnode2 = h('div');
         patch(vnode0, vnode1);
         patch(vnode1, vnode2);
         assert.equal(created, 4);