Attachment 362605 Details for Bug 194900 – Patch

[patch] Patch

bug-194900-20190221165411.patch (text/plain), 10.94 KB, created by Frédéric Wang (:fredw) on 2019-02-21 07:54:12 PST

(hide)

Description:

Filename:

MIME Type:

Creator: Frédéric Wang (:fredw)

Created: 2019-02-21 07:54:12 PST

Size: 10.94 KB

patch

obsolete

>Subversion Revision: 241865
>diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog
>index 6c9d3410a20953d6da7cc04d11be0e08b4b424b9..256ec5c95a1c79ddf6d9e0930fae0b1fafb5be96 100644
>--- a/LayoutTests/ChangeLog
>+++ b/LayoutTests/ChangeLog
>@@ -1,3 +1,19 @@
>+2019-02-21  Frederic Wang  <fwang@igalia.com>
>+
>+        Add more tests for programmatic frame scrolling on iOS
>+        https://bugs.webkit.org/show_bug.cgi?id=194900
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        This patch adds tests initially written for bug 182868 but
>+        eventually fixed by bug 194886:
>+        - hit testing after a programmatic scroll.
>+        - mixing user and programmatic scrolling.
>+
>+        * fast/scrolling/ios/hit-testing-iframe.html:
>+        * fast/scrolling/ios/mixing-user-and-programmatic-scroll-expected.html: Added.
>+        * fast/scrolling/ios/mixing-user-and-programmatic-scroll.html: Added.
>+
> 2019-02-21  Diego Pino Garcia  <dpino@igalia.com>
> 
>         [GTK] Gardening for unexpected passes
>diff --git a/LayoutTests/fast/scrolling/ios/hit-testing-iframe.html b/LayoutTests/fast/scrolling/ios/hit-testing-iframe.html
>index ba66e3148f71eddaac0f9285d532c09142df2e9c..8a451389b66dafbdc3af34b8a21c4f18039faead 100644
>--- a/LayoutTests/fast/scrolling/ios/hit-testing-iframe.html
>+++ b/LayoutTests/fast/scrolling/ios/hit-testing-iframe.html
>@@ -38,6 +38,11 @@
>          p = frameBox("clickElementInsideFrame");
>          await tapAtPoint(p.left + 7 + 10, p.top + 7 + 10);
> 
>+         // This verifies that a click event is consumed by an element inside the frame, after a programmatic scroll.
>+         document.getElementById("clickElementInsideFrameAfterProgrammaticScroll").contentWindow.window.scrollTo(100, 100);
>+         p = frameBox("clickElementInsideFrameAfterProgrammaticScroll");
>+         await tapAtPoint(p.left + 7 + 10, p.top + 7 + 10);
>+
>          // This verifies that a click event is consumed by an element inside the frame, after a user scroll.
>          p = frameBox("clickElementInsideFrameAfterUserScroll");
>          await touchAndDragFromPointToPoint(p.left + 7, p.top + 7, p.left + 7, p.top - 150);
>@@ -49,7 +54,7 @@
>          testRunner.notifyDone();
>        }
> 
>-       var frameToLoadCount = 5;
>+       var frameToLoadCount = 6;
>        function newFrameLoaded() {
>            frameToLoadCount--;
>            if (frameToLoadCount == 0)
>@@ -96,6 +101,13 @@
>                    onclick='this.style.background=&quot;green&quot;'></div>
>           </body>" onload="newFrameLoaded()">
>       </iframe>
>+      <iframe id="clickElementInsideFrameAfterProgrammaticScroll" style="left: 100px; top: 100px;" scrolling="yes" onclick="this.style.background='red'" srcdoc="
>+          <body style='margin: 0; width: 200px; height: 200px; background: green;'>
>+             <div style='position: absolute; width: 75px; height: 75px; background: red;'></div>
>+              <div style='position: absolute; left: 110px; top: 110px; width: 50px; height: 50px; background: red;'
>+                   onclick='this.style.background=&quot;green&quot;'></div>
>+          </body>" onload="newFrameLoaded()">
>+      </iframe>
>       <iframe id="clickElementInsideFrameAfterUserScroll" style="left: 100px; top: 100px;" scrolling="yes" onclick="this.style.background='red'" srcdoc="
>           <body style='margin: 0; width: 200px; height: 200px; background: green;'>
>              <div style='position: absolute; width: 75px; height: 75px; background: red;'></div>
>diff --git a/LayoutTests/fast/scrolling/ios/mixing-user-and-programmatic-scroll-expected.html b/LayoutTests/fast/scrolling/ios/mixing-user-and-programmatic-scroll-expected.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..f1c8b80e838445cd7de5394328a3ba050eb250a2
>--- /dev/null
>+++ b/LayoutTests/fast/scrolling/ios/mixing-user-and-programmatic-scroll-expected.html
>@@ -0,0 +1,11 @@
>+<!DOCTYPE html>
>+<html>
>+  <head>
>+    <title>Mixing user and programmatic scroll of iframe</title>
>+    <meta name="viewport" content="width=device-width, initial-scale=1">
>+  </head>
>+  <body>
>+    <p>This test passes if you see a green rectangle.</p>
>+    <div style="position: absolute; top: 3em; width: 300px; height: 200px; background: green;"></div>
>+</body>
>+</html>
>diff --git a/LayoutTests/fast/scrolling/ios/mixing-user-and-programmatic-scroll.html b/LayoutTests/fast/scrolling/ios/mixing-user-and-programmatic-scroll.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..8371154572837b903551fcd401dde387d2312409
>--- /dev/null
>+++ b/LayoutTests/fast/scrolling/ios/mixing-user-and-programmatic-scroll.html
>@@ -0,0 +1,136 @@
>+<!DOCTYPE html>
>+<html>
>+  <head>
>+    <title>Mixing user and programmatic scroll 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 getFrameData(id)
>+      {
>+          var result = {};
>+          var f = document.getElementById(id);
>+          result.w = f.contentWindow.window;
>+          var frameBox = f.getBoundingClientRect();
>+          result.x = frameBox.left + frameBox.width / 2;
>+          result.y = frameBox.top + frameBox.height / 2;
>+          return result;
>+      }
>+
>+      function waitPromise(delay)
>+      {
>+          return new Promise((resolve) => { setTimeout(resolve, delay); });
>+      }
>+
>+      async function runTest() {
>+         if (!window.testRunner || !testRunner.runUIScript)
>+             return;
>+
>+         // This verifies user scroll followed by orthogonal programmatic scroll.
>+         var d = getFrameData("userYAndProgrammaticX");
>+         await touchAndDragFromPointToPoint(d.x, d.y, d.x, d.y - 150);
>+         await liftUpAtPoint(d.x, d.y - 150);
>+         await waitPromise(1000); // Wait for scrolling to stabilize.
>+         d.w.scrollBy(100, 0);
>+
>+         // This verifies programmatic scroll followed by orthogonal user scroll.
>+         d = getFrameData("programmaticXAndUserY");
>+         d.w.scrollBy(100, 0);
>+         await touchAndDragFromPointToPoint(d.x, d.y, d.x, d.y - 150);
>+         await liftUpAtPoint(d.x, d.y - 150);
>+         await waitPromise(1000); // Wait for scrolling to stabilize.
>+
>+         // This verifies programmatic scroll followed by user scroll in the same direction.
>+         d = getFrameData("programmaticXAndUserX");
>+         d.w.scrollBy(150, 0);
>+         await touchAndDragFromPointToPoint(d.x, d.y, d.x - 100, d.y);
>+         await liftUpAtPoint(d.x - 100, d.y);
>+         await waitPromise(1000); // Wait for scrolling to stabilize.
>+
>+         // This verifies user scroll followed by programmatic scroll in the same direction.
>+         d = getFrameData("userXAndProgrammaticX");
>+         await touchAndDragFromPointToPoint(d.x, d.y, d.x - 100, d.y);
>+         await liftUpAtPoint(d.x - 100, d.y);
>+         await waitPromise(1000); // Wait for scrolling to stabilize.
>+         d.w.scrollBy(150, 0);
>+
>+         // This verifies mixing several user/programmatic scrolls in various directions.
>+         d = getFrameData("programmaticYAndUserXAndProgrammaticXAndUserY");
>+         await touchAndDragFromPointToPoint(d.x, d.y, d.x, d.y - 100);
>+         await liftUpAtPoint(d.x, d.y - 100);
>+         await waitPromise(1000); // Wait for scrolling to stabilize.
>+         d.w.scrollBy(150, 0);
>+         await touchAndDragFromPointToPoint(d.x, d.y, d.x - 100, d.y);
>+         await liftUpAtPoint(d.x - 100, d.y);
>+         await waitPromise(1000); // Wait for scrolling to stabilize.
>+         d.w.scrollBy(0, 150);
>+
>+         // This verifies hit testing after user and programmatic scroll.
>+         d = getFrameData("programmaticYAndUserXAndHitTesting");
>+         d.w.scrollBy(0, 100);
>+         await touchAndDragFromPointToPoint(d.x, d.y, d.x - 150, d.y);
>+         await liftUpAtPoint(d.x - 150, d.y);
>+         await waitPromise(1500); // Wait for scrolling to stabilize and for scrollbar to disappear.
>+         await tapAtPoint(d.x, d.y);
>+
>+         testRunner.notifyDone();
>+       }
>+
>+       var frameToLoadCount = 1;
>+       function newFrameLoaded() {
>+           frameToLoadCount--;
>+           if (frameToLoadCount == 0)
>+               runTest();
>+       }
>+    </script>
>+    <style>
>+        iframe {
>+            position: absolute;
>+            background: linear-gradient(135deg, red, orange);
>+            border: 0;
>+            height: 100px;
>+            width: 100px;
>+            overflow: none;
>+        }
>+    </style>
>+  </head>
>+  <body>
>+    <p>This test passes if you see a green rectangle.</p>
>+    <div style="position: absolute; top: 3em; width: 300px; height: 200px; background: green;">
>+        <iframe id="userYAndProgrammaticX" style="left: 0px; top: 0px;" scrolling="yes" srcdoc="
>+            <body style='margin: 0; width: 200px; height: 200px'>
>+                <div style='left: 100px; top: 100px; position: absolute; width: 100px; height: 100px; background: green;'></div>
>+            </body>" onload="newFrameLoaded()">
>+        </iframe>
>+        <iframe id="programmaticXAndUserY" style="left: 100px; top: 0px;" scrolling="yes" srcdoc="
>+            <body style='margin: 0; width: 200px; height: 200px'>
>+                <div style='left: 100px; top: 100px; position: absolute; width: 100px; height: 100px; background: green;'></div>
>+            </body>" onload="newFrameLoaded()">
>+        </iframe>
>+        <iframe id="programmaticXAndUserX" style="left: 200px; top: 0px;" scrolling="yes" srcdoc="
>+            <body style='margin: 0; width: 300px; height: 200px'>
>+                <div style='left: 200px; top: 0px; position: absolute; width: 100px; height: 100px; background: green;'></div>
>+            </body>" onload="newFrameLoaded()">
>+        </iframe>
>+        <iframe id="userXAndProgrammaticX" style="left: 0px; top: 100px;" scrolling="yes" srcdoc="
>+            <body style='margin: 0; width: 300px; height: 200px'>
>+                <div style='left: 200px; top: 0px; position: absolute; width: 100px; height: 100px; background: green;'></div>
>+            </body>" onload="newFrameLoaded()">
>+        </iframe>
>+        <iframe id="programmaticYAndUserXAndProgrammaticXAndUserY" style="left: 100px; top: 100px;" scrolling="yes" srcdoc="
>+            <body style='margin: 0; width: 300px; height: 300px'>
>+                <div style='left: 200px; top: 200px; position: absolute; width: 100px; height: 100px; background: green;'></div>
>+            </body>" onload="newFrameLoaded()">
>+        </iframe>
>+        <iframe id="programmaticYAndUserXAndHitTesting" style="left: 200px; top: 100px;" scrolling="yes" srcdoc="
>+            <body style='margin: 0; width: 200px; height: 200px'>
>+                <div style='left: 100px; top: 100px; position: absolute; width: 100px; height: 100px; background: red;' onclick='this.style.background=&quot;green&quot;'></div>
>+            </body>" onload="newFrameLoaded()">
>+        </iframe>
>+    </div>
>+</body>
>+</html>

Actions: View | Formatted Diff | Diff

Attachments on bug 194900: 362605 | 362904