Add initial support for {{yield}}

compiler/generate/index.js

@@ -489,6 +489,10 @@ export default function generate ( parsed, source, options ) {
 				state = {};
 			};
 
+			this.appendChild = function appendChild ( child ) {
+				this.yield.appendChild(child)
+			}
+
 			${initStatements.join( '\n\n' )}
 		}
 	` );

compiler/generate/visitors/MustacheTag.js

@@ -3,14 +3,20 @@ import deindent from '../utils/deindent.js';
 export default {
 	enter ( generator, node ) {
 		const name = generator.current.counter( 'text' );
+		const { snippet } = generator.contextualise( node.expression );
 
 		generator.addSourcemapLocations( node.expression );
-		const { snippet } = generator.contextualise( node.expression );
 
+		if (node.expression.name === 'yield') {
+			generator.current.initStatements.push( deindent`
+				component.yield = ${generator.current.target};
+			` );
+		} else {
 			generator.addElement( name, `document.createTextNode( ${snippet} )`, true );
 
 			generator.current.updateStatements.push( deindent`
 				${name}.data = ${snippet};
 			` );
 		}
+	}
 };

test/compiler/component-yield/Widget.html

@@ -0,0 +1 @@
+<div class="sidebar-widget">{{yield}}</div>

test/compiler/component-yield/_config.js

@@ -0,0 +1,8 @@
+export default {
+	html: '<main><div class="sidebar-widget">Hello Hello</div></main>',
+	test ( assert, component, target ) {
+		component.set({ a: 'World' });
+		assert.equal( component.get( 'a' ), 'World' );
+		assert.equal( target.innerHTML, '<main><div class="sidebar-widget">Hello World</div></main>' );
+	}
+};

test/compiler/component-yield/main.html

@@ -0,0 +1,16 @@
+<main>
+  <Widget>Hello {{a}}</Widget>
+</main>
+
+<script>
+	import Widget from './Widget.html';
+
+	export default {
+		components: { Widget },
+    data(){
+      return {
+        a: "Hello"
+      }
+    }
+	};
+</script>