Add shadowRootReady callback for SkyElement.

This is called right after stamping the template into the ShadowRoot.
This is a useful place to querySelector/getElementById for elements
inside the ShadowRoot.

R=eseidel@chromium.org

Review URL: https://codereview.chromium.org/817053002

framework/sky-element/sky-element.sky

@@ -44,6 +44,10 @@ class SkyElement extends HTMLElement {
     // override
   }
 
+  shadowRootReady() {
+    // override
+  }
+
   createdCallback() {
     this.created();
   }
@@ -54,6 +58,7 @@ class SkyElement extends HTMLElement {
       if (template) {
         var shadow = this.ensureShadowRoot();
         shadow.appendChild(template.createInstance(this));
+        this.shadowRootReady();
       }
     }
     this.attached();

tests/framework/templates-expected.txt

@@ -1,7 +1,8 @@
-Running 3 tests
+Running 4 tests
 ok 1 SkyElement templates should stamp when the element is inserted
 ok 2 SkyElement templates should connect data binding
 ok 3 SkyElement templates should connect event handlers
-3 tests
-3 pass
+ok 4 SkyElement templates should call shadowRootReady after creating the template instance
+4 tests
+4 pass
 0 fail

tests/framework/templates.sky

@@ -49,6 +49,15 @@ describe("SkyElement templates", function() {
     inside.dispatchEvent(event);
     assert.equal(element.lastEvent, event);
   });
+
+  it("should call shadowRootReady after creating the template instance", function() {
+    assert.equal(element.shadowRootReadyCount, 0);
+    sandbox.appendChild(element);
+    assert.equal(element.shadowRootReadyCount, 1);
+    element.remove();
+    sandbox.appendChild(element);
+    assert.equal(element.shadowRootReadyCount, 1);
+  });
 });
 </script>
 </sky>

tests/resources/test-element.sky

@@ -14,10 +14,14 @@ module.exports = class extends SkyElement {
   created() {
     this.lastEvent = null;
     this.value = 10;
+    this.shadowRootReadyCount = 0;
   }
   handleEvent(event) {
     this.lastEvent = event;
   }
+  shadowRootReady() {
+    this.shadowRootReadyCount++;
+  }
 }.register();
 </script>
 </sky-element>