template.ref must recursive to find the original source template

R=arv
BUG=

Review URL: https://codereview.appspot.com/9769044

src/template_element.js

@@ -866,11 +866,6 @@
     }
   }
 
-  function effectiveContent(template) {
-    var ref = template.ref;
-    return ref ? ref.content : template.content;
-  }
-
   var templateModelTable = new SideTable('templateModel');
 
   mixin(HTMLTemplateElement.prototype, {
@@ -920,8 +915,8 @@
     },
 
     createInstance: function(model, syntax) {
-      var content = effectiveContent(this);
-      var instance = createDeepCloneAndDecorateTemplates(content, syntax);
+      var instance = createDeepCloneAndDecorateTemplates(this.ref.content,
+                                                         syntax);
       // TODO(rafaelw): This is a hack, and is neccesary for the polyfil
       // because custom elements are not upgraded during cloneNode()
       if (typeof HTMLTemplateElement.__instanceCreated == 'function')
@@ -954,7 +949,11 @@
       if (!ref)
         ref = templateInstanceRefTable.get(this);
 
-      return ref || null;
+      if (!ref)
+        return this;
+
+      var nextRef = ref.ref;
+      return nextRef ? nextRef : ref;
     }
   });
 

tests/template_element.js

@@ -1372,6 +1372,23 @@ suite('Template Element', function() {
     assert.strictEqual('Name: Leela', div.childNodes[3].textContent);
   });
 
+  test('RecursiveRef', function() {
+    var div = createTestHtml(
+        '<template bind>' +
+          '<template id=src>{{ foo }}</template>' +
+          '<template bind ref=src></template>' +
+        '</template>');
+
+    var m = {
+      foo: 'bar'
+    };
+    recursivelySetTemplateModel(div, m);
+    Platform.performMicrotaskCheckpoint();
+
+    assert.strictEqual(4, div.childNodes.length);
+    assert.strictEqual('bar', div.childNodes[3].textContent);
+  });
+
   test('ChangeFromBindToRepeat', function() {
     var div = createTestHtml(
         '<template bind="{{a}}">' +