diff --git a/test/iron-overlay-container.html b/test/iron-overlay-container.html
index 9489e74..c529121 100644
--- a/test/iron-overlay-container.html
+++ b/test/iron-overlay-container.html
@@ -10,120 +10,76 @@
 -->
 <html>
 
-  <head>
-
-    <title>iron-overlay-container tests</title>
-
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
-
-    <script src="../../webcomponentsjs/webcomponents-loader.js"></script>
-    <script src="../../web-component-tester/browser.js"></script>
-
-    <link rel="import" href="../../iron-test-helpers/iron-test-helpers.html">
-    <link rel="import" href="../iron-overlay-container.html">
-
-  </head>
-
-  <body>
-
-    <dom-module id="test-overlay">
-      <script>
-        HTMLImports.whenReady(function () {
-          class TestOverlay extends Polymer.Element {
-            static get is() {
-              return 'test-overlay';
-            }
-            _onTap() {}
-            _onEsc() {}
-
-            fireAttach() {
-              this.renderer = this.renderer || document.createElement('div');
-
-              var event = new Event('iron-overlay-attach', {
-                bubbles: true,
-                cancelable: true,
-                composed: true
-              });
-              event.detail = {
-                overlay: this
-              };
-              this.dispatchEvent(event);
-              return event;
-            }
-
-            fireDetach() {
-              var event = new Event('iron-overlay-detach', {
-                bubbles: true,
-                cancelable: true,
-                composed: true
-              });
-              event.detail = {
-                overlay: this
-              };
-              this.renderer.dispatchEvent(event);
-              return event;
-            }
-          }
-
-          customElements.define(TestOverlay.is, TestOverlay);
-        });
-      </script>
-    </dom-module>
-
-    <test-fixture id="basic">
-      <template>
-        <iron-overlay-container></iron-overlay-container>
-      </template>
-    </test-fixture>
-
-    <test-fixture id="overlays">
-      <template>
-        <test-overlay></test-overlay>
-        <test-overlay></test-overlay>
-      </template>
-    </test-fixture>
-
-    <script>
-
-      suite('<iron-overlay-container>', function () {
-        var container;
-        var overlay1;
-        var overlay2;
-
-        setup(function () {
-          container = fixture('basic');
-          var overlays = fixture('overlays');
-          overlay1 = overlays[0];
-          overlay2 = overlays[1];
-        });
-
-        test('handles iron-overlay-attach', function () {
-          assert.isTrue(overlay1.fireAttach().defaultPrevented, 'event handled');
-          assert.equal(overlay1.renderer.parentNode, container, 'renderer hosted');
-          assert.equal(overlay1, container.currentOverlay, 'currentOverlay updated');
-        });
-
-        test('handles iron-overlay-detach', function () {
-          overlay1.fireAttach();
-          assert.isTrue(overlay1.fireDetach().defaultPrevented, 'event handled');
-          assert.isNotOk(overlay1.renderer.parentNode, 'renderer detached');
-          assert.isNotOk(container.currentOverlay, 'currentOverlay updated');
-        });
-
-        test('detach and attach to bring overlay on top', function () {
-          overlay1.fireAttach();
-          overlay2.fireAttach();
-          assert.equal(overlay2, container.currentOverlay, 'renderer2 on top');
-          // Bring overlay1 on top.
-          overlay1.fireDetach();
-          overlay1.fireAttach();
-          assert.equal(overlay1, container.currentOverlay, 'renderer1 on top');
-        });
+<head>
+
+  <title>iron-overlay-container tests</title>
+
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
+
+  <script src="../../webcomponentsjs/webcomponents-loader.js"></script>
+  <script src="../../web-component-tester/browser.js"></script>
+
+  <link rel="import" href="../../iron-test-helpers/iron-test-helpers.html">
+  <link rel="import" href="../iron-overlay-container.html">
+  <link rel="import" href="test-overlay.html">
+
+</head>
+
+<body>
+
+  <test-fixture id="basic">
+    <template>
+      <iron-overlay-container></iron-overlay-container>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="overlays">
+    <template>
+      <test-overlay></test-overlay>
+      <test-overlay></test-overlay>
+    </template>
+  </test-fixture>
+
+  <script>
+    suite('<iron-overlay-container>', function() {
+      var container;
+      var overlay1;
+      var overlay2;
+
+      setup(function() {
+        container = fixture('basic');
+        var overlays = fixture('overlays');
+        overlay1 = overlays[0];
+        overlay2 = overlays[1];
+      });
+
+      test('handles iron-overlay-attach', function() {
+        assert.isTrue(overlay1.fireAttach().defaultPrevented, 'event handled');
+        assert.equal(overlay1.renderer.parentNode, container, 'renderer hosted');
+        assert.equal(overlay1, container.currentOverlay, 'currentOverlay updated');
+      });
+
+      test('handles iron-overlay-detach', function() {
+        overlay1.fireAttach();
+        assert.isTrue(overlay1.fireDetach().defaultPrevented, 'event handled');
+        assert.isNotOk(overlay1.renderer.parentNode, 'renderer detached');
+        assert.isNotOk(container.currentOverlay, 'currentOverlay updated');
+      });
+
+      test('detach and attach to bring overlay on top', function() {
+        overlay1.fireAttach();
+        overlay2.fireAttach();
+        assert.equal(overlay2, container.currentOverlay, 'renderer2 on top');
+        // Bring overlay1 on top.
+        overlay1.fireDetach();
+        overlay1.fireAttach();
+        assert.equal(overlay1, container.currentOverlay, 'renderer1 on top');
       });
-    </script>
+    });
+  </script>
 
-  </body>
+</body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/test/iron-overlay.html b/test/iron-overlay.html
index cf82e6d..26d6088 100644
--- a/test/iron-overlay.html
+++ b/test/iron-overlay.html
@@ -10,428 +10,431 @@
 -->
 <html>
 
-  <head>
-
-    <title>iron-overlay tests</title>
-
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
-
-    <script src="../../webcomponentsjs/webcomponents-loader.js"></script>
-    <script src="../../web-component-tester/browser.js"></script>
-
-    <link rel="import" href="../../iron-test-helpers/iron-test-helpers.html">
-    <link rel="import" href="../iron-overlay.html">
-    <style>
-      html { overflow: hidden; }
-    </style>
-  </head>
-
-  <body>
-
-    <test-fixture id="basic">
-      <template>
-        <iron-overlay>
-          <template>
-            Basic Overlay
-            <button autofocus>autofocused</button>
-          </template>
-        </iron-overlay>
-      </template>
-    </test-fixture>
-
-    <test-fixture id="opened">
-      <template>
-        <iron-overlay opened>
-          <template>
-            Basic Overlay
-          </template>
-        </iron-overlay>
-      </template>
-    </test-fixture>
-
-    <test-fixture id="multiple">
-      <template>
-        <iron-overlay class="overlay-1">
-          <template>
-            Test overlay 1
-          </template>
-        </iron-overlay>
-        <iron-overlay class="overlay-2">
-          <template>
-            Test overlay 2
-            <button>Click</button>
-          </template>
-        </iron-overlay>
-        <iron-overlay class="overlay-3">
-          <template>
-            Other overlay 3
-          </template>
-        </iron-overlay>
-      </template>
-    </test-fixture>
-
-    <test-fixture id="buttons">
-      <template>
-        <button>button</button>
-        <button>button</button>
-      </template>
-    </test-fixture>
-
-    <script>
-
-      var overlay;
-
-      function runAfterOpen(overlay, callback) {
-        overlay.addEventListener('iron-overlay-opened', callback);
-        overlay.opened = true;
-      }
+<head>
+
+  <title>iron-overlay tests</title>
+
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
+
+  <script src="../../webcomponentsjs/webcomponents-loader.js"></script>
+  <script src="../../web-component-tester/browser.js"></script>
+
+  <link rel="import" href="../../iron-test-helpers/iron-test-helpers.html">
+  <link rel="import" href="../iron-overlay.html">
+  <style>
+    html {
+      overflow: hidden;
+    }
+  </style>
+</head>
+
+<body>
+
+  <test-fixture id="basic">
+    <template>
+      <iron-overlay>
+        <template>
+          Basic Overlay
+          <button autofocus>autofocused</button>
+        </template>
+      </iron-overlay>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="opened">
+    <template>
+      <iron-overlay opened>
+        <template>
+          Basic Overlay
+        </template>
+      </iron-overlay>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="multiple">
+    <template>
+      <iron-overlay class="overlay-1">
+        <template>
+          Test overlay 1
+        </template>
+      </iron-overlay>
+      <iron-overlay class="overlay-2">
+        <template>
+          Test overlay 2
+          <button>Click</button>
+        </template>
+      </iron-overlay>
+      <iron-overlay class="overlay-3">
+        <template>
+          Other overlay 3
+        </template>
+      </iron-overlay>
+    </template>
+  </test-fixture>
+
+  <test-fixture id="buttons">
+    <template>
+      <button>button</button>
+      <button>button</button>
+    </template>
+  </test-fixture>
+
+  <script>
+    var overlay;
+
+    function runAfterOpen(overlay, callback) {
+      overlay.addEventListener('iron-overlay-opened', callback);
+      overlay.opened = true;
+    }
+
+    function runAfterClose(overlay, callback) {
+      overlay.addEventListener('iron-overlay-closed', callback);
+      overlay.opened = false;
+    }
+
+    suite('basic overlay', function() {
+
+      setup(function() {
+        overlay = fixture('basic');
+      });
 
-      function runAfterClose(overlay, callback) {
-        overlay.addEventListener('iron-overlay-closed', callback);
-        overlay.opened = false;
-      }
+      test('overlay starts hidden', function() {
+        assert.isNotOk(overlay.opened, 'overlay starts closed');
+        assert.isNotOk(overlay.renderer, 'overlay w/o renderer');
+      });
 
-      suite('basic overlay', function () {
+      test('overlay creates and opens the renderer', function() {
+        overlay.opened = true;
+        assert.isOk(overlay.renderer, 'renderer initialized');
+        assert.isTrue(overlay.renderer.opened, 'renderer opened');
+      });
 
-        setup(function () {
-          overlay = fixture('basic');
+      test('overlay delegates renderer hosting via iron-overlay-attach', function(done) {
+        overlay.addEventListener('iron-overlay-attach', function(event) {
+          assert.isTrue(event.bubbles, 'bubbling event');
+          assert.isTrue(event.cancelable, 'cancelable event');
+          assert.deepEqual(event.detail, {
+            overlay: overlay
+          }, 'detail contains overlay and renderer');
+          done();
         });
+        overlay.opened = true;
+      });
 
-        test('overlay starts hidden', function () {
-          assert.isNotOk(overlay.opened, 'overlay starts closed');
-          assert.isNotOk(overlay.renderer, 'overlay w/o renderer');
-        });
+      test('overlay renderer attached on body', function() {
+        overlay.opened = true;
+        assert.isTrue(document.body.contains(overlay.renderer), 'renderer attached to body');
+      });
 
-        test('overlay creates and opens the renderer', function () {
-          overlay.opened = true;
-          assert.isOk(overlay.renderer, 'renderer initialized');
-          assert.isTrue(overlay.renderer.opened, 'renderer opened');
+      test('overlay fires iron-overlay-opened', function(done) {
+        var spy = sinon.stub();
+        overlay.addEventListener('iron-overlay-opened', spy);
+        runAfterOpen(overlay, function() {
+          assert.isTrue(spy.calledOnce, 'opened event fired once');
+          done();
         });
+      });
 
-        test('overlay delegates renderer hosting via iron-overlay-attach', function (done) {
-          overlay.addEventListener('iron-overlay-attach', function (event) {
-            assert.isTrue(event.bubbles, 'bubbling event');
-            assert.isTrue(event.cancelable, 'cancelable event');
-            assert.deepEqual(event.detail, {
-              overlay: overlay
-            }, 'detail contains overlay and renderer');
+      test('overlay fires iron-overlay-closed', function(done) {
+        var spy = sinon.stub();
+        overlay.addEventListener('iron-overlay-opened', spy);
+        overlay.addEventListener('iron-overlay-closed', spy);
+        runAfterOpen(overlay, function() {
+          runAfterClose(overlay, function() {
+            assert.isTrue(spy.calledTwice, 'opened and closed events fired');
             done();
           });
-          overlay.opened = true;
-        });
-
-        test('overlay renderer attached on body', function () {
-          overlay.opened = true;
-          assert.isTrue(document.body.contains(overlay.renderer), 'renderer attached to body');
         });
+      });
 
-        test('overlay fires iron-overlay-opened', function (done) {
-          var spy = sinon.stub();
-          overlay.addEventListener('iron-overlay-opened', spy);
-          runAfterOpen(overlay, function() {
-            assert.isTrue(spy.calledOnce, 'opened event fired once');
+      test('close an overlay quickly after open', function(done) {
+        // first, open the overlay
+        overlay.opened = true;
+        setTimeout(function() {
+          // during the opening transition, close the overlay
+          this.opened = false;
+          // wait for any exceptions to be thrown until the transition is done.
+          setTimeout(function() {
             done();
-          });
+          }, 300);
         });
+      });
 
-        test('overlay fires iron-overlay-closed', function (done) {
+      test('clicking an overlay does not close it', function(done) {
+        runAfterOpen(overlay, function() {
           var spy = sinon.stub();
-          overlay.addEventListener('iron-overlay-opened', spy);
           overlay.addEventListener('iron-overlay-closed', spy);
-          runAfterOpen(overlay, function() {
-            runAfterClose(overlay, function() {
-              assert.isTrue(spy.calledTwice, 'opened and closed events fired');
-              done();
-            });
-          });
+          MockInteractions.tap(overlay.renderer.$.overlay);
+          setTimeout(function() {
+            assert.isFalse(spy.called, 'iron-overlay-closed should not fire');
+            done();
+          }, 100);
         });
+      });
 
-        test('close an overlay quickly after open', function (done) {
-          // first, open the overlay
-          overlay.opened = true;
-          setTimeout(function () {
-            // during the opening transition, close the overlay
-            this.opened = false;
-            // wait for any exceptions to be thrown until the transition is done.
-            setTimeout(function () {
-              done();
-            }, 300);
+      test('open overlay on mousedown does not close it', function(done) {
+        var btn = document.createElement('button');
+        btn.addEventListener('mousedown', overlay.open.bind(overlay));
+        document.body.appendChild(btn);
+        // It triggers mousedown, mouseup, and click.
+        MockInteractions.tap(btn);
+        document.body.removeChild(btn);
+
+        assert.isTrue(overlay.opened, 'overlay opened');
+        setTimeout(function() {
+          assert.isTrue(overlay.opened, 'overlay is still open');
+          done();
+        }, 10);
+      });
+
+      test('clicking outside fires iron-overlay-canceled', function(done) {
+        runAfterOpen(overlay, function() {
+          overlay.addEventListener('iron-overlay-canceled', function(event) {
+            assert.equal(event.detail.target, document.body, 'detail contains original click event');
+            done();
           });
+          MockInteractions.tap(document.body);
         });
+      });
 
-        test('clicking an overlay does not close it', function (done) {
-          runAfterOpen(overlay, function () {
-            var spy = sinon.stub();
-            overlay.addEventListener('iron-overlay-closed', spy);
-            MockInteractions.tap(overlay.renderer.$.overlay);
-            setTimeout(function () {
-              assert.isFalse(spy.called, 'iron-overlay-closed should not fire');
-              done();
-            }, 100);
+      test('clicking outside closes the overlay', function(done) {
+        runAfterOpen(overlay, function() {
+          overlay.addEventListener('iron-overlay-closed', function(event) {
+            assert.isTrue(event.detail.canceled, 'overlay is canceled');
+            done();
           });
+          MockInteractions.tap(document.body);
         });
+      });
 
-        test('open overlay on mousedown does not close it', function (done) {
-          var btn = document.createElement('button');
-          btn.addEventListener('mousedown', overlay.open.bind(overlay));
-          document.body.appendChild(btn);
-          // It triggers mousedown, mouseup, and click.
-          MockInteractions.tap(btn);
-          document.body.removeChild(btn);
-
-          assert.isTrue(overlay.opened, 'overlay opened');
-          setTimeout(function () {
+      test('iron-overlay-canceled event can be prevented', function(done) {
+        runAfterOpen(overlay, function() {
+          overlay.addEventListener('iron-overlay-canceled', function(event) {
+            event.preventDefault();
+          });
+          var spy = sinon.stub();
+          overlay.addEventListener('iron-overlay-closed', spy);
+          MockInteractions.tap(document.body);
+          setTimeout(function() {
             assert.isTrue(overlay.opened, 'overlay is still open');
+            assert.isFalse(spy.called, 'iron-overlay-closed not fired');
             done();
           }, 10);
         });
+      });
 
-        test('clicking outside fires iron-overlay-canceled', function (done) {
-          runAfterOpen(overlay, function () {
-            overlay.addEventListener('iron-overlay-canceled', function (event) {
-              assert.equal(event.detail.target, document.body, 'detail contains original click event');
-              done();
-            });
-            MockInteractions.tap(document.body);
+      test('cancel an overlay with esc key', function(done) {
+        runAfterOpen(overlay, function() {
+          overlay.addEventListener('iron-overlay-canceled', function(event) {
+            assert.equal(event.detail.type, 'keydown');
+            done();
           });
+          MockInteractions.pressAndReleaseKeyOn(document, 27);
         });
+      });
 
-        test('clicking outside closes the overlay', function (done) {
-          runAfterOpen(overlay, function () {
-            overlay.addEventListener('iron-overlay-closed', function (event) {
-              assert.isTrue(event.detail.canceled, 'overlay is canceled');
-              done();
-            });
-            MockInteractions.tap(document.body);
+      test('close an overlay with esc key', function(done) {
+        runAfterOpen(overlay, function() {
+          overlay.addEventListener('iron-overlay-closed', function(event) {
+            assert.isTrue(event.detail.canceled, 'overlay is canceled');
+            done();
           });
+          MockInteractions.pressAndReleaseKeyOn(document, 27);
         });
+      });
 
-        test('iron-overlay-canceled event can be prevented', function (done) {
-          runAfterOpen(overlay, function () {
-            overlay.addEventListener('iron-overlay-canceled', function (event) {
-              event.preventDefault();
-            });
-            var spy = sinon.stub();
-            overlay.addEventListener('iron-overlay-closed', spy);
-            MockInteractions.tap(document.body);
-            setTimeout(function () {
-              assert.isTrue(overlay.opened, 'overlay is still open');
-              assert.isFalse(spy.called, 'iron-overlay-closed not fired');
-              done();
-            }, 10);
-          });
+      test('no-cancel-on-outside-click property', function(done) {
+        overlay.noCancelOnOutsideClick = true;
+        runAfterOpen(overlay, function() {
+          var spy = sinon.stub();
+          overlay.addEventListener('iron-overlay-closed', spy);
+          MockInteractions.tap(document.body);
+          setTimeout(function() {
+            assert.isFalse(spy.called, 'iron-overlay-closed should not fire');
+            done();
+          }, 10);
         });
+      });
 
-        test('cancel an overlay with esc key', function (done) {
-          runAfterOpen(overlay, function () {
-            overlay.addEventListener('iron-overlay-canceled', function (event) {
-              assert.equal(event.detail.type, 'keydown');
-              done();
-            });
-            MockInteractions.pressAndReleaseKeyOn(document, 27);
-          });
+      test('no-cancel-on-esc-key property', function(done) {
+        overlay.noCancelOnEscKey = true;
+        runAfterOpen(overlay, function() {
+          var spy = sinon.stub();
+          overlay.addEventListener('iron-overlay-closed', spy);
+          MockInteractions.pressAndReleaseKeyOn(document, 27);
+          setTimeout(function() {
+            assert.isFalse(spy.called, 'iron-overlay-cancel should not fire');
+            done();
+          }, 10);
         });
+      });
 
-        test('close an overlay with esc key', function (done) {
-          runAfterOpen(overlay, function () {
-            overlay.addEventListener('iron-overlay-closed', function (event) {
-              assert.isTrue(event.detail.canceled, 'overlay is canceled');
-              done();
-            });
-            MockInteractions.pressAndReleaseKeyOn(document, 27);
-          });
-        });
+    });
 
-        test('no-cancel-on-outside-click property', function (done) {
-          overlay.noCancelOnOutsideClick = true;
-          runAfterOpen(overlay, function () {
-            var spy = sinon.stub();
-            overlay.addEventListener('iron-overlay-closed', spy);
-            MockInteractions.tap(document.body);
-            setTimeout(function () {
-              assert.isFalse(spy.called, 'iron-overlay-closed should not fire');
-              done();
-            }, 10);
-          });
-        });
+    suite('opened overlay', function() {
 
-        test('no-cancel-on-esc-key property', function (done) {
-          overlay.noCancelOnEscKey = true;
-          runAfterOpen(overlay, function () {
-            var spy = sinon.stub();
-            overlay.addEventListener('iron-overlay-closed', spy);
-            MockInteractions.pressAndReleaseKeyOn(document, 27);
-            setTimeout(function () {
-              assert.isFalse(spy.called, 'iron-overlay-cancel should not fire');
-              done();
-            }, 10);
-          });
-        });
+      setup(function() {
+        overlay = fixture('opened');
+      });
 
+      test('overlay open by default', function() {
+        assert.isTrue(overlay.opened, 'overlay starts opened');
+        assert.isOk(overlay.renderer, 'overlay has a renderer');
       });
 
-      suite('opened overlay', function () {
+      test('overlay positioned & sized properly', function(done) {
+        setTimeout(function() {
+          var rect = overlay.renderer.$.overlay.getBoundingClientRect();
+          assert.closeTo(rect.left, (window.innerWidth - rect.width) / 2, 1, 'centered horizontally');
+          assert.closeTo(rect.top, (window.innerHeight - rect.height) / 2, 1, 'centered vertically');
+          done();
+        }, 10);
+      });
+    });
 
-        setup(function () {
-          overlay = fixture('opened');
-        });
+    suite('focus handling', function() {
 
-        test('overlay open by default', function () {
-          assert.isTrue(overlay.opened, 'overlay starts opened');
-          assert.isOk(overlay.renderer, 'overlay has a renderer');
-        });
+      setup(function() {
+        overlay = fixture('basic');
+      });
 
-        test('overlay positioned & sized properly', function (done) {
-          setTimeout(function () {
-            var rect = overlay.renderer.$.overlay.getBoundingClientRect();
-            assert.closeTo(rect.left, (window.innerWidth - rect.width) / 2, 1, 'centered horizontally');
-            assert.closeTo(rect.top, (window.innerHeight - rect.height) / 2, 1, 'centered vertically');
-            done();
-          }, 10);
+      test('node with autofocus is focused', function(done) {
+        runAfterOpen(overlay, function() {
+          assert.isTrue(overlay.renderer.contains(document.activeElement), '<button autofocus> is focused');
+          done();
         });
       });
 
-      suite('focus handling', function () {
-
-        setup(function () {
-          overlay = fixture('basic');
+      test('no-auto-focus will not focus node with autofocus', function(done) {
+        overlay.noAutoFocus = true;
+        runAfterOpen(overlay, function() {
+          assert.isFalse(overlay.renderer.contains(document.activeElement), document.activeElement,
+            '<button autofocus> not focused after opened');
+          done();
         });
+        // In Safari the element with autofocus will immediately receive focus when displayed for the first time http://jsbin.com/woroci/2/ Ensure this is not the case for overlay.
+        assert.isFalse(overlay.renderer.contains(document.activeElement),
+          '<button autofocus> not immediately focused');
+      });
 
-        test('node with autofocus is focused', function (done) {
-          runAfterOpen(overlay, function () {
-            assert.isTrue(overlay.renderer.contains(document.activeElement), '<button autofocus> is focused');
-            done();
-          });
-        });
+      test('with-backdrop traps the focus within the overlay', function() {
+        if (document.$blockingElements) {
+          overlay.withBackdrop = true;
+          assert.isFalse(document.$blockingElements.has(overlay), 'not a blocking element when closed');
+          overlay.opened = true;
+          assert.isTrue(document.$blockingElements.has(overlay), 'is a blocking element when opened');
+        }
+      });
 
-        test('no-auto-focus will not focus node with autofocus', function (done) {
-          overlay.noAutoFocus = true;
-          runAfterOpen(overlay, function () {
-            assert.isFalse(overlay.renderer.contains(document.activeElement), document.activeElement, '<button autofocus> not focused after opened');
-            done();
-          });
-          // In Safari the element with autofocus will immediately receive focus when displayed for the first time http://jsbin.com/woroci/2/ Ensure this is not the case for overlay.
-          assert.isFalse(overlay.renderer.contains(document.activeElement), '<button autofocus> not immediately focused');
-        });
 
-        test('with-backdrop traps the focus within the overlay', function () {
-          if (document.$blockingElements) {
-            overlay.withBackdrop = true;
-            assert.isFalse(document.$blockingElements.has(overlay), 'not a blocking element when closed');
-            overlay.opened = true;
-            assert.isTrue(document.$blockingElements.has(overlay), 'is a blocking element when opened');
-          }
+      suite('restore focus', function() {
+        let buttons;
+        setup(function() {
+          buttons = fixture('buttons');
         });
 
-
-        suite('restore focus', function() {
-          let buttons;
-          setup(function() {
-            buttons = fixture('buttons');
-          });
-
-          test('restores focus to previous focusable', function (done) {
-            buttons[0].focus();
-            runAfterOpen(overlay, function () {
-              runAfterClose(overlay, function () {
-                assert.equal(document.activeElement, buttons[0], 'focus returned to button');
-                done();
-              });
+        test('restores focus to previous focusable', function(done) {
+          buttons[0].focus();
+          runAfterOpen(overlay, function() {
+            runAfterClose(overlay, function() {
+              assert.equal(document.activeElement, buttons[0], 'focus returned to button');
+              done();
             });
           });
+        });
 
-          test('avoids restoring focus if focus changed', function (done) {
-            buttons[0].focus();
-            runAfterOpen(overlay, function () {
-              buttons[1].focus();
-              runAfterClose(overlay, function () {
-                assert.equal(document.activeElement, buttons[1], 'focus was not modified');
-                done();
-              });
+        test('avoids restoring focus if focus changed', function(done) {
+          buttons[0].focus();
+          runAfterOpen(overlay, function() {
+            buttons[1].focus();
+            runAfterClose(overlay, function() {
+              assert.equal(document.activeElement, buttons[1], 'focus was not modified');
+              done();
             });
           });
         });
-
       });
 
-      suite('multiple overlays', function () {
-        var overlay1,
-          overlay2;
+    });
 
-        setup(function () {
-          var f = fixture('multiple');
-          overlay1 = f[0];
-          overlay2 = f[1];
-        });
+    suite('multiple overlays', function() {
+      var overlay1,
+        overlay2;
 
-        test('ESC closes only the top overlay', function (done) {
-          runAfterOpen(overlay1, function () {
-            runAfterOpen(overlay2, function () {
-              MockInteractions.pressAndReleaseKeyOn(document, 27);
-              assert.isFalse(overlay2.opened, 'overlay2 was closed');
-              assert.isTrue(overlay1.opened, 'overlay1 is still opened');
-              done();
-            });
+      setup(function() {
+        var f = fixture('multiple');
+        overlay1 = f[0];
+        overlay2 = f[1];
+      });
+
+      test('ESC closes only the top overlay', function(done) {
+        runAfterOpen(overlay1, function() {
+          runAfterOpen(overlay2, function() {
+            MockInteractions.pressAndReleaseKeyOn(document, 27);
+            assert.isFalse(overlay2.opened, 'overlay2 was closed');
+            assert.isTrue(overlay1.opened, 'overlay1 is still opened');
+            done();
           });
         });
+      });
 
-        test('ESC event handling is delegated to interested overlay', function (done) {
-          overlay2.noCancelOnEscKey = true;
-          runAfterOpen(overlay1, function () {
-            runAfterOpen(overlay2, function () {
-              MockInteractions.pressAndReleaseKeyOn(document, 27);
-              assert.isTrue(overlay2.opened, 'overlay2 still opened');
-              assert.isFalse(overlay1.opened, 'overlay1 closed');
-              done();
-            });
+      test('ESC event handling is delegated to interested overlay', function(done) {
+        overlay2.noCancelOnEscKey = true;
+        runAfterOpen(overlay1, function() {
+          runAfterOpen(overlay2, function() {
+            MockInteractions.pressAndReleaseKeyOn(document, 27);
+            assert.isTrue(overlay2.opened, 'overlay2 still opened');
+            assert.isFalse(overlay1.opened, 'overlay1 closed');
+            done();
           });
         });
+      });
 
-        test('tap event handling is delegated to interested overlay', function (done) {
-          overlay2.noCancelOnOutsideClick = true;
-          runAfterOpen(overlay1, function () {
-            runAfterOpen(overlay2, function () {
-              MockInteractions.tap(document.body);
-              assert.isTrue(overlay2.opened, 'overlay2 still opened');
-              assert.isFalse(overlay1.opened, 'overlay1 closed');
-              done();
-            });
+      test('tap event handling is delegated to interested overlay', function(done) {
+        overlay2.noCancelOnOutsideClick = true;
+        runAfterOpen(overlay1, function() {
+          runAfterOpen(overlay2, function() {
+            MockInteractions.tap(document.body);
+            assert.isTrue(overlay2.opened, 'overlay2 still opened');
+            assert.isFalse(overlay1.opened, 'overlay1 closed');
+            done();
           });
         });
+      });
 
-        test('button tap event handling closes only top overlay', function (done) {
-          overlay2.noCancelOnOutsideClick = true;
-          runAfterOpen(overlay1, function () {
-            runAfterOpen(overlay2, function () {
-              const button = overlay2.renderer.querySelector('button');
-              button.addEventListener('tap', overlay2.close.bind(overlay2));
-              MockInteractions.tap(button);
-              assert.isFalse(overlay2.opened, 'overlay2 closed');
-              assert.isTrue(overlay1.opened, 'overlay1 still opened');
-              done();
-            });
+      test('button tap event handling closes only top overlay', function(done) {
+        overlay2.noCancelOnOutsideClick = true;
+        runAfterOpen(overlay1, function() {
+          runAfterOpen(overlay2, function() {
+            const button = overlay2.renderer.querySelector('button');
+            button.addEventListener('tap', overlay2.close.bind(overlay2));
+            MockInteractions.tap(button);
+            assert.isFalse(overlay2.opened, 'overlay2 closed');
+            assert.isTrue(overlay1.opened, 'overlay1 still opened');
+            done();
           });
         });
+      });
 
-        test('close an overlay in proximity to another overlay', function (done) {
-          // Open and close a separate overlay.
-          overlay1.opened = true;
-          overlay1.opened = false;
-
-          // Open the overlay we care about.
-          overlay2.opened = true;
+      test('close an overlay in proximity to another overlay', function(done) {
+        // Open and close a separate overlay.
+        overlay1.opened = true;
+        overlay1.opened = false;
 
-          // Immediately close the first overlay. Wait for infinite recursion, otherwise we win.
-          runAfterClose(overlay2, function () {
-            done();
-          })
-        });
+        // Open the overlay we care about.
+        overlay2.opened = true;
 
+        // Immediately close the first overlay. Wait for infinite recursion, otherwise we win.
+        runAfterClose(overlay2, function() {
+          done();
+        })
       });
-    </script>
 
-  </body>
+    });
+  </script>
+
+</body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/test/test-overlay.html b/test/test-overlay.html
new file mode 100644
index 0000000..afb9d0d
--- /dev/null
+++ b/test/test-overlay.html
@@ -0,0 +1,48 @@
+<!--
+@license
+Copyright (c) 2017 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
+-->
+
+<script>
+  (() => {
+    'use strict';
+
+    customElements.define('test-overlay', class TestOverlay extends HTMLElement {
+      _onTap() {}
+      _onEsc() {}
+
+      fireAttach() {
+        this.renderer = this.renderer || document.createElement('div');
+
+        var event = new Event('iron-overlay-attach', {
+          bubbles: true,
+          cancelable: true,
+          composed: true
+        });
+        event.detail = {
+          overlay: this
+        };
+        this.dispatchEvent(event);
+        return event;
+      }
+
+      fireDetach() {
+        var event = new Event('iron-overlay-detach', {
+          bubbles: true,
+          cancelable: true,
+          composed: true
+        });
+        event.detail = {
+          overlay: this
+        };
+        this.renderer.dispatchEvent(event);
+        return event;
+      }
+    });
+  })();
+</script>
\ No newline at end of file
