simplify handling of html blocks

src/compile/dom/Block.ts

@@ -34,7 +34,6 @@ export default class Block {
 		intro: CodeBuilder;
 		update: CodeBuilder;
 		outro: CodeBuilder;
-		detachRaw: CodeBuilder;
 		destroy: CodeBuilder;
 	};
 
@@ -72,7 +71,6 @@ export default class Block {
 			intro: new CodeBuilder(),
 			update: new CodeBuilder(),
 			outro: new CodeBuilder(),
-			detachRaw: new CodeBuilder(),
 			destroy: new CodeBuilder(),
 		};
 
@@ -101,7 +99,8 @@ export default class Block {
 		name: string,
 		renderStatement: string,
 		claimStatement: string,
-		parentNode: string
+		parentNode: string,
+		noDetach?: boolean
 	) {
 		this.addVariable(name);
 		this.builders.create.addLine(`${name} = ${renderStatement};`);
@@ -112,7 +111,7 @@ export default class Block {
 			if (parentNode === 'document.head') this.builders.destroy.addLine(`@detachNode(${name});`);
 		} else {
 			this.builders.mount.addLine(`@insertNode(${name}, #target, anchor);`);
-			this.builders.destroy.addConditional('detach', `@detachNode(${name});`);
+			if (!noDetach) this.builders.destroy.addConditional('detach', `@detachNode(${name});`);
 		}
 	}
 
@@ -159,10 +158,6 @@ export default class Block {
 			this.builders.mount.addLine(`${this.autofocus}.focus();`);
 		}
 
-		// minor hack – we need to ensure that any {@html x} blocks are detached first
-		// (TODO: is this still necessary? or is there a neater approach?)
-		this.builders.destroy.addBlockAtStart(this.builders.detachRaw.toString());
-
 		const properties = new CodeBuilder();
 
 		let localKey;

src/compile/nodes/RawMustacheTag.ts

@@ -56,7 +56,8 @@ export default class RawMustacheTag extends Tag {
 				anchorBefore,
 				`@createElement('noscript')`,
 				parentNodes && `@createElement('noscript')`,
-				parentNode
+				parentNode,
+				true
 			);
 		}
 
@@ -76,7 +77,12 @@ export default class RawMustacheTag extends Tag {
 		}
 
 		block.builders.mount.addLine(insert(init));
-		block.builders.detachRaw.addConditional('detach', detach);
+
+		if (!parentNode) {
+			block.builders.destroy.addConditional('detach', needsAnchorBefore
+				? `${detach}\n@detachNode(${anchorBefore});`
+				: detach);
+		}
 
 		if (needsAnchorAfter && anchorBefore !== 'null') {
 			// ...otherwise it should go afterwards

test/js/samples/each-block-changed-check/expected-bundle.js

@@ -271,11 +271,6 @@ function create_each_block(component, ctx) {
 		},
 
 		d(detach) {
-			if (detach) {
-				detachAfter(raw_before);
-			}
-
-
 			if (detach) {
 				detachNode(div);
 			}

test/js/samples/each-block-changed-check/expected.js

@@ -123,11 +123,6 @@ function create_each_block(component, ctx) {
 		},
 
 		d(detach) {
-			if (detach) {
-				detachAfter(raw_before);
-			}
-
-
 			if (detach) {
 				detachNode(div);
 			}