unkeyed each-blocks with outros

src/generators/dom/visitors/EachBlock.js

@@ -237,6 +237,24 @@ function unkeyed ( generator, block, state, node, snippet, { create_each_block,
 
 		const start = node._block.hasUpdateMethod ? '0' : `${iterations}.length`;
 
+		const destroy = node._block.hasOutroMethod ?
+			deindent`
+				function outro ( i ) {
+					if ( ${iterations}[i] ) {
+						${iterations}[i].outro( function () {
+							${iterations}[i].destroy( true );
+							${iterations}[i] = null;
+						});
+					}
+				}
+
+				for ( ; ${i} < ${iterations}.length; ${i} += 1 ) outro( ${i} );
+			` :
+			deindent`
+				${generator.helper( 'destroyEach' )}( ${iterations}, true, ${each_block_value}.length );
+				${iterations}.length = ${each_block_value}.length;
+			`;
+
 		block.builders.update.addBlock( deindent`
 			var ${each_block_value} = ${snippet};
 
@@ -245,9 +263,7 @@ function unkeyed ( generator, block, state, node, snippet, { create_each_block,
 					${forLoopBody}
 				}
 
-				${generator.helper( 'destroyEach' )}( ${iterations}, true, ${each_block_value}.length );
+				${destroy}
-
-				${iterations}.length = ${each_block_value}.length;
 			}
 		` );
 	}

test/runtime/samples/transition-js-each-block-outro/_config.js

@@ -0,0 +1,16 @@
+export default {
+	data: {
+		things: [ 'a', 'b', 'c' ]
+	},
+
+	test ( assert, component, target, window, raf ) {
+		const divs = target.querySelectorAll( 'div' );
+
+		component.set({ things: [ 'a' ] });
+
+		raf.tick( 50 );
+		assert.equal( divs[0].foo, undefined );
+		assert.equal( divs[1].foo, 0.5 );
+		assert.equal( divs[2].foo, 0.5 );
+	}
+};

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

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