Bug 184665

Summary: iframe inside scrollable div scrolls up after inserting element
Product: WebKit Reporter: gaffne67
Component: FramesAssignee: Nobody <webkit-unassigned>
Status: RESOLVED CONFIGURATION CHANGED    
Severity: Normal CC: ahmad.saleem792, ap, bfulgham, gaffne67, info, rniwa, simon.fraser, thorton, webkit-bug-importer, zalan
Priority: P2 Keywords: BrowserCompat, InRadar
Version: WebKit Nightly Build   
Hardware: iPhone / iPad   
OS: iOS 11   
URL: https://plnkr.co/edit/HDigw0jKv79J1eI81kDJ?p=preview
See Also: https://bugs.webkit.org/show_bug.cgi?id=61491
Attachments:
Description Flags
Example none

gaffne67
Reported 2018-04-16 13:50:57 PDT
When moving and displaying a div in an iFrame (using javascript) in iOS devices, the iframe scrolls to top of the window and the user has to scroll back down to see the div. In non-iOS devices the div is moved into view without the iFrame scrolling up (which is the desired behavior). example: https://plnkr.co/edit/HDigw0jKv79J1eI81kDJ?p=preview Steps to reproduce: 1. Navigate to the above url on an iPad or iPhone using Safari 2. Scroll down and tap the "Click ME!" link. 3. Notice the iFrame scrolls to the top. What the link is doing: - The link formats a div, moves it to the top right of the point that was tapped, and makes it visible. Note: If you comment out line 82 (dd.style.display = "block";), the iframe does not scroll to the top. I confirmed this behavior on: iPad (iOS 11.3) - Safari - Chrome - Mozilla Firefox iPad (iOS 11.2.6) - Safari - Chrome - Mozilla Firefox iPhone (iOS 11.2.6) - Safari I confirmed this behavior does not happen on: Windows 10 - Safari (v 5.1.7) - Chrome - Mozilla Firefox Android (7.0) - Chrome
Attachments
Example (2.14 KB, application/x-zip-compressed)
2018-04-16 13:56 PDT, gaffne67 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
gaffne67
Comment 1 2018-04-16 13:56:27 PDT
Created attachment 338036 [details] Example Run index.html on iPad then follow steps in the bug's initial comment.
Radar WebKit Bug Importer
Comment 2 2018-04-20 08:46:11 PDT
<rdar://problem/39597937>
Simon Fraser (smfr)
Comment 3 2018-11-12 12:55:32 PST
I can reproduce.
Simon Fraser (smfr)
Comment 4 2018-11-12 13:13:20 PST
Inserting the div is triggering layout in the main document (because of frame flattening), and this is resetting the scroll position.
Simon Fraser (smfr)
Comment 5 2018-11-12 13:49:03 PST
What seems to be happening is that we do two layouts on the scrollable div. The first is with an unflattened frame, so the contents height is ~300 and we clamp the larger scroll position. Then we do layout again with at the unflattened frame, and go back to larger contents size, but we've already clamped the scroll position.
Simon Fraser (smfr)
Comment 6 2018-11-12 14:21:12 PST
Actually, I think the real bug is that RenderIFrame::flattenFrame() says to not flatten the frame if boundingRect (the unflattened size!) is outside the document.
Simon Fraser (smfr)
Comment 7 2018-11-12 14:41:28 PST
Probably caused by https://trac.webkit.org/changeset/88011/
Simon Fraser (smfr)
Comment 8 2019-01-24 14:33:41 PST
*** Bug 193769 has been marked as a duplicate of this bug. ***
Simon Fraser (smfr)
Comment 9 2019-01-24 14:34:04 PST
Another test case at https://plnkr.co/edit/HDigw0jKv79J1eI81kDJ?p=preview
Ahmad Saleem
Comment 10 2022-08-29 04:01:31 PDT
I am unable to reproduce this bug using test link in Comment 0 and Comment 9 on iOS 15.6.1 on iPhone 13 Pro Max. It does not scroll back at the top when clicking on "Click Me" to show <div>. I am going to mark this as "RESOLVED CONFIGURATION CHANGED". Please reopen with updated test case, if this is still happening for anyone else. I don't have iPad to test this but iPhone is working as intended and matching Safari on macOS behavior. Thanks!
Note You need to log in before you can comment on or make changes to this bug.