Merge pull request #31 from Swatinem/insert-before-anchor

correctly insert non-element children before an anchor
sveltejs · Nov 29, 2016 · 36a4bef · 36a4bef
2 parents ad4726c + b63a54b
commit 36a4bef
Show file tree

Hide file tree

Showing 8 changed files with 37 additions and 13 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -0,0 +1 @@
+before-{{#if x > 10}}if{{elseif x < 5}}elseif{{else}}else{{/if}}-after