From 70aa58af8f45c88a9479331d14ffdd5473c8d899 Mon Sep 17 00:00:00 2001 From: Nicolas Chevobbe Date: Fri, 4 Jun 2021 05:27:35 +0000 Subject: [PATCH] Bug 1714291 - [devtools] Remove testActor#reflow. r=jdescottes. Differential Revision: https://phabricator.services.mozilla.com/D116691 --- ...rowser_inspector_highlighter-cssshape_04.js | 18 +++++++++--------- ..._inspector_highlighter-cssshape_06-scale.js | 12 ++++++------ ...pector_highlighter-cssshape_06-translate.js | 6 +++--- ...rowser_inspector_highlighter-cssshape_07.js | 12 ++++++------ ...inspector_highlighter-cssshape_iframe_01.js | 10 +++++----- ...rowser_inspector_highlighter-geometry_06.js | 4 ++-- devtools/client/inspector/test/head.js | 12 ++++++++++++ devtools/client/shared/test/test-actor.js | 11 ----------- 8 files changed, 43 insertions(+), 42 deletions(-) diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_04.js b/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_04.js index 521aa03ce354..bc0fd47c1ab4 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_04.js +++ b/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( diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_06-scale.js b/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_06-scale.js index a479cdea9475..0a2390431d38 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_06-scale.js +++ b/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 }); diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_06-translate.js b/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_06-translate.js index 0e54d7dc4f48..4bc5406b9c12 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_06-translate.js +++ b/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 }); diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_07.js b/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_07.js index ce8fc67f1499..74ff527a5973 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_07.js +++ b/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 }); diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_iframe_01.js b/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_iframe_01.js index 33667148fc2d..5f00a812d964 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-cssshape_iframe_01.js +++ b/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( diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-geometry_06.js b/devtools/client/inspector/test/browser_inspector_highlighter-geometry_06.js index 0a629d0f26e5..52aca021e019 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-geometry_06.js +++ b/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); diff --git a/devtools/client/inspector/test/head.js b/devtools/client/inspector/test/head.js index 93d2b4d5559e..27b4a2689b8a 100644 --- a/devtools/client/inspector/test/head.js +++ b/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); + }); + }); +} diff --git a/devtools/client/shared/test/test-actor.js b/devtools/client/shared/test/test-actor.js index 3b67650a09eb..fa02eb7568c2 100644 --- a/devtools/client/shared/test/test-actor.js +++ b/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);