Update: allow xmlns attribute on <template> elements (#27)

- Vue components are based on HTML5 custom elements.  However, HTML5
   custom elements are required to be in the HTML namespace.  This is not a
   requirement shared by Vue components.  Vue itself doesn't care about the
   namespace of the elements that it is rendering (which will be determined
   at runtime based on the namespace of the parent element where it's being
   inserted).  Therefore, it is desirable to communicate to linters and
   other tools what the intended namespace of a top-level <template> in an
   SFC is.

   See: https://html.spec.whatwg.org/multipage/custom-elements.html#look-up-a-custom-element-definition

 - Vue slots are based on HTML5 slots.  However, because of the above
   limitation that HTML5 custom elements are always in the HTML5 namespace,
   the slots contained in them are also always in the HTML5 namespace.
   Because of Vue's flexibility on this, a Vue <slot> may appear in any
   namespace; content being rendered into a slot may end up in a different
   namespace than the namespace where it was parsed.  Therefore, it is
   desirable to communicate to linters and other tools what the indented
   namespace is of content that will be rendered in a slot.

From these two observations, it would be useful to set xmlns= on:

 1. top-level <template> elements, and
 2. elements appearing in a slot.

The first is easy, but #2 has some concerns:

 - It's relatively difficult to determine when we're appearing in a slot.
   We could try checking for the slot= attribute, but that would miss cases
   where we use the default slot.
 - Because the xmlns= attribute on the resulting element would be invalid
   in HTML5 (in the cases where this is useful, anyway), we can't set it on
   normal elements anyway.

So, mostly because of the second reason, let's just say that to inform
linters about a change in namespace because of a slot, the contents must
be wrapped in a <template> to safely set xmlns= in a place that will be
ignored at runtime.  So now we've revised that to allowing xmlns= on:

 1. top-level <template> elements, and
 2. <template> elements appearing in a slot.

Let's just make things simple and allow it for all <template> elements.
This means we'll be slightly too lax, and allow it on <template v-if="...">
constructs, but I'm OK with that.

As for which namespaces to consider valid, let's limit that to HTML, SVG,
and MathML, as those are the namespaces that are allowed in an HTML5
document.

Author: LukeShu

Diff for: src/html/parser.ts

@@ -410,7 +410,22 @@ export class Parser {
         this.closeCurrentElementIfNecessary(token.name)
 
         const parent = this.currentNode
-        const namespace = this.detectNamespace(token.name)
+        let namespace = this.detectNamespace(token.name)
+        if (token.name === "template") {
+            for (const attribute of token.attributes) {
+                if (attribute.key.name !== "xmlns") {
+                    continue
+                }
+                const value = attribute.value && attribute.value.value
+                if (
+                    value === NS.HTML ||
+                    value === NS.MathML ||
+                    value === NS.SVG
+                ) {
+                    namespace = value
+                }
+            }
+        }
         const element: VElement = {
             type: "VElement",
             range: [token.range[0], token.range[1]],