fixed double up initialization on svelte:element elements

src/compiler/compile/render_dom/wrappers/Element/index.ts

@@ -169,8 +169,8 @@ export default class ElementWrapper extends Wrapper {
 		next_sibling: Wrapper
 	) {
 		super(renderer, block, parent, node);
-
-		if (node.is_dynamic_element && block.type !== CHILD_DYNAMIC_ELEMENT_BLOCK) {
+		const is_original_dynamic_element = node.is_dynamic_element && block.type !== CHILD_DYNAMIC_ELEMENT_BLOCK;
+		if (is_original_dynamic_element) {
 			this.child_dynamic_element_block = block.child({
 				comment: create_debugging_comment(node, renderer.component),
 				name: renderer.component.get_unique_name('create_dynamic_element'),
@@ -187,6 +187,11 @@ export default class ElementWrapper extends Wrapper {
 			);
 		}
 
+		// the original svelte:element is never used for rendering, because
+		// it gets assigned a child_dynamic_element which is used in all rendering logic.
+		// so doing all of this on the original svelte:element will just cause double
+		// code, because it will be done again on the child_dynamic_element.
+		if (!is_original_dynamic_element) {
 			this.var = {
 				type: 'Identifier',
 				name: node.name.replace(regex_invalid_variable_identifier_characters, '_')
@@ -195,7 +200,6 @@ export default class ElementWrapper extends Wrapper {
 			this.void = is_void(node.name);
 	
 			this.class_dependencies = [];
-
 			if (this.node.children.length) {
 				this.node.lets.forEach(l => {
 					extract_names(l.value || l.name).forEach(name => {
@@ -264,6 +268,7 @@ export default class ElementWrapper extends Wrapper {
 
 			this.fragment = new FragmentWrapper(renderer, block, node.children, this, strip_whitespace, next_sibling);
 		}
+	}
 
 	render(block: Block, parent_node: Identifier, parent_nodes: Identifier) {
 		if (this.child_dynamic_element) {

test/js/samples/svelte-element-event-handlers/expected.js

@@ -0,0 +1,125 @@
+/* generated by Svelte vX.Y.Z */
+import {
+	SvelteComponent,
+	assign,
+	bubble,
+	detach,
+	element,
+	empty,
+	get_spread_update,
+	init,
+	insert,
+	listen,
+	noop,
+	safe_not_equal,
+	set_attributes,
+	set_custom_element_data_map
+} from "svelte/internal";
+
+function create_dynamic_element(ctx) {
+	let svelte_element;
+	let mounted;
+	let dispose;
+	let svelte_element_levels = [{ class: "some-classname" }];
+	let svelte_element_data = {};
+
+	for (let i = 0; i < svelte_element_levels.length; i += 1) {
+		svelte_element_data = assign(svelte_element_data, svelte_element_levels[i]);
+	}
+
+	return {
+		c() {
+			svelte_element = element("a");
+			svelte_element.textContent = "Hi";
+
+			if ((/-/).test("a")) {
+				set_custom_element_data_map(svelte_element, svelte_element_data);
+			} else {
+				set_attributes(svelte_element, svelte_element_data);
+			}
+		},
+		m(target, anchor) {
+			insert(target, svelte_element, anchor);
+
+			if (!mounted) {
+				dispose = listen(svelte_element, "keydown", /*keydown_handler*/ ctx[0]);
+				mounted = true;
+			}
+		},
+		p(ctx, dirty) {
+			svelte_element_data = get_spread_update(svelte_element_levels, [{ class: "some-classname" }]);
+
+			if ((/-/).test("a")) {
+				set_custom_element_data_map(svelte_element, svelte_element_data);
+			} else {
+				set_attributes(svelte_element, svelte_element_data);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(svelte_element);
+			mounted = false;
+			dispose();
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let previous_tag = "a";
+	let svelte_element_anchor;
+	let svelte_element = "a" && create_dynamic_element(ctx);
+
+	return {
+		c() {
+			if (svelte_element) svelte_element.c();
+			svelte_element_anchor = empty();
+		},
+		m(target, anchor) {
+			if (svelte_element) svelte_element.m(target, anchor);
+			insert(target, svelte_element_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if ("a") {
+				if (!previous_tag) {
+					svelte_element = create_dynamic_element(ctx);
+					svelte_element.c();
+					svelte_element.m(svelte_element_anchor.parentNode, svelte_element_anchor);
+				} else if (safe_not_equal(previous_tag, "a")) {
+					svelte_element.d(1);
+					svelte_element = create_dynamic_element(ctx);
+					svelte_element.c();
+					svelte_element.m(svelte_element_anchor.parentNode, svelte_element_anchor);
+				} else {
+					svelte_element.p(ctx, dirty);
+				}
+			} else if (previous_tag) {
+				svelte_element.d(1);
+				svelte_element = null;
+			}
+
+			previous_tag = "a";
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (detaching) detach(svelte_element_anchor);
+			if (svelte_element) svelte_element.d(detaching);
+		}
+	};
+}
+
+function instance($$self) {
+	function keydown_handler(event) {
+		bubble.call(this, $$self, event);
+	}
+
+	return [keydown_handler];
+}
+
+class Component extends SvelteComponent {
+	constructor(options) {
+		super();
+		init(this, options, instance, create_fragment, safe_not_equal, {});
+	}
+}
+
+export default Component;

test/js/samples/svelte-element-event-handlers/input.svelte

@@ -0,0 +1,3 @@
+<svelte:element class="some-classname" this="a" on:keydown>
+    Hi
+</svelte:element>