ensure hoisted event handler names are globally unique — fixes #466

Author: Rich-Harris

src/generators/dom/visitors/Element/EventHandler.js

@@ -44,7 +44,7 @@ export default function visitEventHandler ( generator, block, state, node, attri
 	// get a name for the event handler that is globally unique
 	// if hoisted, locally unique otherwise
 	const handlerName = shouldHoist ?
-		generator.alias( `${name}_handler` ) :
+		generator.getUniqueName( `${name}_handler` ) :
 		block.getUniqueName( `${name}_handler` );
 
 	// create the handler body

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

@@ -0,0 +1,36 @@
+export default {
+	data: {
+		foo: [ 1 ],
+		bar: [ 2 ],
+		clicked: 'neither'
+	},
+
+	html: `
+		<button>foo</button>
+		<button>bar</button>
+		<p>clicked: neither</p>
+	`,
+
+	test ( assert, component, target, window ) {
+		const buttons = target.querySelectorAll( 'button' );
+		const event = new window.MouseEvent( 'click' );
+
+		buttons[0].dispatchEvent( event );
+		assert.equal( component.get( 'clicked' ), 'foo' );
+		assert.htmlEqual( target.innerHTML, `
+			<button>foo</button>
+			<button>bar</button>
+			<p>clicked: foo</p>
+		` );
+
+		buttons[1].dispatchEvent( event );
+		assert.equal( component.get( 'clicked' ), 'bar' );
+		assert.htmlEqual( target.innerHTML, `
+			<button>foo</button>
+			<button>bar</button>
+			<p>clicked: bar</p>
+		` );
+
+		component.destroy();
+	}
+};

test/runtime/samples/event-handler-each-deconflicted/main.html

@@ -0,0 +1,9 @@
+{{#each foo as f}}
+	<button on:click='set({ clicked: "foo" })'>foo</button>
+{{/each}}
+
+{{#each bar as b}}
+	<button on:click='set({ clicked: "bar" })'>bar</button>
+{{/each}}
+
+<p>clicked: {{clicked}}</p>