Scrolling on ipad's integrated safari doesn't work

cozy / cozy-home-v2

This repository was part of CozyV2 which has been deprecated

https://blog.cozycloud.cc/post/2016/11/21/On-the-road-to-Cozy-version-3

GNU Affero General Public License v3.0

94 stars 53 forks source link

Scrolling on ipad's integrated safari doesn't work #251

Closed bnjbvr closed 9 years ago

bnjbvr commented 9 years ago

Using latest iOS and integrated Safari on an iPad, if you try to scroll in the app's iframe, nothing happens. Maybe adding something like scrolling="auto" to the iframe tag should do the trick?

frankrousseau commented 9 years ago

Thank you for reporting, we should definitely improve responsiveness of the Cozy Home.

m4dz commented 9 years ago

My firsts tests confirms that we have a problem with long iframes. It relies on:

how Safari mobile handles the scrolling event and the viewport (Apple made a specific style for this: http://stackoverflow.com/questions/4599153/iframes-and-the-safari-on-the-ipad-how-can-the-user-scroll-the-content)
fake scrollers that can simulate a real scroll as Safari mobile expect it (and as we use nice scroll, it may introduces collateral bugs).

I'll try to fix the iframe problem first before considering nicescroll responsibility (as I think it probably does not take part of iframe scrolling, but may have problem on long home views)

frankrousseau commented 9 years ago

We removed the top bar on iPad. So the scrolling should be back. Could you try again @bnjbvr ?

bnjbvr commented 9 years ago

Just updated the entire platform via the Update button in my cozy's interface and the top bar is still there. Is there anything else I should do?

frankrousseau commented 9 years ago

Weird. I will get an ipad and will try directly on it. In fact we removed the top bar for resolution less wide than 900px.

frankrousseau commented 9 years ago

Whatever thank you for trying again.

m4dz commented 9 years ago

@frankrousseau I also still have the topbar on iPad and on desktop browser below width < 900px. Was the fix merged and published?

Also @bnjbvr, I tried with long-height apps such as emails and the scrolling works well (even with the topbar), and unlike my first thoughts and tests, the scroll works very well. Is the problem occurs on Kresus specifically?

bnjbvr commented 9 years ago

As stated on IRC, feeds, bookmarks and tasky have the same issue.

m4dz commented 9 years ago

Ok, nevermind: the scroll works well in messages list in emails becuase of the messages-list panel that have a overflow-y: auto. So the scrolling works for overflowed divs. I'll check for iframes directly…

m4dz commented 9 years ago

So, after more tests:

the content can be scrolled if enclosed in an overflowed div
the iframe embedded in home cannot be scrolled
add -webkit-overflow-scrolling:touch doesn't change anything (due to nicescroll? maybe but I'm not sure…)

If we remove the height on the iframes' parent div, then scrolling works well, but apps using a body { height: 100% } such as emails are messed (because their window container – the iframe – doesn't ave any explicit height).

We've got the causes, let's try to find a fix now :wink:!

clochix commented 9 years ago

@m4dz is this ticket still relevant with the new Home ?

clochix commented 9 years ago

ping @bnjbvr and @m4dz

m4dz commented 9 years ago

Sadly, it's still relevant, but not related to home in fact: scrolling in a iframe isn't trivial if the app implement anything other than an overflow-y: scroll rule. So, this issue is finally not related to Home (which only display its iframe) but to the incirmined apps that tries to overrides the native scroll.

bnjbvr commented 9 years ago

Roger that last @m4dz comment: scrolling on tasky works, not on kresus. I'll open an issue on Kresus and will discuss it there.

frankrousseau commented 9 years ago

Thank you all for your participation. I think we can close this one. If someone thinks I'm wrong, feel free to reopen it.