diff options
Diffstat (limited to 'layout/xul/test/test_popupReflowPos.xul')
-rw-r--r-- | layout/xul/test/test_popupReflowPos.xul | 76 |
1 files changed, 76 insertions, 0 deletions
diff --git a/layout/xul/test/test_popupReflowPos.xul b/layout/xul/test/test_popupReflowPos.xul new file mode 100644 index 000000000..deeeff62e --- /dev/null +++ b/layout/xul/test/test_popupReflowPos.xul @@ -0,0 +1,76 @@ +<?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="XUL Panel reflow placement test" + xmlns:html="http://www.w3.org/1999/xhtml" + xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> + <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"/> + <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"/> + + <!-- test results are displayed in the html:body --> + <body xmlns="http://www.w3.org/1999/xhtml"> + </body> + + <!-- test code goes here --> + <script type="application/javascript"><![CDATA[ + SimpleTest.waitForExplicitFinish(); + + function openPopup() + { + synthesizeMouseAtCenter(document.getElementById("thebutton"), {}, window); + } + + function popupShown(event) + { + document.getElementById("parent").className = ""; + + var buttonbcr = document.getElementById("thebutton").getBoundingClientRect(); + var popupbcr = document.getElementById("thepopup").getOuterScreenRect(); + + ok(Math.abs(popupbcr.x - window.mozInnerScreenX - buttonbcr.x) < 3, "x pos is correct"); + ok(Math.abs(popupbcr.y - window.mozInnerScreenY - buttonbcr.bottom) < 3, "y pos is correct"); + + event.target.hidePopup(); + } + + SimpleTest.waitForFocus(openPopup); + ]]></script> + + <html:style> + .mbox { + display: inline-block; + width: 33%; + height: 50px; + background: green; + vertical-align: middle; + } + .orange { + background: orange; + } + .change > .mbox { + width: 60px; + } + </html:style> + + <html:div style="width: 300px; height: 200px;"> + <html:div id="parent" class="change" style="background: red; border: 1px solid black; width: 300px; height: 200px;"> + <html:div class="mbox"></html:div> + <html:div class="mbox"></html:div> + <html:div class="mbox"></html:div> + <html:div class="mbox orange"> + + <button label="Show" type="menu" id="thebutton"> + <menupopup id="thepopup" onpopupshown="popupShown(event)" onpopuphidden="SimpleTest.finish()"> + <menuitem label="New"/> + <menuitem label="Open"/> + <menuitem label="Save"/> + <menuseparator/> + <menuitem label="Exit"/> + </menupopup> + </button> + + </html:div> + </html:div> + </html:div> + +</window> |