Bug 1714291 - [devtools] Remove testActor#reflow. r=jdescottes.

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

devtools/client/inspector/test/browser_inspector_highlighter-cssshape_04.js

@@ -76,7 +76,7 @@ async function testPolygonMovePoint(config) {
   await mouse.down(x, y);
   await mouse.move(x + dx, y + dy);
   await mouse.up();
-  await testActor.reflow();
+  await reflowContentPage();
   info("Waiting for rule view changed from shape change");
   await onRuleViewChanged;
 
@@ -121,7 +121,7 @@ async function testPolygonAddPoint(config) {
   await mouse.down(x1, y1);
   await mouse.move(x2, y1);
   await mouse.up();
-  await testActor.reflow();
+  await reflowContentPage();
 
   let newPointX = x2;
   let newPointY = (y1 + y2) / 2;
@@ -136,7 +136,7 @@ async function testPolygonAddPoint(config) {
     gBrowser.selectedTab.linkedBrowser
   );
 
-  await testActor.reflow();
+  await reflowContentPage();
   info("Waiting for rule view changed from shape change");
   await onRuleViewChanged;
 
@@ -249,7 +249,7 @@ async function testCircleMoveCenter(config) {
   await mouse.down(cxPixel, cyPixel, selector);
   await mouse.move(cxPixel + dx, cyPixel + dy, selector);
   await mouse.up(cxPixel + dx, cyPixel + dy, selector);
-  await testActor.reflow();
+  await reflowContentPage();
   info("Waiting for shape changes to apply");
   await onShapeChangeApplied;
 
@@ -321,7 +321,7 @@ async function testEllipseMoveRadius(config) {
   await mouse.down(rxPixel, cyPixel, selector);
   await mouse.move(rxPixel + dx, cyPixel, selector);
   await mouse.up(rxPixel + dx, cyPixel, selector);
-  await testActor.reflow();
+  await reflowContentPage();
 
   info("Moving ellipse ry");
   const onShapeChangeApplied = highlighters.once(
@@ -330,7 +330,7 @@ async function testEllipseMoveRadius(config) {
   await mouse.down(cxPixel, ryPixel, selector);
   await mouse.move(cxPixel, ryPixel - dy, selector);
   await mouse.up(cxPixel, ryPixel - dy, selector);
-  await testActor.reflow();
+  await reflowContentPage();
   await onShapeChangeApplied;
 
   const definition = await getComputedPropertyValue(
@@ -401,7 +401,7 @@ async function testInsetMoveEdges(config) {
   await mouse.down(xCenter, top, selector);
   await mouse.move(xCenter, top + dy, selector);
   await mouse.up(xCenter, top + dy, selector);
-  await testActor.reflow();
+  await reflowContentPage();
   await onShapeChangeApplied;
 
   // TODO: Test bottom inset marker after Bug 1456777 is fixed.
@@ -416,7 +416,7 @@ async function testInsetMoveEdges(config) {
   await mouse.down(left, yCenter, selector);
   await mouse.move(left + dx, yCenter, selector);
   await mouse.up(left + dx, yCenter, selector);
-  await testActor.reflow();
+  await reflowContentPage();
   await onShapeChangeApplied;
 
   info("Moving inset right");
@@ -426,7 +426,7 @@ async function testInsetMoveEdges(config) {
   await mouse.down(right, yCenter, selector);
   await mouse.move(right + dx, yCenter, selector);
   await mouse.up(right + dx, yCenter, selector);
-  await testActor.reflow();
+  await reflowContentPage();
   await onShapeChangeApplied;
 
   const definition = await getComputedPropertyValue(

devtools/client/inspector/test/browser_inspector_highlighter-cssshape_06-scale.js

@@ -34,7 +34,7 @@ async function teardown(config) {
 }
 
 async function testScale(config) {
-  const { testActor, helper, highlighters } = config;
+  const { helper, highlighters } = config;
   const options = { transformMode: true };
   const property = "clip-path";
 
@@ -55,7 +55,7 @@ async function testScale(config) {
       await mouse.down(x, y, selector);
       await mouse.move(x + dx, y + dy, selector);
       await mouse.up(x + dx, y + dy, selector);
-      await testActor.reflow();
+      await reflowContentPage();
       nw[0] += dx;
       nw[1] += dy;
     }
@@ -70,7 +70,7 @@ async function testScale(config) {
     await mouse.down(nw[0], nw[1], selector);
     await mouse.move(nw[0] + dx, nw[1] + dy, selector);
     await mouse.up(nw[0] + dx, nw[1] + dy, selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     const nwBB = await getBoundingBoxInPx({ selector, ...config });
@@ -86,7 +86,7 @@ async function testScale(config) {
     await mouse.down(nwBB.ne[0], nwBB.ne[1], selector);
     await mouse.move(nwBB.ne[0] - dx, nwBB.ne[1] + dy, selector);
     await mouse.up(nwBB.ne[0] - dx, nwBB.ne[1] + dy, selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     const neBB = await getBoundingBoxInPx({ selector, ...config });
@@ -106,7 +106,7 @@ async function testScale(config) {
     await mouse.down(neBB.sw[0], neBB.sw[1], selector);
     await mouse.move(neBB.sw[0] + dx, neBB.sw[1] - dy, selector);
     await mouse.up(neBB.sw[0] + dx, neBB.sw[1] - dy, selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     const swBB = await getBoundingBoxInPx({ selector, ...config });
@@ -126,7 +126,7 @@ async function testScale(config) {
     await mouse.down(swBB.se[0], swBB.se[1], selector);
     await mouse.move(swBB.se[0] - dx, swBB.se[1] - dy, selector);
     await mouse.up(swBB.se[0] - dx, swBB.se[1] - dy, selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     const seBB = await getBoundingBoxInPx({ selector, ...config });

devtools/client/inspector/test/browser_inspector_highlighter-cssshape_06-translate.js

@@ -34,7 +34,7 @@ async function teardown(config) {
 }
 
 async function testTranslate(config) {
-  const { testActor, helper, highlighters } = config;
+  const { helper, highlighters } = config;
   const options = { transformMode: true };
   const property = "clip-path";
 
@@ -58,7 +58,7 @@ async function testTranslate(config) {
     await mouse.down(x, y, selector);
     await mouse.move(x + dx, y + dy, selector);
     await mouse.up(x + dx, y + dy, selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     let newBB = await getBoundingBoxInPx({ selector, ...config });
@@ -72,7 +72,7 @@ async function testTranslate(config) {
     await mouse.down(x + dx, y + dy, selector);
     await mouse.move(x, y, selector);
     await mouse.up(x, y, selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     newBB = await getBoundingBoxInPx({ selector, ...config });

devtools/client/inspector/test/browser_inspector_highlighter-cssshape_07.js

@@ -34,7 +34,7 @@ async function teardown(config) {
 }
 
 async function testOneDimScale(config) {
-  const { testActor, helper, highlighters } = config;
+  const { helper, highlighters } = config;
   const options = { transformMode: true };
   const property = "clip-path";
 
@@ -55,7 +55,7 @@ async function testOneDimScale(config) {
       await mouse.down(x, y, selector);
       await mouse.move(x + dx, y + dy, selector);
       await mouse.up(x + dx, y + dy, selector);
-      await testActor.reflow();
+      await reflowContentPage();
       nw[0] += dx;
       nw[1] += dy;
     }
@@ -70,7 +70,7 @@ async function testOneDimScale(config) {
     await mouse.down(nw[0], center[1], selector);
     await mouse.move(nw[0] + dx, center[1], selector);
     await mouse.up(nw[0] + dx, center[1], selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     const wBB = await getBoundingBoxInPx({ selector, ...config });
@@ -86,7 +86,7 @@ async function testOneDimScale(config) {
     await mouse.down(wBB.ne[0], center[1], selector);
     await mouse.move(wBB.ne[0] - dx, center[1], selector);
     await mouse.up(wBB.ne[0] - dx, center[1], selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     const eBB = await getBoundingBoxInPx({ selector, ...config });
@@ -102,7 +102,7 @@ async function testOneDimScale(config) {
     await mouse.down(eBB.center[0], eBB.sw[1], selector);
     await mouse.move(eBB.center[0], eBB.sw[1] - dy, selector);
     await mouse.up(eBB.center[0], eBB.sw[1] - dy, selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     const sBB = await getBoundingBoxInPx({ selector, ...config });
@@ -118,7 +118,7 @@ async function testOneDimScale(config) {
     await mouse.down(sBB.center[0], sBB.nw[1], selector);
     await mouse.move(sBB.center[0], sBB.nw[1] + dy, selector);
     await mouse.up(sBB.center[0], sBB.nw[1] + dy, selector);
-    await testActor.reflow();
+    await reflowContentPage();
     await onShapeChangeApplied;
 
     const nBB = await getBoundingBoxInPx({ selector, ...config });

devtools/client/inspector/test/browser_inspector_highlighter-cssshape_iframe_01.js

@@ -12,16 +12,16 @@ const HIGHLIGHTER_TYPE = "ShapesHighlighter";
 add_task(async function() {
   const env = await openInspectorForURL(TEST_URL);
   const helper = await getHighlighterHelperFor(HIGHLIGHTER_TYPE)(env);
-  const { testActor, inspector } = env;
+  const { inspector } = env;
   const view = selectRuleView(inspector);
   const highlighters = view.highlighters;
-  const config = { inspector, view, highlighters, testActor, helper };
+  const config = { inspector, view, highlighters, helper };
 
   await testPolygonIframeMovePoint(config);
 });
 
 async function testPolygonIframeMovePoint(config) {
-  const { inspector, view, testActor, helper } = config;
+  const { inspector, view, helper } = config;
   const selector = "#polygon";
   const property = "clip-path";
 
@@ -46,7 +46,7 @@ async function testPolygonIframeMovePoint(config) {
   await mouse.down(10, 10);
   await mouse.move(20, 20);
   await mouse.up();
-  await testActor.reflow();
+  await reflowContentPage();
   await onRuleViewChanged;
 
   let computedStyle = await highlightedNode.inspectorFront.pageStyle.getComputed(
@@ -61,7 +61,7 @@ async function testPolygonIframeMovePoint(config) {
   await mouse.down(110, 410);
   await mouse.move(120, 420);
   await mouse.up();
-  await testActor.reflow();
+  await reflowContentPage();
   await onRuleViewChanged;
 
   computedStyle = await highlightedNode.inspectorFront.pageStyle.getComputed(

devtools/client/inspector/test/browser_inspector_highlighter-geometry_06.js

@@ -90,7 +90,7 @@ async function executeTest(helper, desc, data) {
 }
 
 async function areElementAndHighlighterMovedCorrectly(helper, side, by) {
-  const { mouse, reflow, highlightedNode } = helper;
+  const { mouse, highlightedNode } = helper;
 
   const { x, y } = await getHandlerCoords(helper, side);
 
@@ -104,7 +104,7 @@ async function areElementAndHighlighterMovedCorrectly(helper, side, by) {
   await mouse.move(dx, dy);
   await mouse.up();
 
-  await reflow();
+  await reflowContentPage();
 
   info(`Checking ${side} handler is moved correctly`);
   await isHandlerPositionUpdated(helper, side, x, y, by);

devtools/client/inspector/test/head.js

@@ -1401,3 +1401,15 @@ async function deleteNodeWithContextMenu(node, inspector) {
     await inspector.once("breadcrumbs-updated");
   }
 }
+
+/**
+ * Forces the content page to reflow and waits for the next repaint.
+ */
+function reflowContentPage() {
+  return SpecialPowers.spawn(gBrowser.selectedBrowser, [], async function() {
+    return new Promise(resolve => {
+      content.document.documentElement.offsetWidth;
+      content.requestAnimationFrame(resolve);
+    });
+  });
+}

devtools/client/shared/test/test-actor.js

@@ -187,7 +187,6 @@ var testSpec = protocol.generateActorSpec({
         value: RetVal("json"),
       },
     },
-    reflow: {},
     getNodeRect: {
       request: {
         selector: Arg(0, "string"),
@@ -587,16 +586,6 @@ var TestActor = protocol.ActorClassWithSpec(testSpec, {
     });
   },
 
-  /**
-   * Forces the reflow and waits for the next repaint.
-   */
-  reflow: function() {
-    return new Promise(resolve => {
-      this.content.document.documentElement.offsetWidth;
-      this.content.requestAnimationFrame(resolve);
-    });
-  },
-
   async getNodeRect(selector) {
     const node = this._querySelector(selector);
     return getRect(this.content, node, this.content);