From 26b56b6da8abd70b7d2696b066e4f3bb66031f97 Mon Sep 17 00:00:00 2001
From: tomoam <29677552+tomoam@users.noreply.github.com>
Date: Tue, 27 Jul 2021 18:03:12 +0900
Subject: [PATCH] exclude element function if a component includes only
 svg-elements

---
 .../compile/render_dom/wrappers/Element/index.ts       |  8 +++++---
 src/runtime/internal/dom.ts                            | 10 +++++++++-
 test/js/samples/hydrated-void-svg-element/expected.js  |  8 ++++----
 3 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts
index 5cf8ec70d2..d89ede8f1c 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts
@@ -388,9 +388,11 @@ export default class ElementWrapper extends Wrapper {
 			? this.node.name
 			: this.node.name.toUpperCase();
 
-		const svg = this.node.namespace === namespaces.svg ? '@svg_element' : null;
-
-		return x`@claim_element(${nodes}, "${name}", { ${attributes} }, ${svg})`;
+		if (this.node.namespace === namespaces.svg) {
+			return x`@claim_svg_element(${nodes}, "${name}", { ${attributes} })`;
+		} else {
+			return x`@claim_element(${nodes}, "${name}", { ${attributes} })`;
+		}
 	}
 
 	add_directives_in_order (block: Block) {
diff --git a/src/runtime/internal/dom.ts b/src/runtime/internal/dom.ts
index 01b6c79af0..ee02b9e95e 100644
--- a/src/runtime/internal/dom.ts
+++ b/src/runtime/internal/dom.ts
@@ -433,7 +433,7 @@ function claim_node<R extends ChildNodeEx>(nodes: ChildNodeArray, predicate: (no
 	return resultNode;
 }
 
-export function claim_element(nodes: ChildNodeArray, name: string, attributes: { [key: string]: boolean }, create_element: (name: string) => Element | SVGElement = element) {
+export function claim_element_base(nodes: ChildNodeArray, name: string, attributes: { [key: string]: boolean }, create_element: (name: string) => Element | SVGElement) {
 	return claim_node<Element | SVGElement>(
 		nodes,
 		(node: ChildNode): node is Element | SVGElement => node.nodeName === name,
@@ -452,6 +452,14 @@ export function claim_element(nodes: ChildNodeArray, name: string, attributes: {
 	);
 }
 
+export function claim_element(nodes: ChildNodeArray, name: string, attributes: { [key: string]: boolean }) {
+	return claim_element_base(nodes, name, attributes, element);
+}
+
+export function claim_svg_element(nodes: ChildNodeArray, name: string, attributes: { [key: string]: boolean }) {
+	return claim_element_base(nodes, name, attributes, svg_element);
+}
+
 export function claim_text(nodes: ChildNodeArray, data) {
 	return claim_node<Text>(
 		nodes,
diff --git a/test/js/samples/hydrated-void-svg-element/expected.js b/test/js/samples/hydrated-void-svg-element/expected.js
index 9015c1a739..e3b525bcdd 100644
--- a/test/js/samples/hydrated-void-svg-element/expected.js
+++ b/test/js/samples/hydrated-void-svg-element/expected.js
@@ -3,7 +3,7 @@ import {
 	SvelteComponent,
 	append_hydration,
 	children,
-	claim_element,
+	claim_svg_element,
 	claim_text,
 	detach,
 	init,
@@ -26,9 +26,9 @@ function create_fragment(ctx) {
 			t = text("a title");
 		},
 		l(nodes) {
-			svg = claim_element(nodes, "svg", {}, svg_element);
+			svg = claim_svg_element(nodes, "svg", {});
 			var svg_nodes = children(svg);
-			title = claim_element(svg_nodes, "title", {}, svg_element);
+			title = claim_svg_element(svg_nodes, "title", {});
 			var title_nodes = children(title);
 			t = claim_text(title_nodes, "a title");
 			title_nodes.forEach(detach);
@@ -55,4 +55,4 @@ class Component extends SvelteComponent {
 	}
 }
 
-export default Component;
\ No newline at end of file
+export default Component;