summaryrefslogtreecommitdiffstats
path: root/toolkit/content/tests/chrome/test_menulist_position.xul
blob: a146cb85ef35fcb87e719ab0575f7e98f6c43bf5 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
<?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css" type="text/css"?>

<window title="Menulist position Test"
        onload="setTimeout(init, 0)"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

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

<!--
  This test checks the position of a menulist's popup.
  -->

<script>
<![CDATA[
SimpleTest.waitForExplicitFinish();

var menulist;

function init()
{
  menulist = document.getElementById("menulist");
  menulist.open = true;
}

function isWithinHalfPixel(a, b)
{
  return Math.abs(a - b) <= 0.5;
}

function popupShown()
{
  var menurect = menulist.getBoundingClientRect();
  var popuprect = menulist.menupopup.getBoundingClientRect();

  let marginLeft = parseFloat(getComputedStyle(menulist.menupopup).marginLeft);
  ok(isWithinHalfPixel(menurect.left + marginLeft, popuprect.left), "left position");
  ok(isWithinHalfPixel(menurect.right + marginLeft, popuprect.right), "right position");

  let index = menulist.selectedIndex;
  if (menulist.selectedItem && navigator.platform.indexOf("Mac") >= 0) {
    let menulistlabel = document.getAnonymousElementByAttribute(menulist, "class", "menulist-label");
    let mitemlabel = document.getAnonymousElementByAttribute(menulist.selectedItem, "class", "menu-iconic-text");

    ok(isWithinHalfPixel(menulistlabel.getBoundingClientRect().left,
                         mitemlabel.getBoundingClientRect().left),
       "Labels horizontally aligned for index " + index);
    ok(isWithinHalfPixel(menulistlabel.getBoundingClientRect().top,
                         mitemlabel.getBoundingClientRect().top),
       "Labels vertically aligned for index " + index);
  }
  else {
    let marginTop = parseFloat(getComputedStyle(menulist.menupopup).marginTop);
    ok(isWithinHalfPixel(menurect.bottom + marginTop, popuprect.top),
       "Vertical alignment with no selection for index " + index);
  }

  menulist.open = false;
}

function popupHidden()
{
  if (!menulist.selectedItem) {
    SimpleTest.finish();
  }
  else {
    menulist.selectedItem = menulist.selectedItem.nextSibling;
    menulist.open = true;
  }
}
]]>
</script>

<hbox align="center" pack="center" style="margin-top: 100px;">
  <menulist id="menulist" onpopupshown="popupShown();" onpopuphidden="popupHidden();">
    <menupopup>
      <menuitem label="One"/>
      <menuitem label="Two"/>
      <menuitem label="Three"/>
      <menuitem label="Four"/>
      <menuitem label="Five"/>
    </menupopup>
  </menulist>
</hbox>

<body xmlns="http://www.w3.org/1999/xhtml">
<p id="display">
</p>
<div id="content" style="display: none">
</div>
<pre id="test">
</pre>
</body>

</window>