Merge pull request #104 from PolymerElements/issue-80

Fix issue #80
PolymerElements · Jun 21, 2016 · c1b5d49 · c1b5d49
2 parents 4db2470 + 3890f54
commit c1b5d49
Showing 1 changed file with 24 additions and 2 deletions.
diff --git a/iron-component-page.html b/iron-component-page.html
@@ -545,17 +545,39 @@ <h2><span>[[active]]</span> <span class="version" hidden$="[[!version]]">[[versi
 
           var src = view.split(':')[1];
           var demoSrc = new URL(src, this.base).toString();
+          var self = this;
 
           // If you use history.pushState with iframe.src = url, you will create 2 history entries,
           // but creating a new iframe dynamically will prevent it.
-
           if (this._iframe) {
             Polymer.dom(this.$.demo).removeChild(this._iframe);
           }
-
           this._iframe = document.createElement('iframe');
           this._iframe.src = demoSrc;
           this._iframe.allowFullscreen = true;
+
+          // Fixes iron-component-page/issues/80
+          // Scrollbar issue in desktop/mobile Safari that prevents the user
+          // from scrolling the demos. In this case, we need to force layout
+          // in the main document when the iframe content has been fully rendered.
+          this._iframe.style.height = '0%';
+          this._iframe.addEventListener('load', function() {
+            var win = self._iframe.contentWindow;
+            if (win.HTMLImports) {
+              win.HTMLImports.whenReady(function() {
+                if (win.Polymer) {
+                  win.Polymer.RenderStatus.afterNextRender(self, function() {
+                    self._iframe.style.height = '100%';
+                  });
+                } else {
+                  self._iframe.style.height = '100%';
+                }
+              });
+            } else {
+              self._iframe.style.height = '100%';
+            }
+          });
+
           Polymer.dom(this.$.demo).appendChild(this._iframe);
         },