gecko-dev/toolkit/content/tests/chrome/window_titlebar.xul

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
<!--
  XUL Widget Test for the titlebar element and window dragging
  -->
<window title="Titlebar" width="200" height="200"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

  <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"/>

  <titlebar id="titlebar">
    <label id="label" value="Titlebar"/>
  </titlebar>

  <!-- a non-noautohide panel is treated as anchored -->
  <panel id="panel" onpopupshown="popupshown(this, false)" onpopuphidden="popuphidden('panelnoautohide')">
    <titlebar>
      <label id="panellabel" value="Titlebar"/>
    </titlebar>
  </panel>

  <panel id="panelnoautohide" noautohide="true"
         onpopupshown="popupshown(this, false)" onpopuphidden="popuphidden('panelanchored')">
    <titlebar>
      <label id="panellabelnoautohide" value="Titlebar"/>
    </titlebar>
  </panel>

  <panel id="panelanchored" noautohide="true"
          onpopupshown="popupshown(this, true)" onpopuphidden="popuphidden('paneltop')">
    <titlebar>
      <label id="panellabelanchored" value="Titlebar"/>
    </titlebar>
  </panel>

  <panel id="paneltop" noautohide="true" level="top"
         onpopupshown="popupshown(this, false)" onpopuphidden="popuphidden('panelfloating')">
    <titlebar>
      <label id="panellabeltop" value="Titlebar"/>
    </titlebar>
  </panel>

  <panel id="panelfloating" noautohide="true" level="floating"
         onpopupshown="popupshown(this, false)" onpopuphidden="popuphidden('')">
    <titlebar>
      <label id="panellabelfloating" value="Titlebar"/>
    </titlebar>
  </panel>

  <button id="button" label="OK"/>

