cleanup if remount

src/compiler/compile/render_dom/Block.ts

@@ -293,7 +293,7 @@ export default class Block {
 		if (this.chunks.mount.length === 0) {
 			properties.mount = noop;
 		} else {
-			properties.mount = x`function #mount(#target, anchor) {
+			properties.mount = x`function #mount(#target, anchor, #remount) {
 				${this.chunks.mount}
 			}`;
 		}
@@ -454,7 +454,10 @@ export default class Block {
 
 			if (this.event_listeners.length === 1) {
 				this.chunks.mount.push(
-					b`${dispose} = ${this.event_listeners[0]};`
+					b`
+						if (#remount) ${dispose}();
+						${dispose} = ${this.event_listeners[0]};
+					`
 				);
 
 				this.chunks.destroy.push(
@@ -462,6 +465,7 @@ export default class Block {
 				);
 			} else {
 				this.chunks.mount.push(b`
+					if (#remount) @run_all(${dispose});
 					${dispose} = [
 						${this.event_listeners}
 					];

src/runtime/internal/keyed_each.ts

@@ -56,7 +56,7 @@ export function update_keyed_each(old_blocks, dirty, get_key, dynamic, ctx, list
 
 	function insert(block) {
 		transition_in(block, 1);
-		block.m(node, next);
+		block.m(node, next, lookup.has(block.key));
 		lookup.set(block.key, block);
 		next = block.first;
 		n--;

test/runtime/samples/event-handler-each-modifier/_config.js

@@ -0,0 +1,42 @@
+export default {
+	async test({ assert, component, target, window }) {
+		// set first
+		await component.lists.update(() => [
+			{ text: "item1" },
+			{ text: "item2" },
+			{ text: "item3" }
+		]);
+
+		await component.lists.update(() => [
+			{ text: "item3" },
+			{ text: "item2" },
+			{ text: "item1" }
+		]);
+
+		await component.lists.update(() => [
+			{ text: "item1" },
+			{ text: "item2" },
+			{ text: "item3" }
+		]);
+
+		assert.equal(component.updated, 4);
+
+		const [item1, item2] = target.childNodes;
+		const [item1Btn1, item1Btn2] = item1.querySelectorAll('button');
+		const [item2Btn1, item2Btn2] = item2.querySelectorAll('button');
+
+		const clickEvent = new window.MouseEvent('click');
+		
+		await item1Btn1.dispatchEvent(clickEvent);
+		assert.equal(component.getNormalCount(), 1);
+		
+		await item1Btn2.dispatchEvent(clickEvent);
+		assert.equal(component.getModifierCount(), 1);
+
+		await item2Btn1.dispatchEvent(clickEvent);
+		assert.equal(component.getNormalCount(), 2);
+		
+		await item2Btn2.dispatchEvent(clickEvent);
+		assert.equal(component.getModifierCount(), 2);
+	}
+};

test/runtime/samples/event-handler-each-modifier/main.svelte

@@ -0,0 +1,37 @@
+<script>
+	import {afterUpdate} from 'svelte'
+	import {writable} from 'svelte/store'
+	
+	const normal = writable(0);
+	const modifier = writable(0);
+	export let updated = 0;
+	export const lists = writable([]);
+	
+	const click = (e, type) => {
+		if(type === 'normal'){
+			$normal ++;
+		}else{
+			$modifier ++;
+		}
+	}
+	afterUpdate(() => updated++);
+
+	export function getNormalCount() {
+		return $normal;
+	}
+	export function getModifierCount() {
+		return $modifier;
+	}
+</script>
+
+{#each $lists as item (item.text)}
+	<div>
+		{item.text}
+		<button on:click={(e)=>click(e,'normal')}>
+			Normal
+		</button>
+		<button on:click|preventDefault={(e)=> click(e,'modifier')}>
+			Modifier
+		</button>
+	</div>
+{/each}