Issue metadata
Sign in to add a comment
|
Interacting with elements within iframes sometimes scrolls parent body taking the iframe outside of viewport
Reported by
pop.mi...@launchmetrics.com,
Oct 19 2017
|
||||||||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.62 Safari/537.36 Example URL: http://62.231.98.188/chrome.php Steps to reproduce the problem: 1. Create a page with a enough content to have vertical scroll. 2. Create an absolute positioned iframe and a precise height and place it somewhere in the document (not very near the top for best results). 3. Within the iframe generate more content than the height to also have vertical scroll here and include some form elements as well. 4. Open this document, scroll the body, scroll within the iframe and then focus on an input. 5. Press some keys rapidly, occasionally vertically scroll either the body or the iframe until the element of focus gets outside of the viewport. 6. Repeat step 5 and try with several inputs within the iframe placed at different positions to notice the random effect it has on the parent scroll. An example that you could use on my localhost (also attached a GIF recording showcasing the problem): http://62.231.98.188/chrome.php * Note: this link may not always be available, but should be during week days from 7AM - 5PM UTC. What is the expected behavior? The desired behavior is to focus on the input contained by the iframe, and cause some scroll on the IFRAME. What went wrong? In several cases (randomly) the parent body scroll is affected, and it even jumps to positions where the iframe is no longer visible at all. Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? Yes Not sure, but the problem surfaced this month (first report we collected was ~ 10 October 2017) Does this work in other browsers? Yes Chrome version: 62.0.3202.62 Channel: stable OS Version: 10.0 Flash Version: This is devastating for most of our web application interfaces where we make extensive use of overlays/modals which have iframes that contain forms. We actually disable parent body scrolling when launching such overlays and also place a mask between the main page and the iframe (stacking by z-index) to prevent the user from interacting with anything behind the iframe. But as soon as they focus on a field and start typing we`we experienced situations where the body scroll jumped by more than the viewport's length. The weirdest thing is that the problem can occur even in situations where the iframe form element is perfectly visible (in the middle of the screen) and causes the parent window to jump around randomly. We have tried all tricks we could find: overflow-anchor & webkit-backface-visibility, forced redrawing without any success. The only trick that "kind of worked" as expected so far was to listen to body scroll events and revert them. But I am pretty sure we can all do better than that!
,
Oct 19 2017
|
|||||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||||
Comment 1 by dtapu...@chromium.org
, Oct 19 2017