From 72cdb52e1d9f9899cbdd2f4ba5aada24038ee907 Mon Sep 17 00:00:00 2001
From: teddddd <ted@mixpanel.com>
Date: Wed, 28 Dec 2016 00:12:15 -0500
Subject: [PATCH] Fix Custom Element creation when tag name begins with 'svg'

The check at https://github.com/snabbdom/snabbdom/blob/f79af828/src/h.ts#L37
is too loose, and ends up adding the svg namespace to elements with
tagNames such as svg-icon, which prevents web components lifecycle
callbacks from firing.
---
 src/h.ts     |  5 ++++-
 test/core.js | 10 +++++++++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/h.ts b/src/h.ts
index 3e0a3f8..781fe92 100644
--- a/src/h.ts
+++ b/src/h.ts
@@ -34,7 +34,10 @@ export function h(sel: any, b?: any, c?: any): VNode {
       if (is.primitive(children[i])) children[i] = (vnode as any)(undefined, undefined, undefined, children[i]);
     }
   }
-  if (sel[0] === 's' && sel[1] === 'v' && sel[2] === 'g') {
+  if (
+    sel[0] === 's' && sel[1] === 'v' && sel[2] === 'g' &&
+    (sel.length === 3 || sel[3] === '.' || sel[3] === '#')
+  ) {
     addNS(data, children, sel);
   }
   return vnode(sel, data, children, text, undefined);
diff --git a/test/core.js b/test/core.js
index 37c7d03..2a52558 100644
--- a/test/core.js
+++ b/test/core.js
@@ -89,15 +89,23 @@ describe('snabbdom', function() {
       elm = patch(vnode0, h('div', [h('div', {ns: SVGNamespace})])).elm;
       assert.equal(elm.firstChild.namespaceURI, SVGNamespace);
 
+      // verify that svg tag automatically gets svg namespace
       elm = patch(vnode0, h('svg', [
         h('foreignObject', [
           h('div', ['I am HTML embedded in SVG'])
         ])
       ])).elm;
-
       assert.equal(elm.namespaceURI, SVGNamespace);
       assert.equal(elm.firstChild.namespaceURI, SVGNamespace);
       assert.equal(elm.firstChild.firstChild.namespaceURI, XHTMLNamespace);
+
+      // verify that svg tag with extra selectors gets svg namespace
+      elm = patch(vnode0, h('svg#some-id')).elm;
+      assert.equal(elm.namespaceURI, SVGNamespace);
+
+      // verify that non-svg tag beginning with 'svg' does NOT get namespace
+      elm = patch(vnode0, h('svg-custom-el')).elm;
+      assert.notEqual(elm.namespaceURI, SVGNamespace);
     });
     it('is receives classes in selector', function() {
       elm = patch(vnode0, h('div', [h('i.am.a.class')])).elm;