Backed out changeset 09ab2331ee63 (bug 1181837) on request

--HG--
extra : commitid : JkBFtKkcwPf

devtools/client/inspector/layout/test/browser_layout_editablemodel.js

@@ -30,7 +30,7 @@ addTest("Test that editing margin dynamically updates the document, pressing esc
 function*(inspector, view) {
   let node = content.document.getElementById("div1");
   is(getStyle(node, "margin-top"), "", "Should be no margin-top on the element.")
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".margin.top > span");
   is(span.textContent, 5, "Should have the right value in the box model.");
@@ -56,7 +56,7 @@ addTest("Test that arrow keys work correctly and pressing enter commits the chan
 function*(inspector, view) {
   let node = content.document.getElementById("div1");
   is(getStyle(node, "margin-left"), "", "Should be no margin-top on the element.")
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".margin.left > span");
   is(span.textContent, 10, "Should have the right value in the box model.");
@@ -93,7 +93,7 @@ addTest("Test that deleting the value removes the property but escape undoes tha
 function*(inspector, view) {
   let node = content.document.getElementById("div1");
   is(getStyle(node, "margin-left"), "20px", "Should be the right margin-top on the element.")
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".margin.left > span");
   is(span.textContent, 20, "Should have the right value in the box model.");
@@ -123,7 +123,7 @@ function*(inspector, view) {
   node.style.marginRight = "15px";
   yield waitForUpdate(inspector);
 
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".margin.right > span");
   is(span.textContent, 15, "Should have the right value in the box model.");

devtools/client/inspector/layout/test/browser_layout_editablemodel_allproperties.js

@@ -32,7 +32,7 @@ function*(inspector, view) {
   node.style.padding = "5px";
   yield waitForUpdate(inspector);
 
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".padding.bottom > span");
   is(span.textContent, 5, "Should have the right value in the box model.");
@@ -61,7 +61,7 @@ function*(inspector, view) {
   node.style.padding = "5px";
   yield waitForUpdate(inspector);
 
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".padding.left > span");
   is(span.textContent, 5, "Should have the right value in the box model.");
@@ -90,7 +90,7 @@ function*(inspector, view) {
 
   node.style.padding = "5px";
 
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".padding.left > span");
   is(span.textContent, 5, "Should have the right value in the box model.");
@@ -119,7 +119,7 @@ function*(inspector, view) {
   node.style.padding = "5px";
   yield waitForUpdate(inspector);
 
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".padding.left > span");
   is(span.textContent, 5, "Should have the right value in the box model.");

devtools/client/inspector/layout/test/browser_layout_editablemodel_border.js

@@ -25,7 +25,7 @@ add_task(function*() {
   let node = content.document.getElementById("div1");
   is(getStyle(node, "border-top-width"), "", "Should have the right border");
   is(getStyle(node, "border-top-style"), "", "Should have the right border");
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".border.top > span");
   is(span.textContent, 0, "Should have the right value in the box model.");

devtools/client/inspector/layout/test/browser_layout_editablemodel_stylerules.js

@@ -30,7 +30,7 @@ addTest("Test that entering units works",
 function*(inspector, view) {
   let node = content.document.getElementById("div1");
   is(getStyle(node, "padding-top"), "", "Should have the right padding");
-  yield selectNode("#div1", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".padding.top > span");
   is(span.textContent, 3, "Should have the right value in the box model.");
@@ -63,7 +63,7 @@ addTest("Test that we pick up the value from a higher style rule",
 function*(inspector, view) {
   let node = content.document.getElementById("div2");
   is(getStyle(node, "border-bottom-width"), "", "Should have the right border-bottom-width");
-  yield selectNode("#div2", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".border.bottom > span");
   is(span.textContent, 16, "Should have the right value in the box model.");
@@ -89,7 +89,7 @@ addTest("Test that shorthand properties are parsed correctly",
 function*(inspector, view) {
   let node = content.document.getElementById("div3");
   is(getStyle(node, "padding-right"), "", "Should have the right padding");
-  yield selectNode("#div3", inspector);
+  yield selectNode(node, inspector);
 
   let span = view.doc.querySelector(".padding.right > span");
   is(span.textContent, 32, "Should have the right value in the box model.");

devtools/client/inspector/layout/test/browser_layout_update-after-navigation.js

@@ -8,7 +8,7 @@
 // it also works after going back
 
 add_task(function*() {
-  yield addTab(URL_ROOT + "doc_layout_iframe1.html");
+  yield addTab(TEST_URL_ROOT + "doc_layout_iframe1.html");
   let {toolbox, inspector, view} = yield openLayoutView();
   yield runTests(inspector, view);
 });
@@ -34,7 +34,7 @@ function*(inspector, view) {
 
 addTest("Navigate to the second page",
 function*(inspector, view) {
-  yield navigateTo(URL_ROOT + "doc_layout_iframe2.html");
+  yield navigateTo(TEST_URL_ROOT + "doc_layout_iframe2.html");
   yield inspector.once("markuploaded");
 });
 

devtools/client/inspector/layout/test/browser_layout_update-after-reload.js

@@ -7,7 +7,7 @@
 // Test that the layout-view continues to work after the page is reloaded
 
 add_task(function*() {
-  yield addTab(URL_ROOT + "doc_layout_iframe1.html");
+  yield addTab(TEST_URL_ROOT + "doc_layout_iframe1.html");
   let {toolbox, inspector, view} = yield openLayoutView();
 
   info("Test that the layout-view works on the first page");

devtools/client/inspector/layout/test/browser_layout_update-in-iframes.js

@@ -8,7 +8,7 @@
 // change
 
 add_task(function*() {
-  yield addTab(URL_ROOT + "doc_layout_iframe1.html");
+  yield addTab(TEST_URL_ROOT + "doc_layout_iframe1.html");
   let iframe2 = getNode("iframe").contentDocument.querySelector("iframe");
 
   let {toolbox, inspector, view} = yield openLayoutView();
@@ -19,7 +19,7 @@ addTest("Test that resizing an element in an iframe updates its box model",
 function*(inspector, view, iframe2) {
   info("Selecting the nested test node");
   let node = iframe2.contentDocument.querySelector("div");
-  yield selectNodeInIframe2("div", inspector);
+  yield selectNode(node, inspector);
 
   info("Checking that the layout-view shows the right value");
   let sizeElt = view.doc.querySelector(".size > span");
@@ -43,7 +43,7 @@ function*(inspector, view, iframe2) {
 
   info("Selecting the test node in iframe1");
   let node = getNode("iframe").contentDocument.querySelector("p");
-  yield selectNodeInIframe2("p", inspector);
+  yield selectNode(node, inspector);
 
   info("Checking that the layout-view shows the right value");
   let sizeElt = view.doc.querySelector(".size > span");
@@ -58,10 +58,3 @@ function*(inspector, view, iframe2) {
   info("Checking that the layout-view shows the right value after update");
   is(sizeElt.textContent, "200x100");
 });
-
-function* selectNodeInIframe2(selector, inspector) {
-  let iframe1 = yield getNodeFront("iframe", inspector);
-  let iframe2 = yield getNodeFrontInFrame("iframe", iframe1, inspector);
-  let node = yield getNodeFrontInFrame(selector, iframe2, inspector);
-  yield selectNode(node, inspector);
-}

devtools/client/inspector/layout/test/head.js

@@ -1,23 +1,81 @@
 /* vim: set ft=javascript ts=2 et sw=2 tw=80: */
 /* Any copyright is dedicated to the Public Domain.
  http://creativecommons.org/publicdomain/zero/1.0/ */
+
 "use strict";
 
-// Import the inspector's head.js first (which itself imports shared-head.js).
+var Cu = Components.utils;
-Services.scriptloader.loadSubScript(
+var {gDevTools} = Cu.import("resource://devtools/client/framework/gDevTools.jsm", {});
-  "chrome://mochitests/content/browser/devtools/client/inspector/test/head.js",
+var {require} = Cu.import("resource://devtools/shared/Loader.jsm", {});
-  this);
+var {console} = Cu.import("resource://gre/modules/Console.jsm", {});
+var {TargetFactory} = require("devtools/client/framework/target");
+var promise = require("promise");
+var DevToolsUtils = require("devtools/shared/DevToolsUtils");
 
+// All test are asynchronous
+waitForExplicitFinish();
+
+const TEST_URL_ROOT =
+  "http://example.com/browser/devtools/client/inspector/layout/test/";
+
+// Uncomment this pref to dump all devtools emitted events to the console.
+// Services.prefs.setBoolPref("devtools.dump.emit", true);
+
+// Services.prefs.setBoolPref("devtools.debugger.log", true);
+
+// Set the testing flag on DevToolsUtils and reset it when the test ends
+DevToolsUtils.testing = true;
+registerCleanupFunction(() => DevToolsUtils.testing = false);
+
+// Clean-up all prefs that might have been changed during a test run
+// (safer here because if the test fails, then the pref is never reverted)
 Services.prefs.setIntPref("devtools.toolbox.footer.height", 350);
 registerCleanupFunction(() => {
+  Services.prefs.clearUserPref("devtools.dump.emit");
+  Services.prefs.clearUserPref("devtools.debugger.log");
   Services.prefs.clearUserPref("devtools.toolbox.footer.height");
+  Services.prefs.setCharPref("devtools.inspector.activeSidebar", "ruleview");
 });
 
+registerCleanupFunction(function*() {
+  let target = TargetFactory.forTab(gBrowser.selectedTab);
+  yield gDevTools.closeToolbox(target);
+
+  // Move the mouse outside inspector. If the test happened fake a mouse event
+  // somewhere over inspector the pointer is considered to be there when the
+  // next test begins. This might cause unexpected events to be emitted when
+  // another test moves the mouse.
+  EventUtils.synthesizeMouseAtPoint(1, 1, {type: "mousemove"}, window);
+
+  while (gBrowser.tabs.length > 1) {
+    gBrowser.removeCurrentTab();
+  }
+});
+
+/**
+ * Add a new test tab in the browser and load the given url.
+ * @param {String} url The url to be loaded in the new tab
+ * @return a promise that resolves to the tab object when the url is loaded
+ */
+function addTab(url) {
+  let def = promise.defer();
+
+  let tab = gBrowser.selectedTab = gBrowser.addTab();
+  gBrowser.selectedBrowser.addEventListener("load", function onload() {
+    gBrowser.selectedBrowser.removeEventListener("load", onload, true);
+    info("URL " + url + " loading complete into new test tab");
+    waitForFocus(() => {
+      def.resolve(tab);
+    }, content);
+  }, true);
+  content.location = url;
+
+  return def.promise;
+}
+
 /**
  * Simple DOM node accesor function that takes either a node or a string css
  * selector as argument and returns the corresponding node
- * FIXME: Delete this function and use inspector/test/head.js' getNode instead,
- * and fix all layout-view tests to use nodeFronts instead of CPOWs.
  * @param {String|DOMNode} nodeOrSelector
  * @return {DOMNode}
  */
@@ -45,6 +103,92 @@ function selectAndHighlightNode(nodeOrSelector, inspector) {
   return updated;
 }
 
+/**
+ * Set the inspector's current selection to a node or to the first match of the
+ * given css selector.
+ * @param {String|DOMNode} nodeOrSelector
+ * @param {InspectorPanel} inspector
+ *        The instance of InspectorPanel currently loaded in the toolbox
+ * @param {String} reason
+ *        Defaults to "test" which instructs the inspector not to highlight the
+ *        node upon selection
+ * @return a promise that resolves when the inspector is updated with the new
+ * node
+ */
+function selectNode(nodeOrSelector, inspector, reason = "test") {
+  info("Selecting the node " + nodeOrSelector);
+
+  let node = getNode(nodeOrSelector);
+  let updated = inspector.once("inspector-updated");
+  inspector.selection.setNode(node, reason);
+  return updated;
+}
+
+/**
+ * Open the toolbox, with the inspector tool visible.
+ * @return a promise that resolves when the inspector is ready
+ */
+var openInspector = Task.async(function*() {
+  info("Opening the inspector");
+  let target = TargetFactory.forTab(gBrowser.selectedTab);
+
+  let inspector, toolbox;
+
+  // The actual highligher show/hide methods are mocked in layoutview tests.
+  // The highlighter is tested in devtools/inspector/test.
+  function mockHighlighter({highlighter}) {
+    highlighter.showBoxModel = function(nodeFront, options) {
+      return promise.resolve();
+    };
+    highlighter.hideBoxModel = function() {
+      return promise.resolve();
+    };
+  }
+
+  // Checking if the toolbox and the inspector are already loaded
+  // The inspector-updated event should only be waited for if the inspector
+  // isn't loaded yet
+  toolbox = gDevTools.getToolbox(target);
+  if (toolbox) {
+    inspector = toolbox.getPanel("inspector");
+    if (inspector) {
+      info("Toolbox and inspector already open");
+      mockHighlighter(toolbox);
+      return {
+        toolbox: toolbox,
+        inspector: inspector
+      };
+    }
+  }
+
+  info("Opening the toolbox");
+  toolbox = yield gDevTools.showToolbox(target, "inspector");
+  yield waitForToolboxFrameFocus(toolbox);
+  inspector = toolbox.getPanel("inspector");
+
+  info("Waiting for the inspector to update");
+  yield inspector.once("inspector-updated");
+
+  mockHighlighter(toolbox);
+  return {
+    toolbox: toolbox,
+    inspector: inspector
+  };
+});
+
+/**
+ * Wait for the toolbox frame to receive focus after it loads
+ * @param {Toolbox} toolbox
+ * @return a promise that resolves when focus has been received
+ */
+function waitForToolboxFrameFocus(toolbox) {
+  info("Making sure that the toolbox's frame is focused");
+  let def = promise.defer();
+  let win = toolbox.frame.contentWindow;
+  waitForFocus(def.resolve, win);
+  return def.promise;
+}
+
 /**
  * Checks whether the inspector's sidebar corresponding to the given id already
  * exists
@@ -65,18 +209,6 @@ function hasSideBarTab(inspector, id) {
 var openLayoutView = Task.async(function*() {
   let {toolbox, inspector} = yield openInspector();
 
-  // The actual highligher show/hide methods are mocked in layoutview tests.
-  // The highlighter is tested in devtools/inspector/test.
-  function mockHighlighter({highlighter}) {
-    highlighter.showBoxModel = function(nodeFront, options) {
-      return promise.resolve();
-    };
-    highlighter.hideBoxModel = function() {
-      return promise.resolve();
-    };
-  }
-  mockHighlighter(toolbox);
-
   if (!hasSideBarTab(inspector, "layoutview")) {
     info("Waiting for the layoutview sidebar to be ready");
     yield inspector.sidebar.once("layoutview-ready");

devtools/client/inspector/test/head.js

@@ -6,8 +6,7 @@
 
 // Load the shared-head file first.
 Services.scriptloader.loadSubScript(
-  "chrome://mochitests/content/browser/devtools/client/framework/test/shared-head.js",
+  "chrome://mochitests/content/browser/devtools/client/framework/test/shared-head.js", this);
-  this);
 
 // Services.prefs.setBoolPref("devtools.debugger.log", true);
 // SimpleTest.registerCleanupFunction(() => {
@@ -20,14 +19,13 @@ Services.scriptloader.loadSubScript(
 var ROOT_TEST_DIR = getRootDirectory(gTestPath);
 
 // Import the GCLI test helper
+var testDir = gTestPath.substr(0, gTestPath.lastIndexOf("/"));
 Services.scriptloader.loadSubScript(
-  "chrome://mochitests/content/browser/devtools/client/commandline/test/helpers.js",
+  testDir + "../../../commandline/test/helpers.js", this);
-  this);
 
 // Import helpers registering the test-actor in remote targets
 Services.scriptloader.loadSubScript(
-  "chrome://mochitests/content/browser/devtools/client/shared/test/test-actor-registry.js",
+  testDir + "../../../shared/test/test-actor-registry.js", this);
-  this);
 
 DevToolsUtils.testing = true;
 registerCleanupFunction(() => {