Bug 184665 – iframe inside scrollable div scrolls up after inserting element

• Status: RESOLVED
• Resolution: CONFIGURATION CHANGED
• Component: Frames

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

Created attachment 338036 [details]
Example

Run index.html on iPad then follow steps in the bug's initial comment.

[Radar WebKit Bug Importer]

<rdar://problem/39597937>

[Simon Fraser (smfr)]

I can reproduce.

[Simon Fraser (smfr)]

Inserting the div is triggering layout in the main document (because of frame flattening), and this is resetting the scroll position.

[Simon Fraser (smfr)]

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)]

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)]

Probably caused by https://trac.webkit.org/changeset/88011/

[Simon Fraser (smfr)]

*** Bug 193769 has been marked as a duplicate of this bug. ***

[Simon Fraser (smfr)]

Another test case at https://plnkr.co/edit/HDigw0jKv79J1eI81kDJ?p=preview

[Ahmad Saleem]

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!