[Webkit-unassigned] [Bug 134596] New: Click events offset in webkit-overflow-scrolling iframes

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Thu Jul 3 09:37:03 PDT 2014


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

           Summary: Click events offset in webkit-overflow-scrolling
                    iframes
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: iOS
               URL: http://www.justise.com/prototype/scrolltotop.html
        OS/Version: Other
            Status: NEW
          Severity: Major
          Priority: P2
         Component: Layout and Rendering
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: kgray at justise.com


Created an attachment (id=234347)
 --> (https://bugs.webkit.org/attachment.cgi?id=234347&action=review)
xCode Project to reproduce the issue

Reproduced on iOS8 Beta 2. 
Version: 538.39 (Your form needs updating. :D )
navigator.userAgent: "Mozilla/5.0 (iPhone; CPU iPhone OS 8_0 like Mac OS X) AppleWebKit/538.39 (KHTML, like Gecko) Mobile/12A4297e"

Salesforce embeds all its customer VisualForce pages in Salesforce1 this way, so not having selecting working for all of them would be a very big deal.

I've embedded an xCode Project that you can run to reproduce, I'll explain below the best I can as well. 
(Excuse my sloppiness, I don't actually do any xCode programming, I simply learned this much as to get the issue isolated and make a bug report)

To Reproduce.
Start with this DOM Structure (already setup in the included xCode project)

Position a DIV absolutely with these styles
{
 position: absolute;
 top: 0; bottom: 0; left: 0; right: 0 
}

Inside that, include a div with these styles
{ 
 height: 100%; overflow: auto;
 -webkit-overflow-scrolling: touch;
}

Inside that include an iframe with these styles
{ height: 100% }

The iframe should link to a long page with input elements up and down the page.
You could just link to the page I created for this
http://www.justise.com/prototype/scrolltotop2.html

To reproduce the actual issue now

Without Scrolling you should be able to click any of the radio buttons

Now scroll down the page

Trying to click any of the radio buttons on the left results in an offset click. One of the radio buttons below your click will receive the event.

Expected:
The radio button I clicked on gets focus

Actual:
The click event is offset the amount the iframe was scrolled.


Notes:
The first div that is positioned absolutely is a major culprit here. I could not reproduce it till I added that code in.
I'm simply reproducing the structure of the Salesforce1 application in this example. While it makes sense not to wrap it all in the absolutely positioned div, it's just the way our app is structured currently and we would prefer not to have to re-architect it to work around issues such as this.

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.



More information about the webkit-unassigned mailing list