Bug 1667478. Fix dom/events/test/pointerevents/test_bug1303704.html to wait for scroll events properly. r=kats

This test is a little bit different but the same general principle applies as in the test fixes in

https://hg.mozilla.org/integration/autoland/rev/30cd33572b3d
and the followup fix to that
https://hg.mozilla.org/mozilla-central/rev/f51b6c3688a4

We also disable smooth scroll (all of the other previous tests fixed already had smooth scroll disabled) so we get one scroll instead of many small ones over time.

I didn't check that both of the two fixes are necessary or not.

Differential Revision: https://phabricator.services.mozilla.com/D91481

dom/events/test/pointerevents/mochitest.ini

@@ -4,6 +4,7 @@ support-files =
   mochitest_support_internal.js
   pointerevent_styles.css
   pointerevent_support.js
+  !/gfx/layers/apz/test/mochitest/apz_test_utils.js
 
 [test_bug1285128.html]
 [test_bug1293174_implicit_pointer_capture_for_touch_1.html]

dom/events/test/pointerevents/test_bug1303704.html

@@ -8,6 +8,7 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=1303704
   <title>Test for Bug 1303704</title>
   <script src="/tests/SimpleTest/SimpleTest.js"></script>
   <script src="/tests/SimpleTest/EventUtils.js"></script>
+  <script type="text/javascript" src="/tests/gfx/layers/apz/test/mochitest/apz_test_utils.js"></script>
   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
   <style>
     #scrollable {
@@ -52,6 +53,10 @@ scroll
 /** Test for Bug 1303704 **/
 SimpleTest.waitForExplicitFinish();
 
+function waitToClearOutAnyPotentialScrolls(aWindow) {
+  return new Promise(resolve => {aWindow.requestAnimationFrame(() => { aWindow.requestAnimationFrame(() => { flushApzRepaints(() => { aWindow.requestAnimationFrame(() => { aWindow.requestAnimationFrame(resolve); } ); }, aWindow); }); }); });
+}
+
 function runTests() {
   let link1 = window.document.getElementById("link1");
   let mouseEvents = ["mousedown", "mouseup", "mousemove"];
@@ -86,7 +91,7 @@ function runTests() {
     return;
   }
 
-  function scrollTest() {
+  async function scrollTest() {
     var scrollable = document.getElementById("scrollable");
     scrollable.addEventListener('pointerdown', function(ev) {
       ev.preventDefault();
@@ -105,15 +110,16 @@ function runTests() {
     synthesizeMouse(scrollable, offsetX, offsetY,
                     { type: "mouseup",
                       inputSource: MouseEvent.MOZ_SOURCE_MOUSE });
-    requestAnimationFrame(function() {
-      if (scrollable.scrollTop != 0) {
-        isnot(scrollable.scrollTop, 0,
-            "Scrollable element should have been scrolled.");
-        SimpleTest.finish();
-      } else {
-        setTimeout(scrollTest);
-      }
-    });
+
+    await waitToClearOutAnyPotentialScrolls(window);
+
+    if (scrollable.scrollTop != 0) {
+      isnot(scrollable.scrollTop, 0,
+          "Scrollable element should have been scrolled.");
+      SimpleTest.finish();
+    } else {
+      setTimeout(scrollTest);
+    }
   }
 
   setTimeout(() => {
@@ -125,7 +131,7 @@ function runTests() {
 }
 
 SimpleTest.waitForFocus(() => {
-  SpecialPowers.pushPrefEnv({"set": [["dom.w3c_pointer_events.enabled", true]]}, runTests);
+  SpecialPowers.pushPrefEnv({"set": [["dom.w3c_pointer_events.enabled", true], ["general.smoothScroll", false]]}, runTests);
 });
 
 </script>