Bug 1306816 - Fix intermittent failure in RDM device change test. r=gl draft
authorJ. Ryan Stinnett <jryans@gmail.com>
Tue, 25 Oct 2016 21:16:41 -0500
changeset 429841 40fbe23262faff2a8126c484d18f7e3b572e030e
parent 429594 f9f3cc95d7282f1fd83f66dd74acbcdbfe821915
child 535071 5c659db140324a5caff863942ef5a62937374c11
push id33679
push userbmo:jryans@gmail.com
push dateWed, 26 Oct 2016 18:26:20 +0000
reviewersgl
bugs1306816
milestone52.0a1
Bug 1306816 - Fix intermittent failure in RDM device change test. r=gl MozReview-Commit-ID: 4pwNX4oyMyg
devtools/client/responsive.html/components/resizable-viewport.js
devtools/client/responsive.html/manager.js
devtools/client/responsive.html/test/browser/browser_device_change.js
devtools/client/responsive.html/test/browser/browser_network_throttling.js
devtools/client/responsive.html/test/browser/head.js
--- a/devtools/client/responsive.html/components/resizable-viewport.js
+++ b/devtools/client/responsive.html/components/resizable-viewport.js
@@ -102,16 +102,18 @@ module.exports = createClass({
       height = VIEWPORT_MIN_HEIGHT;
     } else {
       lastClientY = clientY;
     }
 
     // Update the viewport store with the new width and height.
     this.props.onResizeViewport(width, height);
     // Change the device selector back to an unselected device
+    // TODO: Bug 1313140: We should avoid calling this for every resize event, since it
+    // triggers RDP calls each time.
     this.props.onChangeViewportDevice({ name: "" });
 
     this.setState({
       lastClientX,
       lastClientY
     });
   },
 
