From b63a54b502bba22c977394f3e5ffb17e53eb17d9 Mon Sep 17 00:00:00 2001
From: Arpad Borsos <arpad.borsos@googlemail.com>
Date: Tue, 29 Nov 2016 13:06:09 +0100
Subject: [PATCH] correctly insert non-element children before an anchor

---
 compiler/generate/index.js                    |  7 ++++++
 compiler/generate/visitors/EachBlock.js       |  2 +-
 compiler/generate/visitors/Element.js         | 11 ++-------
 compiler/generate/visitors/IfBlock.js         |  2 +-
 compiler/generate/visitors/MustacheTag.js     |  2 +-
 compiler/generate/visitors/Text.js            |  2 +-
 test/compiler/if-block-elseif-text/_config.js | 23 +++++++++++++++++++
 test/compiler/if-block-elseif-text/main.html  |  1 +
 8 files changed, 37 insertions(+), 13 deletions(-)
 create mode 100644 test/compiler/if-block-elseif-text/_config.js
 create mode 100644 test/compiler/if-block-elseif-text/main.html

diff --git a/compiler/generate/index.js b/compiler/generate/index.js
index 0da39a932f..fa2ba7816a 100644
--- a/compiler/generate/index.js
+++ b/compiler/generate/index.js
@@ -14,6 +14,13 @@ export default function generate ( parsed, source, options ) {
 	const renderers = [];
 
 	const generator = {
+		appendToTarget ( name ) {
+			if ( generator.current.useAnchor && generator.current.target === 'target' ) {
+				return `anchor.parentNode.insertBefore( ${name}, anchor )`;
+			}
+			return `${generator.current.target}.appendChild( ${name} )`;
+		},
+
 		addRenderer ( fragment ) {
 			if ( fragment.autofocus ) {
 				fragment.initStatements.push( `${fragment.autofocus}.focus();` );
diff --git a/compiler/generate/visitors/EachBlock.js b/compiler/generate/visitors/EachBlock.js
index ac10ee361e..b2fe66ccac 100644
--- a/compiler/generate/visitors/EachBlock.js
+++ b/compiler/generate/visitors/EachBlock.js
@@ -15,7 +15,7 @@ export default {
 
 		generator.current.initStatements.push( deindent`
 			var ${name}_anchor = document.createComment( ${JSON.stringify( `#each ${generator.source.slice( node.expression.start, node.expression.end )}` )} );
-			${generator.current.target}.appendChild( ${name}_anchor );
+			${generator.appendToTarget( `${name}_anchor` )};
 
 			var ${name}_value = ${snippet};
 			var ${name}_fragment = document.createDocumentFragment();
diff --git a/compiler/generate/visitors/Element.js b/compiler/generate/visitors/Element.js
index 74ef9ced9d..2a55994f4d 100644
--- a/compiler/generate/visitors/Element.js
+++ b/compiler/generate/visitors/Element.js
@@ -166,14 +166,7 @@ export default {
 
 		if ( isComponent ) return;
 
-		if ( generator.current.useAnchor && generator.current.target === 'target' ) {
-			generator.current.initStatements.push( deindent`
-				anchor.parentNode.insertBefore( ${name}, anchor );
-			` );
-		} else {
-			generator.current.initStatements.push( deindent`
-				${generator.current.target}.appendChild( ${name} );
-			` );
-		}
+		generator.current.initStatements.push(
+			generator.appendToTarget( name ) );
 	}
 };
diff --git a/compiler/generate/visitors/IfBlock.js b/compiler/generate/visitors/IfBlock.js
index e7b31b5261..298c2e3457 100644
--- a/compiler/generate/visitors/IfBlock.js
+++ b/compiler/generate/visitors/IfBlock.js
@@ -15,7 +15,7 @@ export default {
 
 		generator.current.initStatements.push( deindent`
 			var ${name}_anchor = document.createComment( ${JSON.stringify( `#if ${generator.source.slice( node.expression.start, node.expression.end )}` )} );
-			${generator.current.target}.appendChild( ${name}_anchor );
+			${generator.appendToTarget( `${name}_anchor` )};
 		` );
 
 		if ( node.else ) {
diff --git a/compiler/generate/visitors/MustacheTag.js b/compiler/generate/visitors/MustacheTag.js
index 2a24027b14..7dc8244eee 100644
--- a/compiler/generate/visitors/MustacheTag.js
+++ b/compiler/generate/visitors/MustacheTag.js
@@ -8,7 +8,7 @@ export default {
 
 		generator.current.initStatements.push( deindent`
 			var ${name} = document.createTextNode( ${snippet} );
-			${generator.current.target}.appendChild( ${name} );
+			${generator.appendToTarget( name )};
 		` );
 
 		generator.addSourcemapLocations( node.expression );
diff --git a/compiler/generate/visitors/Text.js b/compiler/generate/visitors/Text.js
index 21ab063b19..1cb8fc62f7 100644
--- a/compiler/generate/visitors/Text.js
+++ b/compiler/generate/visitors/Text.js
@@ -11,7 +11,7 @@ export default {
 
 			generator.current.initStatements.push( deindent`
 				var ${name} = document.createTextNode( ${JSON.stringify( node.data )} );
-				${generator.current.target}.appendChild( ${name} );
+				${generator.appendToTarget( name )};
 			` );
 
 			generator.current.teardownStatements.push( deindent`
diff --git a/test/compiler/if-block-elseif-text/_config.js b/test/compiler/if-block-elseif-text/_config.js
new file mode 100644
index 0000000000..9ddec8563a
--- /dev/null
+++ b/test/compiler/if-block-elseif-text/_config.js
@@ -0,0 +1,23 @@
+export default {
+	data: {
+		x: 11
+	},
+
+	html: `
+		before-if-after
+	`,
+
+	test ( assert, component, target ) {
+		component.set({ x: 4 });
+		assert.htmlEqual( target.innerHTML, `
+			before-elseif-after
+		` );
+
+		component.set({ x: 6 });
+		assert.htmlEqual( target.innerHTML, `
+			before-else-after
+		` );
+
+		component.teardown();
+	}
+};
diff --git a/test/compiler/if-block-elseif-text/main.html b/test/compiler/if-block-elseif-text/main.html
new file mode 100644
index 0000000000..42fc0ca46f
--- /dev/null
+++ b/test/compiler/if-block-elseif-text/main.html
@@ -0,0 +1 @@
+before-{{#if x > 10}}if{{elseif x < 5}}elseif{{else}}else{{/if}}-after