| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Scrolling of iframe</title> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <script src="../../../resources/basic-gestures.js"></script> |
| <script type="text/javascript"> |
| if (window.testRunner) |
| testRunner.waitUntilDone(); |
| if (window.internals) |
| internals.settings.setAsyncFrameScrollingEnabled(true); |
| |
| function centerOf(id) |
| { |
| var frameBox = document.getElementById(id).getBoundingClientRect(); |
| return { x: frameBox.left + frameBox.width / 2, y: frameBox.top + frameBox.height / 2 }; |
| } |
| |
| async function runTest() { |
| if (!window.testRunner || !testRunner.runUIScript) |
| return; |
| |
| // This checks scrolling to the location of the green square. |
| var c = centerOf("largeContent"); |
| await touchAndDragFromPointToPoint(c.x, c.y, c.x, c.y - 2000); |
| await liftUpAtPoint(c.x, c.y - 2000); |
| |
| // Wait for scrolling to stabilize and for scrollbars to disappear. |
| setTimeout(() => {testRunner.notifyDone(); }, 2000); |
| } |
| </script> |
| <style> |
| iframe { |
| float: left; |
| background: linear-gradient(135deg, red, orange); |
| border: 0; |
| height: 100px; |
| width: 100px; |
| } |
| </style> |
| </head> |
| <body> |
| <p>This test passes if you see a green square.</p> |
| <iframe id="largeContent" scrolling="yes" srcdoc=" |
| <style>::-webkit-scrollbar { display: none; }</style> |
| <body style='margin: 0;'> |
| <div style='width: 100px; height: 500px; background: red;'></div> |
| <div style='width: 100px; height: 500px; background: blue;'></div> |
| <div style='width: 100px; height: 500px; background: red;'></div> |
| <div style='width: 100px; height: 500px; background: blue;'></div> |
| <div style='width: 100px; height: 500px; background: green;'></div> |
| </body>" onload="runTest()"> |
| </iframe> |
| </body> |
| </html> |
