Bug 1396966 - fix dnd in a test to work in small screens, r?mystor draft
authorGijs Kruitbosch <gijskruitbosch@gmail.com>
Wed, 06 Sep 2017 19:39:53 +0100
changeset 660326 dcc5f1a14ac6f8276c91b3f5b7e3299903ac624d
parent 660208 93dd2e456c0ecca00fb4d28744e88078a77deaf7
child 730217 a2256e81ed555864f30d22cd247ebc11fda39891
push id78381
push userbmo:gijskruitbosch+bugs@gmail.com
push dateWed, 06 Sep 2017 21:59:35 +0000
reviewersmystor
bugs1396966
milestone57.0a1
Bug 1396966 - fix dnd in a test to work in small screens, r?mystor MozReview-Commit-ID: 7xqfLc1M0PA
browser/components/customizableui/test/browser_876926_customize_mode_wrapping.js
--- a/browser/components/customizableui/test/browser_876926_customize_mode_wrapping.js
+++ b/browser/components/customizableui/test/browser_876926_customize_mode_wrapping.js
@@ -10,36 +10,53 @@ const kPanel = CustomizableUI.AREA_FIXED
 const kToolbar = CustomizableUI.AREA_NAVBAR;
 const kVisiblePalette = "customization-palette";
 const kPlaceholderClass = "panel-customization-placeholder";
 
 function checkWrapper(id) {
   is(document.querySelectorAll("#wrapper-" + id).length, 1, "There should be exactly 1 wrapper for " + id + " in the customizing window.");
 }
 
