[Webkit-unassigned] [Bug 165154] New: -webkit-overflow-scrolling:touch in certain HTML structure causes erroneous rubberbanding

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=165154

            Bug ID: 165154
           Summary: -webkit-overflow-scrolling:touch in certain HTML
                    structure causes erroneous rubberbanding
    Classification: Unclassified
           Product: WebKit
           Version: Other
          Hardware: iPhone / iPad
                OS: iOS 9.3
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: HTML Events
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: alan.delong at ceros.com

Created attachment 295634
  --> https://bugs.webkit.org/attachment.cgi?id=295634&action=review
POC for iPad erroneous rubberbanding

Take the HTML from this codepen, save it as its own page (or grab the attached HTML file), and open it on an iPad in mobile Safari: http://codepen.io/anon/pen/oYoXYv

So basically we have 4 absolutely positioned divs for showing where you are on the page, inside a very tall div (.page-scroll), which is inside a relatively positioned div with overflow-y: scroll and -webkit-overflow-scrolling: touch (.page-container). The other parent divs (page-viewport and viewport) are there to ensure a consistent look across devices.

On every other device we've tried, swiping to scroll scrolls the page-scroll div inside the page-container div as expected. However, on iPad, we are seeing non-deterministic behavior. If you swipe quickly, the page scrolls normally, but if you swipe slowly, the page will sometimes rubberband. It's as if the touchstart event is getting sent to one of the parent divs, and so the iPad thinks it is at the bottom or top of the page.

However, if -webkit-overflow-scrolling: touch is removed from the .page-container div, the problem disappears. But you lose momentum scrolling. I should also note that if this markup is loaded onto a page via an iframe, the problem goes away, but that is not really an option for us (because reasons).

This was asked about on StackOverflow but was unresolved, so we're reporting it here. http://stackoverflow.com/questions/37999637/ipad-sometimes-rubberbands-with-webkit-overflow-scrolling-touch 

This may be related to one of these reported bugs, however without solving the bug it is hard to say:
https://bugs.webkit.org/show_bug.cgi?id=106918
https://bugs.webkit.org/show_bug.cgi?id=117059

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.webkit.org/pipermail/webkit-unassigned/attachments/20161129/55d3b8bc/attachment.html>