Merge pull request #180 from mkaemmerer/setAttributeNS

Support namespaced attributes

modules/attributes.js

@@ -1,3 +1,7 @@
+var NamespaceURIs = {
+  "xlink": "http://www.w3.org/1999/xlink"
+};
+
 var booleanAttrs = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "compact", "controls", "declare",
                 "default", "defaultchecked", "defaultmuted", "defaultselected", "defer", "disabled", "draggable",
                 "enabled", "formnovalidate", "hidden", "indeterminate", "inert", "ismap", "itemscope", "loop", "multiple",
@@ -12,7 +16,7 @@ for(var i=0, len = booleanAttrs.length; i < len; i++) {
 
 function updateAttrs(oldVnode, vnode) {
   var key, cur, old, elm = vnode.elm,
-      oldAttrs = oldVnode.data.attrs, attrs = vnode.data.attrs;
+      oldAttrs = oldVnode.data.attrs, attrs = vnode.data.attrs, namespaceSplit;
 
   if (!oldAttrs && !attrs) return;
   oldAttrs = oldAttrs || {};
@@ -23,11 +27,15 @@ function updateAttrs(oldVnode, vnode) {
     cur = attrs[key];
     old = oldAttrs[key];
     if (old !== cur) {
-      // TODO: add support to namespaced attributes (setAttributeNS)
       if(!cur && booleanAttrsDict[key])
         elm.removeAttribute(key);
-      else
-        elm.setAttribute(key, cur);
+      else {
+        namespaceSplit = key.split(":");
+        if(namespaceSplit.length > 1 && NamespaceURIs.hasOwnProperty(namespaceSplit[0]))
+          elm.setAttributeNS(NamespaceURIs[namespaceSplit[0]], key, cur);
+        else
+          elm.setAttribute(key, cur);
+      }
     }
   }
   //remove removed attributes

test/attributes.js

@@ -26,6 +26,11 @@ describe('attributes', function() {
     assert.strictEqual(elm.getAttribute('minlength'), '0');
     assert.strictEqual(elm.getAttribute('value'), 'false');
   });
+  it('are set correctly when namespaced', function() {
+    var vnode1 = h('div', {attrs: {'xlink:href': '#foo'}});
+    elm = patch(vnode0, vnode1).elm;
+    assert.strictEqual(elm.getAttributeNS('http://www.w3.org/1999/xlink', 'href'), '#foo');
+  });
   describe('boolean attribute', function() {
     it('is present if the value is truthy', function() {
       var vnode1 = h('div', {attrs: {required: true, readonly: 1, noresize: 'truthy'}});