Merge pull request #3443 from sveltejs/gh-2569

update context if event handler uses index in keyed each block

src/compiler/compile/nodes/shared/Expression.ts

@@ -147,7 +147,10 @@ export default class Expression {
 
 						contextual_dependencies.add(name);
 
-						if (!lazy) {
+						const owner = template_scope.get_owner(name);
+						const is_index = owner.type === 'EachBlock' && owner.key && name === owner.index;
+
+						if (!lazy || is_index) {
 							template_scope.dependencies_for_name.get(name).forEach(name => dependencies.add(name));
 						}
 					} else {

test/runtime/samples/each-block-keyed-index-in-event-handler/_config.js

@@ -0,0 +1,18 @@
+export default {
+	html: `
+		<button>remove</button>
+		<button>remove</button>
+		<button>remove</button>
+	`,
+
+	async test({ assert, target, window }) {
+		const click = new window.MouseEvent('click');
+
+		await target.querySelectorAll('button')[1].dispatchEvent(click);
+		await target.querySelectorAll('button')[1].dispatchEvent(click);
+
+		assert.htmlEqual(target.innerHTML, `
+			<button>remove</button>
+		`);
+	}
+};

test/runtime/samples/each-block-keyed-index-in-event-handler/main.svelte

@@ -0,0 +1,16 @@
+<script>
+	let list = ["a", "b", "c"];
+
+	const remove = index => {
+		list.splice(index, 1);
+		list = list;
+	};
+</script>
+
+{#each list as value, index (value)}
+	{#if value}
+		<button on:click="{e => remove(index)}">
+			remove
+		</button>
+	{/if}
+{/each}