PolymerElements / iron-component-page

A reusable landing page for elements
36 stars 32 forks source link

iframes in Safari #80

Open blasten opened 8 years ago

blasten commented 8 years ago

This is generally problematic in Safari <= 9.0.1. A few issues:

  1. iframe content isn't sized automatically so users can't scroll.
  2. Poor UX in mobile iOS
  3. mousewheel event is not triggered inside an iframe in safari <=8 https://github.com/PolymerElements/iron-component-page/pull/48, https://bugs.webkit.org/show_bug.cgi?id=124139
  4. This issue is also present in the catalog https://github.com/Polymer/polymer-element-catalog

    Proposed solution:

Open the demos in a new window. (aka target="_blank") That will fix all the issues without adding more complexity.

notwaldorf commented 8 years ago

@justinfagnani Please feel free to make this lower priority, but "our demos don't work in Safari" sounds a bit bad.

justinfagnani commented 8 years ago

I'm working through reproducing the issues here.

First up: iframe sizing. I'm seeing the sizing problem on initial load in Safari, but after resize, reload, and after some arbitrary amount of time, the iframe resizes and scrolling works. I'm wondering if this is an issue in iron resizable stuff, but have no context. Thoughts?

aendra-rininsland commented 8 years ago

I think I'm getting similar behaviour but in Chrome 48, both from the version of iron-component-page included in generator-polymer's seed component (1.1.4 I think) and freshly-installed 1.1.5 — the iframe is set to height 100%, preventing scrolling. It scrolls perfectly if the iframe's height is set to something like 100vh.

FredKSchott commented 8 years ago

I dug into this a bit back in April and couldn't nail down a solid reproducible case. Sometimes contents wouldn't scroll, and then on next refresh they would scroll fine.

I'm going to unassign this for now, and we can reassign to myself or someone else once it's prioritized for the time this will take to fix.