<script>
<![CDATA[

var SimpleTest = window.opener.wrappedJSObject.SimpleTest;

SimpleTest.waitForFocus(test_titlebar, window);

var mouseDownTarget;
var origoldx, origoldy, oldx, oldy, waitSteps = 0;
function waitForWindowMove(element, x, y, callback, arg, panel, anchored)
{
  var isPanelMove = (element.id != "label");

  if (!waitSteps) {
    oldx = isPanelMove ? panel.getBoundingClientRect().left : window.screenX;
    oldy = isPanelMove ? panel.getBoundingClientRect().top : window.screenY;
    synthesizeMouse(element, x, y, { type: "mousemove" });
  }

  var newx = isPanelMove ? panel.getBoundingClientRect().left : window.screenX; 
  var newy = isPanelMove ? panel.getBoundingClientRect().top : window.screenY; 
  if (newx == oldx && newy == oldy) {
    if (waitSteps++ > 10) {
      SimpleTest.is(window.screenX + "," + window.screenY, oldx + "," + oldy + " ",
                    "Window never moved properly to " + x + "," + y + (panel ? " " + panel.id : ""));
      window.opener.wrappedJSObject.SimpleTest.finish();
      window.close();
      return;
    }

    setTimeout(waitForWindowMove, 100, element, x, y, callback, arg, panel, anchored);
  }
  else {
    waitSteps = 0;

    // on Linux, we need to wait a bit for the popup to be moved as well
    if (navigator.platform.includes("Linux")) {
      setTimeout(callback, 0, arg, panel, anchored);
    }
    else {
      callback(arg, panel, anchored);
    }
  }
}

function test_titlebar()
{
  var titlebar = document.getElementById("titlebar");
  var label = document.getElementById("label");

  origoldx = window.screenX;
  origoldy = window.screenY;

  var mousedownListener = event => mouseDownTarget = event.originalTarget;
  window.addEventListener("mousedown", mousedownListener, false);
  synthesizeMouse(label, 2, 2, { type: "mousedown" });
  SimpleTest.is(mouseDownTarget, titlebar, "movedown on titlebar");
  waitForWindowMove(label, 22, 22, test_titlebar_step2, mousedownListener);
}

function test_titlebar_step2(mousedownListener)
{
  var titlebar = document.getElementById("titlebar");
  var label = document.getElementById("label");

  SimpleTest.is(window.screenX, origoldx + 20, "move window horizontal");
  SimpleTest.is(window.screenY, origoldy + 20, "move window vertical");
  synthesizeMouse(label, 22, 22, { type: "mouseup" });

  // with allowEvents set to true, the mouse should target the label instead
  // and not move the window
  titlebar.allowEvents = true;

  synthesizeMouse(label, 2, 2, { type: "mousedown" });
  SimpleTest.is(mouseDownTarget, label, "movedown on titlebar with allowevents");
  synthesizeMouse(label, 22, 22, { type: "mousemove" });
  SimpleTest.is(window.screenX, origoldx + 20, "mouse on label move window horizontal");
  SimpleTest.is(window.screenY, origoldy + 20, "mouse on label move window vertical");
  synthesizeMouse(label, 22, 22, { type: "mouseup" });

  window.removeEventListener("mousedown", mousedownListener, false);

  document.getElementById("panel").openPopupAtScreen(window.screenX + 50, window.screenY + 60, false);
}

function popupshown(panel, anchored)
{
  var rect = panel.getBoundingClientRect();

  // skip this check for non-noautohide panels
  if (panel.id == "panel") {
    var panellabel = panel.firstChild.firstChild;
    synthesizeMouse(panellabel, 2, 2, { type: "mousedown" });
    waitForWindowMove(panellabel, 22, 22, popupshown_step3, rect, panel, anchored);
    return;
  }

  // now, try moving the window. If anchored, the popup should move with the
  // window. If not anchored, the popup should remain at its current screen location.
  window.moveBy(10, 10);
  waitSteps = 1;
  waitForWindowMove(document.getElementById("label"), 1, 1, popupshown_step2, rect, panel, anchored);
}

function popupshown_step2(oldrect, panel, anchored)
{
  var newrect = panel.getBoundingClientRect();

  // The window movement that occured long ago at the beginning of the test
  // on Linux is delayed and there isn't any way to tell when the move
  // actually happened. This causes the checks here to fail. Instead, just
  // wait a bit for the test to be ready.
  if (navigator.platform.includes("Linux") &&
      newrect.left != oldrect.left - (anchored ? 0 : 10)) {
    setTimeout(popupshown_step2, 10, oldrect, panel, anchored);
    return;
  }

  // anchored popups should still be at the same offset. Non-anchored popups will
  // now be offset by 10 pixels less.
  SimpleTest.is(newrect.left, oldrect.left - (anchored ? 0 : 10),
                panel.id + " horizontal after window move");
  SimpleTest.is(newrect.top, oldrect.top - (anchored ? 0 : 10),
                panel.id + " vertical after window move");

  var panellabel = panel.firstChild.firstChild;
  synthesizeMouse(panellabel, 2, 2, { type: "mousedown" });
  waitForWindowMove(panellabel, 22, 22, popupshown_step3, newrect, panel, anchored);
}

function popupshown_step3(oldrect, panel, anchored)
{
  // skip this check on Linux for the same window positioning reasons as above
  if (!navigator.platform.includes("Linux") || (panel.id != "panelanchored" && panel.id != "paneltop")) {
    // next, drag the titlebar in the panel
    var newrect = panel.getBoundingClientRect();
    SimpleTest.is(newrect.left, oldrect.left + 20, panel.id + " move popup horizontal");
    SimpleTest.is(newrect.top, oldrect.top + 20, panel.id + " move popup vertical");
    synthesizeMouse(document.getElementById("panellabel"), 22, 22, { type: "mouseup" });

    synthesizeMouse(document.getElementById("button"), 5, 5, { type: "mousemove" });
    newrect = panel.getBoundingClientRect();
    SimpleTest.is(newrect.left, oldrect.left + 20, panel.id + " horizontal after mouse on button");
    SimpleTest.is(newrect.top, oldrect.top + 20, panel.id + " vertical after mouse on button");
  }
  else {
    synthesizeMouse(document.getElementById("panellabel"), 22, 22, { type: "mouseup" });
  }

  panel.hidePopup();
}

function popuphidden(nextPopup)
{
  if (nextPopup) {
    var panel = document.getElementById(nextPopup);
    if (panel.id == "panelnoautohide") {
      panel.openPopupAtScreen(window.screenX + 50, window.screenY + 60, false);
    }
    else {
      panel.openPopup(document.getElementById("button"), "after_start");
    }
  }
  else
    window.opener.wrappedJSObject.done(window);
}

]]>
</script>

</window>