Bug 1290420 Part 5: Change test function waitForViewportResizeTo to check viewport size. r=gl
authorBrad Werth <bwerth@mozilla.com>
Thu, 04 Oct 2018 13:16:52 +0000
changeset 488026 3acd60dbb363995157c4825cd2896158028008e6
parent 488025 e6cfd555f0d1d013d3c9c5f519f96889c2994609
child 488027 5dc2619c0a5bac07a3e7409004589e2fceade1b9
push id246
push userfmarier@mozilla.com
push dateSat, 13 Oct 2018 00:15:40 +0000
reviewersgl
bugs1290420
milestone64.0a1
Bug 1290420 Part 5: Change test function waitForViewportResizeTo to check viewport size. r=gl Several tests of RDM use the helper function waitForViewportResizeTo. This patch changes that function to check the viewport size, not the content size, and to wait on either the content-resized event or the newly-defined viewport-resized event, which is fired on resize when viewport override is active. Differential Revision: https://phabricator.services.mozilla.com/D7202
devtools/client/responsive.html/components/App.js
devtools/client/responsive.html/manager.js
devtools/client/responsive.html/test/browser/head.js
--- a/devtools/client/responsive.html/components/App.js
+++ b/devtools/client/responsive.html/components/App.js
@@ -170,16 +170,21 @@ class App extends PureComponent {
     // property changes are sent from there instead of this function.
     this.props.dispatch(removeDeviceAssociation(id));
     this.props.dispatch(toggleTouchSimulation(false));
     this.props.dispatch(changePixelRatio(id, 0));
     this.props.dispatch(changeUserAgent(""));
   }
 
   onResizeViewport(id, width, height) {
+    window.postMessage({
+      type: "viewport-resize",
+      width,
+      height,
+    }, "*");
     this.props.dispatch(resizeViewport(id, width, height));
   }
 
   onRotateViewport(id) {
     this.props.dispatch(rotateViewport(id));
   }
 
   onScreenshot() {
--- a/devtools/client/responsive.html/manager.js
+++ b/devtools/client/responsive.html/manager.js
@@ -528,16 +528,19 @@ ResponsiveUI.prototype = {
         this.onContentResize(event);
         break;
       case "exit":
         this.onExit();
         break;
       case "remove-device-association":
         this.onRemoveDeviceAssociation(event);
         break;
+      case "viewport-resize":
+        this.onViewportResize(event);
+        break;
     }
   },
 
   async onChangeDevice(event) {
     const { userAgent, pixelRatio, touch } = event.data.device;
     let reloadNeeded = false;
     await this.updateDPPX(pixelRatio);
     reloadNeeded |= await this.updateUserAgent(userAgent) &&
@@ -606,16 +609,24 @@ ResponsiveUI.prototype = {
                     this.reloadOnChange("touchSimulation");
     if (reloadNeeded) {
       this.getViewportBrowser().reload();
     }
     // Used by tests
     this.emit("device-association-removed");
   },
 
+  onViewportResize(event) {
+    const { width, height } = event.data;
+    this.emit("viewport-resize", {
+      width,
+      height,
+    });
+  },
+
   /**
    * Set or clear the emulated device pixel ratio.
    *
    * @return boolean
    *         Whether a reload is needed to apply the change.
    *         (This is always immediate, so it's always false.)
    */
   async updateDPPX(dppx) {
--- a/devtools/client/responsive.html/test/browser/head.js
+++ b/devtools/client/responsive.html/test/browser/head.js
@@ -132,45 +132,49 @@ function waitForFrameLoad(ui, targetURL)
   });
 }
 
 function waitForViewportResizeTo(ui, width, height) {
   return new Promise(async function(resolve) {
     const isSizeMatching = data => data.width == width && data.height == height;
 
     // If the viewport has already the expected size, we resolve the promise immediately.
-    const size = await getContentSize(ui);
+    const size = ui.getViewportSize();
     if (isSizeMatching(size)) {
-      info(`Content already resized to ${width} x ${height}`);
+      info(`Viewport already resized to ${width} x ${height}`);
       resolve();
       return;
     }
 
-    // Otherwise, we'll listen to both content's resize event and browser's load end;
-    // since a racing condition can happen, where the content's listener is added after
-    // the resize, because the content's document was reloaded; therefore the test would
-    // hang forever. See bug 1302879.
+    // Otherwise, we'll listen to the content's resize event, the viewport's resize event,
+    // and the browser's load end; since a racing condition can happen, where the
+    // content's listener is added after the resize, because the content's document was
+    // reloaded; therefore the test would hang forever. See bug 1302879.
     const browser = ui.getViewportBrowser();
 
     const onResize = data => {
       if (!isSizeMatching(data)) {
         return;
       }
+      ui.off("viewport-resize", onResize);
       ui.off("content-resize", onResize);
       browser.removeEventListener("mozbrowserloadend", onBrowserLoadEnd);
-      info(`Got content-resize to ${width} x ${height}`);
+      info(`Got content-resize or viewport-resize to ${width} x ${height}`);
       resolve();
     };
 
     const onBrowserLoadEnd = async function() {
-      const data = await getContentSize(ui);
+      const data = ui.getViewportSize(ui);
       onResize(data);
     };
 
-    info(`Waiting for content-resize to ${width} x ${height}`);
+    info(`Waiting for content-resize or viewport-resize to ${width} x ${height}`);
+    // Depending on whether or not the viewport is overridden, we'll either get a
+    // viewport-resize event or a content-resize event.
+    ui.on("viewport-resize", onResize);
     ui.on("content-resize", onResize);
     browser.addEventListener("mozbrowserloadend",
       onBrowserLoadEnd, { once: true });
   });
 }
 
 var setViewportSize = async function(ui, manager, width, height) {
   const size = ui.getViewportSize();