Bug 1668923 - APZ mochitest rect handling cleanup. r=botond

Use width and height instead of w and h for object member names to simplify
usage.

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

gfx/layers/apz/test/mochitest/apz_test_native_event_utils.js

@@ -356,8 +356,8 @@ function rectRelativeToScreen(aElement) {
   return {
     x: (targetWindow.mozInnerScreenX + rect.left) * scale,
     y: (targetWindow.mozInnerScreenY + rect.top) * scale,
-    w: rect.width * scale,
-    h: rect.height * scale,
+    width: rect.width * scale,
+    height: rect.height * scale,
   };
 }
 

gfx/layers/apz/test/mochitest/apz_test_utils.js

@@ -34,8 +34,17 @@ function parsePoint(str) {
   };
 }
 
-// TODO: Clean up these rect-handling functions so that e.g. a rect returned
-//       by Element.getBoundingClientRect() Just Works with them.
+// Given a VisualViewport object, return the visual viewport
+// rect relative to the page.
+function getVisualViewportRect(vv) {
+  return {
+    x: vv.pageLeft,
+    y: vv.pageTop,
+    width: vv.width,
+    height: vv.height,
+  };
+}
+
 function parseRect(str) {
   var pieces = str.replace(/[()\s]+/g, "").split(",");
   SimpleTest.is(pieces.length, 4, "expected string of form (x,y,w,h)");
@@ -48,23 +57,25 @@ function parseRect(str) {
   return {
     x: parseInt(pieces[0]),
     y: parseInt(pieces[1]),
-    w: parseInt(pieces[2]),
-    h: parseInt(pieces[3]),
+    width: parseInt(pieces[2]),
+    height: parseInt(pieces[3]),
   };
 }
 
-// These functions expect rects with fields named x/y/w/h, such as
+// These functions expect rects with fields named x/y/width/height, such as
 // that returned by parseRect().
 function rectContains(haystack, needle) {
   return (
     haystack.x <= needle.x &&
     haystack.y <= needle.y &&
-    haystack.x + haystack.w >= needle.x + needle.w &&
-    haystack.y + haystack.h >= needle.y + needle.h
+    haystack.x + haystack.width >= needle.x + needle.width &&
+    haystack.y + haystack.height >= needle.y + needle.height
   );
 }
 function rectToString(rect) {
-  return "(" + rect.x + "," + rect.y + "," + rect.w + "," + rect.h + ")";
+  return (
+    "(" + rect.x + "," + rect.y + "," + rect.width + "," + rect.height + ")"
+  );
 }
 function assertRectContainment(
   haystackRect,
@@ -708,15 +719,15 @@ function getSnapshot(rect) {
         "http://www.w3.org/1999/xhtml",
         "canvas"
       );
-      canvas.width = parentRect.w;
-      canvas.height = parentRect.h;
+      canvas.width = parentRect.width;
+      canvas.height = parentRect.height;
       var ctx = canvas.getContext("2d");
       ctx.drawWindow(
         topWin,
         parentRect.x,
         parentRect.y,
-        parentRect.w,
-        parentRect.h,
+        parentRect.width,
+        parentRect.height,
         "rgb(255,255,255)",
         ctx.DRAWWINDOW_DRAW_VIEW |
           ctx.DRAWWINDOW_USE_WIDGET_LAYERS |

gfx/layers/apz/test/mochitest/browser_test_position_sticky.js

@@ -63,12 +63,7 @@ add_task(async () => {
   );
 
   // Take a snapshot where the position:sticky element is initially painted.
-  const reference = await getSnapshot({
-    x: rect.x,
-    y: rect.y,
-    w: rect.width,
-    h: rect.height,
-  });
+  const reference = await getSnapshot(rect);
 
   let mouseX = window.innerWidth - scrollbarWidth / 2;
   let mouseY = tab.linkedBrowser.getBoundingClientRect().y + 5;
@@ -95,12 +90,7 @@ add_task(async () => {
   }
 
   // Take a snapshot again where the position:sticky element should be painted.
-  const snapshot = await getSnapshot({
-    x: rect.x,
-    y: rect.y,
-    w: rect.width,
-    h: rect.height,
-  });
+  const snapshot = await getSnapshot(rect);
 
   await dragFinisher();
 

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

@@ -52,7 +52,7 @@ async function test() {
         (lastPaint[scrollId].contentDescription.includes("tall_html"))) {
       var dp = getPropertyAsRect(lastPaint, scrollId, "displayport");
       ok(dp.y <= 0, "The displayport top should be less than or equal to zero to cover the visible part of the subframe; it is " + dp.y);
-      ok(dp.y + dp.h >= subframe.clientHeight, "The displayport bottom should be greater than the clientHeight; it is " + (dp.y + dp.h));
+      ok(dp.y + dp.height >= subframe.clientHeight, "The displayport bottom should be greater than the clientHeight; it is " + (dp.y + dp.height));
       foundIt++;
     }
   }

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

@@ -66,7 +66,7 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=982141
       // In general they will be (50 - <scrollbarwidth>, 50 - <scrollbarheight>).
       SimpleTest.ok(subframe.clientWidth > 0, "Expected a non-zero clientWidth, got: " + subframe.clientWidth);
       SimpleTest.ok(subframe.clientHeight > 0, "Expected a non-zero clientHeight, got: " + subframe.clientHeight);
-      SimpleTest.ok(dp.w >= subframe.clientWidth && dp.h >= subframe.clientHeight,
+      SimpleTest.ok(dp.width >= subframe.clientWidth && dp.height >= subframe.clientHeight,
                     "expected a displayport at least as large as the scrollable element, got " + JSON.stringify(dp));
 
       window.opener.finishTest();

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

@@ -74,13 +74,13 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=1689492
       await promiseApzFlushedRepaints();
 
       let innerdp = getLastContentDisplayportFor("innerdiv");
-      ok(innerdp.h > 30, outputprefix + " innerdiv display port should be larger than innerdiv");
+      ok(innerdp.height > 30, outputprefix + " innerdiv display port should be larger than innerdiv");
 
       let outerdp = getLastContentDisplayportFor("outerdiv");
       is(outerdp.x, 0, outputprefix + " outerdiv display port should be relatively bounded x");
       is(outerdp.y, 0, outputprefix + " outerdiv display port should be relatively bounded y");
-      ok(outerdp.w <= 50, outputprefix + " outerdiv display port should relatively bounded w");
-      ok(outerdp.h < theheight * allowedscalefactor, outputprefix + " outerdiv display port should be relatively bounded h");
+      ok(outerdp.width <= 50, outputprefix + " outerdiv display port should relatively bounded w");
+      ok(outerdp.height < theheight * allowedscalefactor, outputprefix + " outerdiv display port should be relatively bounded h");
 
       ok(true, "innerdp " + JSON.stringify(innerdp));
       ok(true, "outerdp " + JSON.stringify(outerdp));

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

@@ -43,7 +43,7 @@ async function test() {
   ok(rootDisplayport != null, "root element should have a displayport");
   dump("root dp: " + JSON.stringify(rootDisplayport) +
        ", height: " + rootElem.clientHeight);
-  var rootDpVerticalMargin = (rootDisplayport.h - rootElem.clientHeight) / 2;
+  var rootDpVerticalMargin = (rootDisplayport.height - rootElem.clientHeight) / 2;
   ok(rootDpVerticalMargin > 500,
      "root element should have at least 500px of vertical displayport margin");
 

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

@@ -84,8 +84,8 @@ async function test() {
 
   // Since bug 1709460 any visible OOP iframe initially has set the displayport.
   let displayport = await getIframeDisplayport(iframe);
-  is(displayport.w, 400);
-  is(displayport.h, 300);
+  is(displayport.width, 400);
+  is(displayport.height, 300);
 
   let iframeResponse =
     await FissionTestHelper.sendToOopif(iframe, `(${code_for_oopif_to_run})()`);
@@ -106,8 +106,8 @@ async function test() {
 
   // Now the displayport size should have been set.
   displayport = await getIframeDisplayport(iframe);
-  is(displayport.w, 400, "The displayport size should be same as the iframe size");
-  is(displayport.h, 300, "The displayport size should be same as the iframe size");
+  is(displayport.width, 400, "The displayport size should be same as the iframe size");
+  is(displayport.height, 300, "The displayport size should be same as the iframe size");
 
   // Wait 100ms to give a chance to deliver the checkerboard event.
   await new Promise(resolve => {

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

@@ -46,8 +46,8 @@ async function test() {
 
   // Fully visible iframe.
   let displayport = await getIframeDisplayport(visibleIframeElement);
-  is(displayport.w, 400, "The displayport size should be same as the iframe size");
-  is(displayport.h, 300, "The displayport size should be same as the iframe size");
+  is(displayport.width, 400, "The displayport size should be same as the iframe size");
+  is(displayport.height, 300, "The displayport size should be same as the iframe size");
 
   // Fully invisible iframe (inside `overflow: hidden` parent element)
   const invisibleIframeElement = document.getElementById("invisible-testframe");
@@ -63,15 +63,15 @@ async function test() {
   // Partially invisible iframe (inside `overflow: hidden` parent element)
   const clippedOutIframeElement = document.getElementById("clipped-out-testframe");
   displayport = await getIframeDisplayport(clippedOutIframeElement);
-  is(displayport.w, 400, "The displayport width should be same as the iframe width");
-  ok(displayport.h > 0, "The displayport height should be greater than zero");
-  ok(displayport.h < 300, "The displayport height should be less than the iframe height");
+  is(displayport.width, 400, "The displayport width should be same as the iframe width");
+  ok(displayport.height > 0, "The displayport height should be greater than zero");
+  ok(displayport.height < 300, "The displayport height should be less than the iframe height");
 
   const partiallyScrolledOutIframeElement = document.getElementById("partially-scrolled-out-testframe");
   displayport = await getIframeDisplayport(partiallyScrolledOutIframeElement);
-  is(displayport.w, 400, "The displayport width should be same as the iframe width");
-  ok(displayport.h > 0, "The displayport height should be greater than zero");
-  ok(displayport.h < 300, "The displayport height should be less than the iframe height");
+  is(displayport.width, 400, "The displayport width should be same as the iframe width");
+  ok(displayport.height > 0, "The displayport height should be greater than zero");
+  ok(displayport.height < 300, "The displayport height should be less than the iframe height");
 }
 
   </script>

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

@@ -28,8 +28,7 @@ let get_iframe_displayport = function() {
   // in the displayport it sets.
   promiseApzFlushedRepaints().then(() => {
     // Query the composed displayport and report it to the embedder.
-    let dp = getLastContentDisplayportFor("fission_empty_docelement");
-    let result = { x: dp.x, y: dp.y, w: dp.w, h: dp.h };
+    let result = getLastContentDisplayportFor("fission_empty_docelement");
     FissionTestHelper.fireEventInEmbedder("OOPIF:Displayport", result);
   });
   return true;
@@ -56,7 +55,7 @@ async function test() {
   // the page's displayport. The reason it can be up to twice as tall is
   // described in bug 1690697; we may be able to assert a tighter bound
   // after making improvements in that bug.
-  ok(iframeDp.h <= (dp.h * 2), "iframe displayport should be no more than twice as tall as page displayport");
+  ok(iframeDp.height <= (dp.height * 2), "iframe displayport should be no more than twice as tall as page displayport");
 }
 
   </script>

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

@@ -62,8 +62,8 @@
 
       // First, check check that we don't expand the displayport to the entire layout viewport
       // even if we are zoomed in a lot.
-      ok(fixedPosDisplayport.w < window.innerWidth, "fixed-pos displayport is too wide");
-      ok(fixedPosDisplayport.h < window.innerHeight, "fixed-pos displayport is too tall");
+      ok(fixedPosDisplayport.width < window.innerWidth, "fixed-pos displayport is too wide");
+      ok(fixedPosDisplayport.height < window.innerHeight, "fixed-pos displayport is too tall");
 
       // Now, check the position. We want it to track the visual scroll position
       // relative to the layout viewport (but not relative to the page), since
@@ -72,8 +72,8 @@
       // the visual viewport rect as expressed relative to the layout viewport.
       let vvRect = { x: vv.offsetLeft,  // offsets relative to layout viewport
                      y: vv.offsetTop,
-                     w: vv.width,
-                     h: vv.height };
+                     width: vv.width,
+                     height: vv.height };
       assertRectContainment(fixedPosDisplayport, "fixed-pos displayport",
                             vvRect, "visual viewport");
     }

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

@@ -27,14 +27,6 @@
         height: rootScroller.scrollHeight - vv.height,
       };
     }
-    function getVisualViewportRect() {
-      return {
-        x: vv.pageLeft,
-        y: vv.pageTop,
-        w: vv.width,
-        h: vv.height,
-      };
-    }
     async function test() {
       is(window.scrollMaxX, 0, "page should have a zero horizontal layout scroll range");
       is(window.scrollMaxY, 0, "page should have a zero vertical layout scroll range");
@@ -56,11 +48,8 @@
       is(window.scrollY, 0, "page should not layout-scroll with a zero layout scroll range");
 
       // Test that scrollIntoView() did perform visual scrolling.
-      let vvRect = getVisualViewportRect();
+      let vvRect = getVisualViewportRect(vv);
       let targetBounds = target.getBoundingClientRect();
-      // set property names expected by rectContains()
-      targetBounds.w = targetBounds.width;
-      targetBounds.h = targetBounds.height;
       assertRectContainment(vvRect, "visual viewport", targetBounds, "target element bounding rect");
     }
     SpecialPowers.getDOMWindowUtils(window).setResolutionAndScaleTo(2.0);

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

@@ -29,14 +29,6 @@
         height: rootScroller.scrollHeight - vv.height,
       };
     }
-    function getVisualViewportRect() {
-      return {
-        x: vv.pageLeft,
-        y: vv.pageTop,
-        w: vv.width,
-        h: vv.height,
-      };
-    }
     async function test() {
       is(window.scrollMaxX, 0, "page should have a zero horizontal layout scroll range");
       is(window.scrollMaxY, 0, "page should have a zero vertical layout scroll range");
@@ -58,11 +50,8 @@
       is(window.scrollY, 0, "page should not layout-scroll with a zero layout scroll range");
 
       // Test that scrollIntoView() did perform visual scrolling.
-      let vvRect = getVisualViewportRect();
+      let vvRect = getVisualViewportRect(vv);
       let targetBounds = iframe.getBoundingClientRect();
-      // set property names expected by rectContains()
-      targetBounds.w = targetBounds.width;
-      targetBounds.h = targetBounds.height;
       assertRectContainment(vvRect, "visual viewport", targetBounds, "iframe having the target element bounding rect");
     }
     SpecialPowers.getDOMWindowUtils(window).setResolutionAndScaleTo(2.0);

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

@@ -33,7 +33,7 @@ async function test() {
   // We only care the top 10px here since the scroll linked effect on the
   // main-thread can't keep up with the async scrolling by wheel events so that
   // the position absolute element is often partially scrolled out.
-  rect.h = 10;
+  rect.height = 10.0;
   const initialSnapshot = await getSnapshot(rect);
 
   let snapshots = [];

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

@@ -62,8 +62,8 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=1151663
       info("rootDisplayPort is " + JSON.stringify(rootDisplayPort));
       info("rootElement.clientWidth " + rootElement.clientWidth +
            " rootElement.clientHeight " + rootElement.clientHeight);
-      ok(rootDisplayPort.w >= rootElement.clientWidth, "rootDisplayPort should be at least as wide as page");
-      ok(rootDisplayPort.h >= heightMultiplier * rootElement.clientHeight,
+      ok(rootDisplayPort.width >= rootElement.clientWidth, "rootDisplayPort should be at least as wide as page");
+      ok(rootDisplayPort.height >= heightMultiplier * rootElement.clientHeight,
         "rootDisplayPort should be at least as tall as page times heightMultiplier");
 
       let displayPort = getLastContentDisplayportFor('thediv');
@@ -74,8 +74,8 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=1151663
         info("div displayPort: " + JSON.stringify(displayPort));
         info("div width: " + theDiv.clientWidth);
         info("div height: " + theDiv.clientHeight);
-        ok(displayPort.w <= theDiv.clientWidth + 1, "displayPort w should have empty margins");
-        ok(displayPort.h <= theDiv.clientHeight + 1, "displayPort h should have empty margins");
+        ok(displayPort.width <= theDiv.clientWidth + 1, "displayPort w should have empty margins");
+        ok(displayPort.height <= theDiv.clientHeight + 1, "displayPort h should have empty margins");
       } else {
         is(rcd.children.length, 0, "expected no children on the RCD");
         ok(displayPort == null, "should not have displayPort");

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

@@ -16,10 +16,10 @@
   window.addEventListener("message", event => {
     if (event.data == "wereDone") {
       subtestDone();
-    } else if (event.data.x != undefined && event.data.y != undefined && event.data.w != undefined && event.data.h != undefined) {
-      info("event.data " + event.data.x +  " " + event.data.y +  " " + event.data.w +  " " + event.data.h);
+    } else if (event.data.x != undefined && event.data.y != undefined && event.data.width != undefined && event.data.height != undefined) {
+      info("event.data " + event.data.x +  " " + event.data.y +  " " + event.data.width +  " " + event.data.height);
       // 683 = 700 width of iframe minus maximum width of scrollbars seen on try
-      ok(event.data.w >= 683, "dp is wide enough");
+      ok(event.data.width >= 683, "dp is wide enough");
     }
   });
 

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

@@ -28,11 +28,9 @@ html {
     }
     let dp = getLastContentDisplayportFor("helper_wide_crossorigin_iframe_child_docelement", /* expectPainted = */ false);
     if (dp != null) {
-      let result = { x: dp.x, y: dp.y, w: dp.w, h: dp.h };
+      info("result " + dp.x + " " + dp.y + " " + dp.width + " " + dp.height);
 
-      info("result " + dp.x + " " + dp.y + " " + dp.w + " " + dp.h);
-
-      parent.postMessage(result, "*");
+      parent.postMessage(dp, "*");
     } else {
       info("no dp yet");
     }

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

@@ -78,9 +78,9 @@ function hasNonZeroMarginDisplayPort(elementId, containingDoc = null) {
   let elt = (containingDoc != null ? containingDoc : document).getElementById(elementId);
   info(elementId);
   info("window size " + window.innerWidth + " " + window.innerHeight);
-  info("dp " + dp.x + " " + dp.y + " " + dp.w + " " + dp.h);
+  info("dp " + dp.x + " " + dp.y + " " + dp.width + " " + dp.height);
   info("eltsize " + elt.clientWidth + " " + elt.clientHeight);
-  return dp.h >= heightMultiplier * Math.min(elt.clientHeight, window.innerHeight);
+  return dp.height >= heightMultiplier * Math.min(elt.clientHeight, window.innerHeight);
 }
 
 function hasMinimalDisplayPort(elementId, containingDoc = null) {
@@ -90,9 +90,9 @@ function hasMinimalDisplayPort(elementId, containingDoc = null) {
   }
   let elt = (containingDoc != null ? containingDoc : document).getElementById(elementId);
   info(elementId);
-  info("dp " + dp.x + " " + dp.y + " " + dp.w + " " + dp.h);
+  info("dp " + dp.x + " " + dp.y + " " + dp.width + " " + dp.height);
   info("eltsize " + elt.clientWidth + " " + elt.clientHeight);
-  return dp.w <= (elt.clientWidth + 2) && dp.h <= (elt.clientHeight + 2);
+  return dp.width <= (elt.clientWidth + 2) && dp.height <= (elt.clientHeight + 2);
 }
 
 function checkDirectActivation(elementId, containingDoc = null) {