Bug 1240896 - Rebuild existing RDM browser tests to work with remote frames. r=me

MozReview-Commit-ID: 9h1e4wjZjDo

devtools/client/responsive.html/index.js

@@ -136,7 +136,10 @@ window.setViewportSize = (width, height) => {
 
 /**
  * Called by manager.js when tests want to use the viewport's message manager.
+ * It is packed into an object because this is the format most easily usable
+ * with ContentTask.spawn().
  */
 window.getViewportMessageManager = () => {
-  return document.querySelector("iframe.browser").frameLoader;
+  let { messageManager } = document.querySelector("iframe.browser").frameLoader;
+  return { messageManager };
 };

devtools/client/responsive.html/test/browser/browser_exit_button.js

@@ -14,10 +14,9 @@ addRDMTask(TEST_URL, function*({ ui, manager }) {
   // Wait until the viewport has been added
   yield waitUntilState(store, state => state.viewports.length == 1);
 
-  let browser = toolWindow.document.querySelector(".browser");
   let exitButton = toolWindow.document.getElementById("global-exit-button");
 
-  yield waitForFrameLoad(browser, TEST_URL);
+  yield waitForFrameLoad(ui, TEST_URL);
 
   ok(manager.isActiveForTab(ui.tab),
     "Responsive Design Mode active for the tab");

devtools/client/responsive.html/test/browser/browser_viewport_basics.js

@@ -14,16 +14,17 @@ addRDMTask(TEST_URL, function*({ ui }) {
   yield waitUntilState(store, state => state.viewports.length == 1);
 
   // A single viewport of default size appeared
-  let browser = ui.toolWindow.document.querySelector(".browser");
-  is(browser.width, "320", "Viewport has default width");
-  is(browser.height, "480", "Viewport has default height");
+  let viewport = ui.toolWindow.document.querySelector(".viewport-content");
+
+  is(ui.toolWindow.getComputedStyle(viewport).getPropertyValue("width"),
+     "320px", "Viewport has default width");
+  is(ui.toolWindow.getComputedStyle(viewport).getPropertyValue("height"),
+     "480px", "Viewport has default height");
 
   // Browser's location should match original tab
-  // TODO: For the moment, we have parent process <iframe>s and we can just
-  // check the location directly.  Bug 1240896 will change this to <iframe
-  // mozbrowser remote>, which is in the child process, so ContentTask or
-  // similar will be needed.
-  yield waitForFrameLoad(browser, TEST_URL);
-  is(browser.contentWindow.location.href, TEST_URL,
-     "Viewport location matches");
+  yield waitForFrameLoad(ui, TEST_URL);
+  let location = yield spawnViewportTask(ui, {}, function*() {
+    return content.location.href;
+  });
+  is(location, TEST_URL, "Viewport location matches");
 });

devtools/client/responsive.html/test/browser/head.js

@@ -54,7 +54,7 @@ var openRDM = Task.async(function*(tab) {
 var closeRDM = Task.async(function*(tab) {
   info("Closing responsive design mode");
   let manager = ResponsiveUIManager;
-  manager.closeIfNeeded(window, tab);
+  yield manager.closeIfNeeded(window, tab);
   info("Responsive design mode closed");
 });
 
@@ -85,15 +85,20 @@ function addRDMTask(url, generator) {
   });
 }
 
-var waitForFrameLoad = Task.async(function*(frame, targetURL) {
-  let window = frame.contentWindow;
-  if ((window.document.readyState == "complete" ||
-       window.document.readyState == "interactive") &&
-      window.location.href == targetURL) {
-    return;
-  }
-  yield once(frame, "load");
-});
+function spawnViewportTask(ui, args, task) {
+  return ContentTask.spawn(ui.getViewportMessageManager(), args, task);
+}
+
+function waitForFrameLoad(ui, targetURL) {
+  return spawnViewportTask(ui, { targetURL }, function*(args) {
+    if ((content.document.readyState == "complete" ||
+         content.document.readyState == "interactive") &&
+        content.location.href == args.targetURL) {
+      return;
+    }
+    yield ContentTaskUtils.waitForEvent(this, "DOMContentLoaded");
+  });
+}
 
 function waitForViewportResizeTo(ui, width, height) {
   return new Promise(resolve => {