+async function ensureVisibleIfInPalette(node) {
+    if (node.parentNode.parentNode == gNavToolbox.palette) {
+      node.scrollIntoView();
+      window.QueryInterface(Ci.nsIInterfaceRequestor);
+      let dwu = window.getInterface(Ci.nsIDOMWindowUtils);
+      await BrowserTestUtils.waitForCondition(() => {
+        let nodeBounds = dwu.getBoundsWithoutFlushing(node);
+        let paletteBounds = dwu.getBoundsWithoutFlushing(gNavToolbox.palette);
+        return nodeBounds.top >= paletteBounds.top && nodeBounds.bottom <= paletteBounds.bottom;
+      });
+    }
+}
+
 var move = {
-  "drag": function(id, target) {
+  "drag": async function(id, target) {
     let targetNode = document.getElementById(target);
     if (targetNode.customizationTarget) {
       targetNode = targetNode.customizationTarget;
     }
-    simulateItemDrag(document.getElementById(id), targetNode);
+    let nodeToMove = document.getElementById(id);
+    await ensureVisibleIfInPalette(nodeToMove);
+    simulateItemDrag(nodeToMove, targetNode);
   },
-  "dragToItem": function(id, target) {
+  "dragToItem": async function(id, target) {
     let targetNode = document.getElementById(target);
     if (targetNode.customizationTarget) {
       targetNode = targetNode.customizationTarget;
     }
     let items = targetNode.querySelectorAll("toolbarpaletteitem:not(." + kPlaceholderClass + ")");
     if (target == kPanel) {
       targetNode = items[items.length - 1];
     } else {
       targetNode = items[0];
     }
-    simulateItemDrag(document.getElementById(id), targetNode);
+    let nodeToMove = document.getElementById(id);
+    await ensureVisibleIfInPalette(nodeToMove);
+    simulateItemDrag(nodeToMove, targetNode);
   },
   "API": function(id, target) {
     if (target == kVisiblePalette) {
       return CustomizableUI.removeWidgetFromArea(id);
     }
     return CustomizableUI.addWidgetToArea(id, target, null);
   }
 };
@@ -85,33 +102,33 @@ function isLastVisibleInToolbar(containe
 function isFirst(containerId, defaultPlacements, id) {
   assertAreaPlacements(containerId, [id].concat(defaultPlacements));
   is(document.getElementById(containerId).customizationTarget.firstChild.firstChild.id, id,
      "Widget " + id + " should be in " + containerId + " in customizing window.");
   is(otherWin.document.getElementById(containerId).customizationTarget.firstChild.id, id,
      "Widget " + id + " should be in " + containerId + " in other window.");
 }
 
-function checkToolbar(id, method) {
+async function checkToolbar(id, method) {
   // Place at start of the toolbar:
   let toolbarPlacements = getAreaWidgetIds(kToolbar);
-  move[method](id, kToolbar);
+  await move[method](id, kToolbar);
   if (method == "dragToItem") {
     isFirst(kToolbar, toolbarPlacements, id);
   } else if (method == "drag") {
     isLastVisibleInToolbar(kToolbar, toolbarPlacements, id);
   } else {
     isLast(kToolbar, toolbarPlacements, id);
   }
   checkWrapper(id);
 }
 
-function checkPanel(id, method) {
+async function checkPanel(id, method) {
   let panelPlacements = getAreaWidgetIds(kPanel);
-  move[method](id, kPanel);
+  await move[method](id, kPanel);
   let children = document.getElementById(kPanel).querySelectorAll("toolbarpaletteitem:not(." + kPlaceholderClass + ")");
   let otherChildren = otherWin.document.getElementById(kPanel).children;
   let newPlacements = panelPlacements.concat([id]);
   // Relative position of the new item from the end:
   let position = -1;
   // For the drag to item case, we drag to the last item, making the dragged item the
   // penultimate item. We can't well use the first item because the panel has complicated
   // rules about rearranging wide items (which, by default, the first two items are).
@@ -123,19 +140,19 @@ function checkPanel(id, method) {
   assertAreaPlacements(kPanel, newPlacements);
   is(children[children.length + position].firstChild.id, id,
      "Widget " + id + " should be in " + kPanel + " in customizing window.");
   is(otherChildren[otherChildren.length + position].id, id,
      "Widget " + id + " should be in " + kPanel + " in other window.");
   checkWrapper(id);
 }
 
-function checkPalette(id, method) {
+async function checkPalette(id, method) {
   // Move back to palette:
-  move[method](id, kVisiblePalette);
+  await move[method](id, kVisiblePalette);
   ok(CustomizableUI.inDefaultState, "Should end in default state");
   let visibleChildren = gCustomizeMode.visiblePalette.children;
   let expectedChild = method == "dragToItem" ? visibleChildren[0] : visibleChildren[visibleChildren.length - 1];
   is(expectedChild.firstChild.id, id, "Widget " + id + " was moved using " + method + " and should now be wrapped in palette in customizing window.");
   if (id == kXULWidgetId) {
     ok(otherWin.gNavToolbox.palette.querySelector("#" + id), "Widget " + id + " should be in invisible palette in other window.");
   }
   checkWrapper(id);
@@ -165,29 +182,29 @@ add_task(async function MoveWidgetsInTwo
   // Create the XUL button to use in the test in both windows.
   createXULButtonForWindow(window);
   createXULButtonForWindow(otherWin);
   ok(CustomizableUI.inDefaultState, "Should start in default state");
 
   for (let widgetId of [kXULWidgetId, kAPIWidgetId]) {
     for (let method of ["API", "drag", "dragToItem"]) {
       info("Moving widget " + widgetId + " using " + method);
-      checkToolbar(widgetId, method);
+      await checkToolbar(widgetId, method);
       // We add an item to the panel because otherwise we can't test dragging
       // to items that are already there. We remove it because
       // 'checkPalette' checks that we leave the browser in the default state.
       CustomizableUI.addWidgetToArea("cui-mode-wrapping-some-panel-item", CustomizableUI.AREA_FIXED_OVERFLOW_PANEL);
-      checkPanel(widgetId, method);
+      await checkPanel(widgetId, method);
       CustomizableUI.removeWidgetFromArea("cui-mode-wrapping-some-panel-item");
-      checkPalette(widgetId, method);
+      await checkPalette(widgetId, method);
       CustomizableUI.addWidgetToArea("cui-mode-wrapping-some-panel-item", CustomizableUI.AREA_FIXED_OVERFLOW_PANEL);
-      checkPanel(widgetId, method);
-      checkToolbar(widgetId, method);
+      await checkPanel(widgetId, method);
+      await checkToolbar(widgetId, method);
       CustomizableUI.removeWidgetFromArea("cui-mode-wrapping-some-panel-item");
-      checkPalette(widgetId, method);
+      await checkPalette(widgetId, method);
     }
   }
   await promiseWindowClosed(otherWin);
   otherWin = null;
   await endCustomizing();
   removeXULButtonForWindow(window);
 });