append to the dom, not a document fragment, when updating each block in slot - fixes #927

src/generators/dom/visitors/EachBlock.ts

@@ -21,7 +21,7 @@ export default function visitEachBlock(
 	const iterations = block.getUniqueName(`${each}_blocks`);
 	const params = block.params.join(', ');
 
-	const needsAnchor = node.next ? !isDomNode(node.next, generator) : !state.parentNode;
+	const needsAnchor = node.next ? !isDomNode(node.next, generator) : !state.parentNode || !isDomNode(node.parent, generator);
 	const anchor = needsAnchor
 		? block.getUniqueName(`${each}_anchor`)
 		: (node.next && node.next.var) || 'null';
@@ -219,7 +219,7 @@ function keyed(
 	`);
 
 	const dynamic = node._block.hasUpdateMethod;
-	const parentNode = state.parentNode || `${anchor}.parentNode`;
+	const parentNode = isDomNode(node.parent, generator) ? node.parent.var : `${anchor}.parentNode`;
 
 	let destroy;
 	if (node._block.hasOutroMethod) {
@@ -414,7 +414,7 @@ function unkeyed(
 		.map(dependency => `changed.${dependency}`)
 		.join(' || ');
 
-	const parentNode = state.parentNode || `${anchor}.parentNode`;
+	const parentNode = isDomNode(node.parent, generator) ? node.parent.var : `${anchor}.parentNode`;
 
 	if (condition !== '') {
 		const forLoopBody = node._block.hasUpdateMethod

test/runtime/samples/component-slot-each-block/Nested.html

@@ -0,0 +1,3 @@
+<div>
+	<slot/>
+</div>

test/runtime/samples/component-slot-each-block/_config.js

@@ -0,0 +1,24 @@
+export default {
+	data: {
+		things: [1, 2, 3]
+	},
+
+	html: `
+		<div>
+			<span>1</span>
+			<span>2</span>
+			<span>3</span>
+		</div>`,
+
+	test(assert, component, target) {
+		component.set({ things: [1, 2, 3, 4] });
+		assert.htmlEqual(target.innerHTML, `
+			<div>
+				<span>1</span>
+				<span>2</span>
+				<span>3</span>
+				<span>4</span>
+			</div>
+		`);
+	}
+};

test/runtime/samples/component-slot-each-block/main.html

@@ -0,0 +1,13 @@
+<Nested>
+	{{#each things as thing}}
+		<span>{{thing}}</span>
+	{{/each}}
+</Nested>
+
+<script>
+	import Nested from './Nested.html';
+
+	export default {
+		components: { Nested }
+	};
+</script>