From 4438de50357ada0edcc82f9e0b1fe37c765f6989 Mon Sep 17 00:00:00 2001
From: Simon Holthausen <simon.holthausen@accso.de>
Date: Tue, 11 Aug 2020 18:08:27 +0200
Subject: [PATCH] (fix) infer svg element type

Using the same strategy as for `use:`
#447
---
 packages/svelte2tsx/src/htmlxtojsx/index.ts       | 15 ++++++++-------
 packages/svelte2tsx/svelte-shims.d.ts             |  1 +
 .../htmlx2jsx/samples/binding-this/expected.jsx   |  2 +-
 packages/svelte2tsx/test/sourcemaps/repl.html     |  2 +-
 4 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/packages/svelte2tsx/src/htmlxtojsx/index.ts b/packages/svelte2tsx/src/htmlxtojsx/index.ts
index 9942c94af..7e0c3dd84 100644
--- a/packages/svelte2tsx/src/htmlxtojsx/index.ts
+++ b/packages/svelte2tsx/src/htmlxtojsx/index.ts
@@ -205,7 +205,7 @@ export function convertHtmlxToJsx(
                 case 'InlineComponent':
                     return getTypeForComponent(node);
                 case 'Element':
-                    return 'HTMLElement';
+                    return `__sveltets_ctorOf(__sveltets_mapElementTag('${node.name}'))`;
                 case 'Body':
                     return 'HTMLBodyElement';
                 default:
@@ -360,12 +360,13 @@ export function convertHtmlxToJsx(
             //skip Attribute shorthand, that is handled below
             const sapperNoScroll = attr.name === 'sapper:noscroll';
             if (
-                attr.value !== true &&
-                !(
-                    attr.value.length &&
-                    attr.value.length == 1 &&
-                    attr.value[0].type == 'AttributeShorthand'
-                ) || sapperNoScroll
+                (attr.value !== true &&
+                    !(
+                        attr.value.length &&
+                        attr.value.length == 1 &&
+                        attr.value[0].type == 'AttributeShorthand'
+                    )) ||
+                sapperNoScroll
             ) {
                 let name = attr.name;
                 if (!svgAttributes.find((x) => x == name)) {
diff --git a/packages/svelte2tsx/svelte-shims.d.ts b/packages/svelte2tsx/svelte-shims.d.ts
index 8198df2de..3d5b8e01d 100644
--- a/packages/svelte2tsx/svelte-shims.d.ts
+++ b/packages/svelte2tsx/svelte-shims.d.ts
@@ -105,6 +105,7 @@ declare function __sveltets_ensureAction<U extends any[], El extends any>(
 declare function __sveltets_ensureTransition<U extends any[]>(transition: SvelteTransition<U>, ...args: U): {};
 declare function __sveltets_ensureFunction(expression: (e: Event & { detail?: any }) => unknown ): {};
 declare function __sveltets_ensureType<T>(type: AConstructorTypeOf<T>, el: T): {};
+declare function __sveltets_ctorOf<T>(type: T): AConstructorTypeOf<T>;
 declare function __sveltets_instanceOf<T>(type: AConstructorTypeOf<T>): T;
 declare function __sveltets_allPropsType(): SvelteAllProps
 declare function __sveltets_restPropsType(): SvelteRestProps
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/binding-this/expected.jsx b/packages/svelte2tsx/test/htmlx2jsx/samples/binding-this/expected.jsx
index 0d61e1853..da0fb960b 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/binding-this/expected.jsx
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/binding-this/expected.jsx
@@ -1 +1 @@
-<><input type="radio" {...__sveltets_ensureType(HTMLElement, element)} value="Plain"/></>
+<><input type="radio" {...__sveltets_ensureType(__sveltets_ctorOf(__sveltets_mapElementTag('input')), element)} value="Plain"/></>
diff --git a/packages/svelte2tsx/test/sourcemaps/repl.html b/packages/svelte2tsx/test/sourcemaps/repl.html
index 12c36a1a9..78d320334 100644
--- a/packages/svelte2tsx/test/sourcemaps/repl.html
+++ b/packages/svelte2tsx/test/sourcemaps/repl.html
@@ -136,7 +136,7 @@
 				<TableOfContents sections={sections} slug={slug} selected={selected}/>
 			</div>
 
-			<div class="chapter-markup" {...__sveltets_ensureType(HTMLElement, scrollable)}>
+			<div class="chapter-markup" {...__sveltets_ensureType(__sveltets_ctorOf(__sveltets_mapElementTag('div')), scrollable)}>
 				{ chapter.html}
 
 				<div class="controls">