diff --git a/src/Template/Template.js b/src/Template/Template.js
index a2c4d094b..fbb09a9c8 100644
--- a/src/Template/Template.js
+++ b/src/Template/Template.js
@@ -33,6 +33,12 @@
     var contentDoc = document.implementation.createHTMLDocument('template');
     var canDecorate = true;
 
+    var templateStyle = document.createElement('style');
+    templateStyle.textContent = TEMPLATE_TAG + '{display:none;}';
+
+    var head = document.head;
+    head.insertBefore(templateStyle, head.firstElementChild);
+
     /**
       Provides a minimal shim for the <template> element.
     */
diff --git a/tests/Template/html/Template.html b/tests/Template/html/Template.html
deleted file mode 100644
index f3379b42b..000000000
--- a/tests/Template/html/Template.html
+++ /dev/null
@@ -1,72 +0,0 @@
-<!doctype html>
-<!--
-    @license
-    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
-    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
-    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
-    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
-    Code distributed by Google as part of the polymer project is also
-    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--->
-<html>
-  <head>
-    <title>Template Test</title>
-    <script src="../../tools/htmltest.js"></script>
-    <script src="../../tools/chai/chai.js"></script>
-    <script src="../../../src/Template/Template.js"></script>
-  </head>
-  <body>
-    <template>
-      <span id="content">Hello World!</span>
-    </template>
-
-    <script>
-      addEventListener('DOMContentLoaded', function() {
-        var template = document.querySelector('template');
-        chai.assert.equal(template.childNodes.length, 0, 'template children evacipated');
-        chai.assert.isDefined(template.content, 'template content exists');
-        chai.assert.equal(template.content.childNodes.length, 3, 'template content has expected number of nodes');
-        var content = document.querySelector('#content');
-        chai.assert.isNull(content, 'template content not in document');
-        document.body.appendChild(document.importNode(template.content, true));
-        content = document.querySelector('#content');
-        chai.assert.isDefined(content, 'template content stamped into document');
-        var imp = document.createElement('template');
-        window.imp = imp;
-        chai.assert.equal(imp.innerHTML, '');
-
-        var s = 'pre<div>Hi</div><div>Bye</div>post';
-        imp.innerHTML = s;
-        chai.assert.equal(imp.innerHTML, s);
-        chai.assert.equal(imp.content.childNodes.length, 4);
-        chai.assert.equal(imp.content.firstChild.textContent, 'pre');
-        s = 'foo';
-        imp.innerHTML = s;
-        chai.assert.equal(imp.innerHTML, s);
-        chai.assert.equal(imp.content.childNodes.length, 1);
-        chai.assert.equal(imp.content.firstChild.textContent, s);
-
-        s = 'pre<template><div id="inert"></div></template>post';
-        imp.innerHTML = s;
-        // NOTE: we don't support reading nested template content via innerHTML,
-        // only setting it, hence the following won't work:
-        // chai.assert.equal(imp.innerHTML, s);
-        chai.assert.equal(imp.content.childNodes.length, 3);
-        chai.assert.equal(imp.content.childNodes[0].textContent, 'pre');
-        chai.assert.equal(imp.content.childNodes[1].content.childNodes.length, 1);
-        chai.assert.equal(imp.content.childNodes[1].content.firstChild.id, 'inert');
-        chai.assert.equal(imp.content.childNodes[2].textContent, 'post');
-
-        s = '-<->-"-&-';
-        var escaped = '-&lt;-&gt;-"-&amp;-';
-        var div = document.createElement('div');
-        div.innerHTML = s
-        imp.innerHTML = s;
-        // innerHTML is properly escaped
-        chai.assert.equal(imp.innerHTML, escaped);
-        chai.assert.equal(imp.content.childNodes.length, div.childNodes.length);
-        done();
-      });
-    </script>
-  </body>
-</html>
diff --git a/tests/Template/tests.html b/tests/Template/tests.html
index 15686aabe..1c9a2c2e6 100644
--- a/tests/Template/tests.html
+++ b/tests/Template/tests.html
@@ -15,9 +15,20 @@
     <script src="../../../web-component-tester/browser.js"></script>
   </head>
   <body>
-    <template>
-      <span id="content">Hello World!</span>
-    </template>
+    <style>
+      .container {
+        display: flex;
+      }
+      .container > *{
+        flex: 1;
+      }
+    </style>
+
+    <div class="container">
+      <template>
+        <span id="content">Hello World!</span>
+      </template>
+    </div>
 
     <script>
       suite('Template', function() {
@@ -26,6 +37,12 @@
           template = document.querySelector('template');
         });
 
+        test('No rendering', function() {
+          var bcr = template.getBoundingClientRect();
+          assert.equal(bcr.height, 0);
+          assert.equal(bcr.width, 0);
+        });
+
         test('content', function() {
           assert.equal(template.childNodes.length, 0, 'template children evacipated');
           assert.isDefined(template.content, 'template content exists');