--- a/devtools/client/responsive.html/manager.js
+++ b/devtools/client/responsive.html/manager.js
@@ -466,22 +466,24 @@ ResponsiveUI.prototype = {
 
   onChangeNetworkThrottling: Task.async(function* (event) {
     let { enabled, profile } = event.data;
     yield this.updateNetworkThrottling(enabled, profile);
     // Used by tests
     this.emit("network-throttling-changed");
   }),
 
-  onChangeViewportDevice(event) {
+  onChangeViewportDevice: Task.async(function* (event) {
     let { userAgent, pixelRatio, touch } = event.data.device;
-    this.updateUserAgent(userAgent);
-    this.updateDPPX(pixelRatio);
-    this.updateTouchSimulation(touch);
-  },
+    yield this.updateUserAgent(userAgent);
+    yield this.updateDPPX(pixelRatio);
+    yield this.updateTouchSimulation(touch);
+    // Used by tests
+    this.emit("viewport-device-changed");
+  }),
 
   onContentResize(event) {
     let { width, height } = event.data;
     this.emit("content-resize", {
       width,
       height,
     });
   },
@@ -491,45 +493,45 @@ ResponsiveUI.prototype = {
     ResponsiveUIManager.closeIfNeeded(browserWindow, tab);
   },
 
   onUpdateTouchSimulation(event) {
     let { enabled } = event.data;
     this.updateTouchSimulation(enabled);
   },
 
-  updateDPPX(dppx) {
+  updateDPPX: Task.async(function* (dppx) {
     if (!dppx) {
-      this.emulationFront.clearDPPXOverride();
+      yield this.emulationFront.clearDPPXOverride();
       return;
     }
-    this.emulationFront.setDPPXOverride(dppx);
-  },
+    yield this.emulationFront.setDPPXOverride(dppx);
+  }),
 
   updateNetworkThrottling: Task.async(function* (enabled, profile) {
     if (!enabled) {
       yield this.emulationFront.clearNetworkThrottling();
       return;
     }
     let data = throttlingProfiles.find(({ id }) => id == profile);
     let { download, upload, latency } = data;
     yield this.emulationFront.setNetworkThrottling({
       downloadThroughput: download,
       uploadThroughput: upload,
       latency,
     });
   }),
 
-  updateUserAgent(userAgent) {
+  updateUserAgent: Task.async(function* (userAgent) {
     if (!userAgent) {
-      this.emulationFront.clearUserAgentOverride();
+      yield this.emulationFront.clearUserAgentOverride();
       return;
     }
-    this.emulationFront.setUserAgentOverride(userAgent);
-  },
+    yield this.emulationFront.setUserAgentOverride(userAgent);
+  }),
 
   updateTouchSimulation: Task.async(function* (enabled) {
     if (!enabled) {
       yield this.emulationFront.clearTouchEventsOverride();
       return;
     }
     let reloadNeeded = yield this.emulationFront.setTouchEventsOverride(
       Ci.nsIDocShell.TOUCHEVENTS_OVERRIDE_ENABLED
--- a/devtools/client/responsive.html/test/browser/browser_device_change.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_change.js
@@ -45,18 +45,20 @@ addRDMTask(TEST_URL, function* ({ ui, ma
   // Test device with custom properties
   yield switchDevice(ui, "Fake Phone RDM Test");
   yield waitForViewportResizeTo(ui, testDevice.width, testDevice.height);
   yield testUserAgent(ui, testDevice.userAgent);
   yield testDevicePixelRatio(ui, testDevice.pixelRatio);
   yield testTouchEventsOverride(ui, true);
 
   // Test resetting device when resizing viewport
+  let deviceChanged = once(ui, "viewport-device-changed");
   yield testViewportResize(ui, ".viewport-vertical-resize-handle",
     [-10, -10], [testDevice.width, testDevice.height - 10], [0, -10], ui);
+  yield deviceChanged;
   yield testUserAgent(ui, DEFAULT_UA);
   yield testDevicePixelRatio(ui, DEFAULT_DPPX);
   yield testTouchEventsOverride(ui, false);
   testViewportSelectLabel(ui, "no device selected");
 
   // Test device with generic properties
   yield switchDevice(ui, "Laptop (1366 x 768)");
   yield waitForViewportResizeTo(ui, 1366, 768);
--- a/devtools/client/responsive.html/test/browser/browser_network_throttling.js
+++ b/devtools/client/responsive.html/test/browser/browser_network_throttling.js
@@ -20,19 +20,17 @@ addRDMTask(TEST_URL, function* ({ ui, ma
 
   // Test a fast profile
   yield testThrottlingProfile(ui, "Wi-Fi");
 
   // Test a slower profile
   yield testThrottlingProfile(ui, "Regular 3G");
 
   // Test switching back to no throttling
-  let changed = once(ui, "network-throttling-changed");
   yield switchNetworkThrottling(ui, "No throttling");
-  yield changed;
   testNetworkThrottlingSelectorLabel(ui, "No throttling");
   yield testNetworkThrottlingState(ui, null);
 });
 
 function testNetworkThrottlingSelectorLabel(ui, expected) {
   let selector = "#global-network-throttling-selector";
   let select = ui.toolWindow.document.querySelector(selector);
   is(select.selectedOptions[0].textContent, expected,
@@ -41,19 +39,17 @@ function testNetworkThrottlingSelectorLa
 
 var testNetworkThrottlingState = Task.async(function* (ui, expected) {
   let state = yield ui.emulationFront.getNetworkThrottling();
   Assert.deepEqual(state, expected, "Network throttling state should be " +
                                     JSON.stringify(expected, null, 2));
 });
 
 var testThrottlingProfile = Task.async(function* (ui, profile) {
-  let changed = once(ui, "network-throttling-changed");
   yield switchNetworkThrottling(ui, profile);
-  yield changed;
   testNetworkThrottlingSelectorLabel(ui, profile);
   let data = throttlingProfiles.find(({ id }) => id == profile);
   let { download, upload, latency } = data;
   yield testNetworkThrottlingState(ui, {
     downloadThroughput: download,
     uploadThroughput: upload,
     latency,
   });
--- a/devtools/client/responsive.html/test/browser/head.js
+++ b/devtools/client/responsive.html/test/browser/head.js
@@ -193,19 +193,21 @@ function dragElementBy(selector, x, y, w
 
   return rect;
 }
 
 function* testViewportResize(ui, selector, moveBy,
                              expectedViewportSize, expectedHandleMove) {
   let win = ui.toolWindow;
 
+  let changed = once(ui, "viewport-device-changed");
   let resized = waitForViewportResizeTo(ui, ...expectedViewportSize);
   let startRect = dragElementBy(selector, ...moveBy, win);
   yield resized;
+  yield changed;
 
   let endRect = getElRect(selector, win);
   is(endRect.left - startRect.left, expectedHandleMove[0],
     `The x move of ${selector} is as expected`);
   is(endRect.top - startRect.top, expectedHandleMove[1],
     `The y move of ${selector} is as expected`);
 }
 
@@ -251,23 +253,27 @@ function switchSelector({ toolWindow }, 
       resolve();
     }, { once: true });
 
     select.value = value;
     select.dispatchEvent(event);
   });
 }
 
-function switchDevice(ui, value) {
-  return switchSelector(ui, ".viewport-device-selector", value);
-}
+let switchDevice = Task.async(function* (ui, value) {
+  let changed = once(ui, "viewport-device-changed");
+  yield switchSelector(ui, ".viewport-device-selector", value);
+  yield changed;
+});
 
-function switchNetworkThrottling(ui, value) {
-  return switchSelector(ui, "#global-network-throttling-selector", value);
-}
+let switchNetworkThrottling = Task.async(function* (ui, value) {
+  let changed = once(ui, "network-throttling-changed");
+  yield switchSelector(ui, "#global-network-throttling-selector", value);
+  yield changed;
+});
 
 function getSessionHistory(browser) {
   return ContentTask.spawn(browser, {}, function* () {
     /* eslint-disable no-undef */
     let { interfaces: Ci } = Components;
     let webNav = docShell.QueryInterface(Ci.nsIWebNavigation);
     let sessionHistory = webNav.sessionHistory;
     let result = {