gfx/layers/apz/test/mochitest/helper_scroll_over_subframe.html

   1 <!DOCTYPE html>
   2 <html>
   3   <title>A scroll over an iframe should not terminate the wheel transaction</title>
   4   <script type="application/javascript" src="apz_test_utils.js"></script>
   5   <script type="application/javascript" src="apz_test_native_event_utils.js"></script>
   6   <script src="/tests/SimpleTest/paint_listener.js"></script>
   7 <head>
   8 <style>
   9 body {
  10   height: 250vh;
  11   width: 100%;
  12   margin: 0;
  13   padding: 0;
  14 }
  15
  16 #spacer {
  17   height: 50px;
  18   width: 100vw;
  19   background: yellow;
  20 }
  21
  22 #subframe {
  23   width: 80vw;
  24   height: 60vh;
  25 }
  26 </style>
  27 </head>
  28 <body>
  29   <div id="spacer"></div>
  30   <iframe id="subframe">
  31   </iframe>
  32 </body>
  33 <script>
  34 const searchParams = new URLSearchParams(location.search);
  35
  36 async function scrollWithPan() {
  37   await NativePanHandler.promiseNativePanEvent(
  38     document.scrollingElement,
  39     50,
  40     30,
  41     0,
  42     NativePanHandler.delta,
  43     NativePanHandler.beginPhase,
  44   );
  45
  46   await NativePanHandler.promiseNativePanEvent(
  47     document.scrollingElement,
  48     50,
  49     30,
  50     0,
  51     NativePanHandler.delta,
  52     NativePanHandler.updatePhase,
  53   );
  54
  55   await NativePanHandler.promiseNativePanEvent(
  56     document.scrollingElement,
  57     50,
  58     30,
  59     0,
  60     NativePanHandler.delta,
  61     NativePanHandler.endPhase,
  62   );
  63 }
  64
  65 async function scrollWithWheel() {
  66   await promiseMoveMouseAndScrollWheelOver(document.scrollingElement, 50, 30,
  67                                            false, 100);
  68 }
  69
  70 async function test() {
  71   let iframeURL =
  72        SimpleTest.getTestFileURL("helper_scroll_over_subframe_child.html");
  73
  74   switch (searchParams.get("oop")) {
  75     case "true":
  76       iframeURL = iframeURL.replace(window.location.origin, "https://example.com/");
  77       break;
  78     default:
  79       break;
  80   }
  81
  82   const iframeLoadPromise = promiseOneEvent(subframe, "load", null);
  83   subframe.src = iframeURL;
  84   await iframeLoadPromise;
  85
  86   await SpecialPowers.spawn(subframe, [], async () => {
  87     await content.wrappedJSObject.waitUntilApzStable();
  88     await SpecialPowers.contentTransformsReceived(content);
  89   });
  90
  91   let childWindowReceivedWheelEvent = false;
  92
  93   window.addEventListener("message", e => {
  94     if (e.data == "child-received-wheel-event") {
  95       childWindowReceivedWheelEvent = true;
  96     }
  97   });
  98
  99   await SpecialPowers.spawn(subframe, [], () => {
 100     let target = content.document.getElementById("target")
 101     target.style.backgroundColor = "green";
 102     content.getComputedStyle(target).backgroundColor;
 103     target.addEventListener("wheel", () => {
 104       target.style.backgroundColor = "red";
 105       content.getComputedStyle(target).backgroundColor;
 106     });
 107     return new Promise(resolve => resolve());
 108   });
 109
 110   await promiseFrame();
 111
 112   let transformEndPromise = promiseTransformEnd();
 113
 114   // Scroll over the iframe
 115   switch (searchParams.get("scroll")) {
 116     case "wheel":
 117       await scrollWithWheel();
 118       break;
 119     case "pan":
 120       await scrollWithPan();
 121       break;
 122     default:
 123       ok(false, "Unsupported scroll value: " + searchParams.get("scroll"));
 124       break;
 125   }
 126
 127   await transformEndPromise;
 128
 129   // Wait an extra frame to ensure any message from the child has
 130   // extra time to be sent to the parent.
 131   await promiseFrame();
 132
 133   let res = await SpecialPowers.spawn(subframe, [], () => {
 134     let target = content.document.getElementById("target")
 135     return target.style.backgroundColor;
 136   });
 137
 138   await promiseFrame();
 139
 140   // We should not have fired a wheel event to the element in the iframe
 141   ok(!childWindowReceivedWheelEvent, "Child window should not receive wheel events");
 142   is(res, "green", "OOP iframe does not halt user scroll of parent");
 143 }
 144 waitUntilApzStable().then(test).then(subtestDone, subtestFailed);
 145 </script>
 146 </html>