fix mount order of keyed each-block with intros

src/generators/dom/visitors/EachBlock.js

@@ -149,6 +149,8 @@ function keyed ( generator, block, state, node, snippet, { each_block, create_ea
 
 	const parentNode = state.parentNode || `${anchor}.parentNode`;
 
+	const hasIntros = node._block.hasIntroMethod;
+
 	block.builders.update.addBlock( deindent`
 		var ${each_block_value} = ${snippet};
 		var ${_iterations} = [];
@@ -163,11 +165,13 @@ function keyed ( generator, block, state, node, snippet, { each_block, create_ea
 
 			if ( ${lookup}[ ${key} ] ) {
 				${consequent}
+				${hasIntros && `${_iterations}[${i}].mount( ${fragment}, null );`}
 			} else {
 				${_iterations}[${i}] = ${_lookup}[ ${key} ] = ${create_each_block}( ${params}, ${each_block_value}, ${each_block_value}[${i}], ${i}, ${block.component}, ${key} );
+				${hasIntros && `${_iterations}[${i}].intro( ${fragment}, null );`}
 			}
 
-			${_iterations}[${i}].${mountOrIntro}( ${fragment}, null );
+			${!hasIntros && `${_iterations}[${i}].mount( ${fragment}, null );`}
 		}
 
 		// remove old iterations

test/runtime/samples/transition-js-each-block-keyed-intro/_config.js

@@ -0,0 +1,49 @@
+export default {
+	data: {
+		things: [
+			{ name: 'a' },
+			{ name: 'b' },
+			{ name: 'c' }
+		]
+	},
+
+	test ( assert, component, target, window, raf ) {
+		let divs = target.querySelectorAll( 'div' );
+		assert.equal( divs[0].foo, 0 );
+		assert.equal( divs[1].foo, 0 );
+		assert.equal( divs[2].foo, 0 );
+
+		raf.tick( 50 );
+		assert.equal( divs[0].foo, 0.5 );
+		assert.equal( divs[1].foo, 0.5 );
+		assert.equal( divs[2].foo, 0.5 );
+
+		component.set({
+			things: [
+				{ name: 'a' },
+				{ name: 'woo!' },
+				{ name: 'b' },
+				{ name: 'c' }
+			]
+		});
+		assert.htmlEqual( target.innerHTML, `
+			<div>a</div>
+			<div>woo!</div>
+			<div>b</div>
+			<div>c</div>
+		` );
+		divs = target.querySelectorAll( 'div' );
+		assert.equal( divs[0].foo, 0.5 );
+		assert.equal( divs[1].foo, 0 );
+		assert.equal( divs[2].foo, 0.5 );
+		assert.equal( divs[3].foo, 0.5 );
+
+		raf.tick( 75 );
+		assert.equal( divs[0].foo, 0.75 );
+		assert.equal( divs[1].foo, 0.25 );
+		assert.equal( divs[2].foo, 0.75 );
+		assert.equal( divs[3].foo, 0.75 );
+
+		component.destroy();
+	}
+};

test/runtime/samples/transition-js-each-block-keyed-intro/main.html

@@ -0,0 +1,18 @@
+{{#each things as thing @name}}
+	<div in:foo>{{thing.name}}</div>
+{{/each}}
+
+<script>
+	export default {
+		transitions: {
+			foo: function ( node, params ) {
+				return {
+					duration: 100,
+					tick: t => {
+						node.foo = t;
+					}
+				};
+			}
+		}
+	};
+</script>