call of action when <svelte:element> tag changed

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

@@ -294,14 +294,13 @@ export default class ElementWrapper extends Wrapper {
 		const if_statement = x`${not_equal}(${previous_tag}, ${previous_tag} = ${snippet})`;
 
 		block.chunks.update.unshift(b`
+			${this.var}.p(#ctx, #dirty);
 			if (${if_statement}) {
 				${this.var}.d(1);
 				${this.var} = ${this.child_dynamic_element_block.name}(#ctx);
 				${this.var}.c();
 				@transition_in(${this.var});
 				this.m(${this.get_update_mount_node(anchor)}, ${anchor});
-			} else {
-				${this.var}.p(#ctx, #dirty);
 			}
 		`);
 

test/runtime/samples/dynamic-element-action-update/_config.js

@@ -0,0 +1,21 @@
+export default {
+	html: `
+		<h1>tag is h1.</h1>
+	`,
+
+	async test({ assert, component, target }) {
+
+		assert.equal(component.tag, 'h1');
+		assert.equal(component.updateText, '');
+		assert.equal(component.destroyText, '');
+
+		component.tag = 'h2';
+
+		assert.equal(component.tag, 'h2');
+		assert.equal(component.updateText, 'update: h2');
+		assert.equal(component.destroyText, 'destroy');
+		assert.htmlEqual(target.innerHTML, `
+			<h2>tag is h2.</h2>
+		`);
+	}
+};

test/runtime/samples/dynamic-element-action-update/main.svelte

@@ -0,0 +1,13 @@
+<script>
+	export let updateText = "";
+	export let destroyText = "";
+  export let tag = "h1";
+  function foo(node, tag) {
+    return {
+      update: (tag) => updateText = `update: ${tag}`,
+      destroy: () => destroyText = 'destroy'
+    };
+  }
+</script>
+
+<svelte:element this={tag} use:foo={tag}>tag is {tag}.</svelte:element>