The Tor Browser / file revision

 <?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="Popup in Content Positioning Tests"

         onload="setTimeout(nextTest, 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 that popups in content areas don't extend past the content area.

   -->

 <hbox>

   <spacer width="100"/>

   <menu id="menu" label="Menu">

     <menupopup style="margin:10px;" id="popup" onpopupshown="popupShown()" onpopuphidden="nextTest()">

       <menuitem label="One"/>

       <menuitem label="Two"/>

       <menuitem label="Three"/>

       <menuitem label="A final longer label that is actually quite long. Very long indeed."/>

     </menupopup>

   </menu>

 </hbox>

 <script class="testbody" type="application/javascript">

 <![CDATA[

 SimpleTest.waitForExplicitFinish();

 var step = "";

 var originalHeight = -1;

 function nextTest()

 {

   // there are five tests here:

   //   openPopupAtScreen - checks that opening a popup using openPopupAtScreen

   //                       constrains the popup to the content area

   //   left and top - check with the left and top attributes set

   //   open near bottom - open the menu near the bottom of the window

   //   large menu - try with a menu that is very large and should be scaled

   //   shorter menu again - try with a menu that is shorter again. It should have

   //                        the same height as the 'left and top' test

   var popup = $("popup");

   var menu = $("menu");

   switch (step) {

     case "":

       step = "openPopupAtScreen";

       popup.openPopupAtScreen(1000, 1200);

       break;

     case "openPopupAtScreen":

       step = "left and top";

       popup.setAttribute("left", "800");

       popup.setAttribute("top", "2900");

       synthesizeMouse(menu, 2, 2, { });

       break;

     case "left and top":

       step = "open near bottom";

       // request that the menu be opened with a target point near the bottom of the window,

       // so that the menu's top margin will push it completely outside the window.

       var bo = document.documentElement.boxObject;

       popup.setAttribute("top", bo.screenY + window.innerHeight - 5);

       synthesizeMouse(menu, 2, 2, { });

       break;

     case "open near bottom":

       step = "large menu";

       popup.removeAttribute("left");

       popup.removeAttribute("top");

       for (var i = 0; i < 80; i++)

         menu.appendItem("Test", "");

       synthesizeMouse(menu, 2, 2, { });

       break;

     case "large menu":

       step = "shorter menu again";

       for (var i = 0; i < 80; i++)

         menu.removeItemAt(menu.itemCount - 1);

       synthesizeMouse(menu, 2, 2, { });

       break;

     case "shorter menu again":

       SimpleTest.finish();

       break;

   }

 }

 function popupShown()

 {

   var windowrect = document.documentElement.getBoundingClientRect();

   var popuprect = $("popup").getBoundingClientRect();

   // subtract one off the edge due to a rounding issue

   ok(popuprect.left >= windowrect.left, step + " left");

   ok(popuprect.right - 1 <= windowrect.right, step + " right");

   if (step == "left and top") {

     originalHeight = popuprect.bottom - popuprect.top;

   }

   else if (step == "open near bottom") {

     // check that the menu flipped up so it's above our requested point

     ok(popuprect.bottom - 1 <= windowrect.bottom - 5, step + " bottom");

   }

   else if (step == "large menu") {

     // add 10 to account for the margin

     is(popuprect.top, $("menu").getBoundingClientRect().bottom + 10, step + " top");

     ok(popuprect.bottom == windowrect.bottom ||

        popuprect.bottom - 1 == windowrect.bottom, step + " bottom");

   }

   else {

     ok(popuprect.top >= windowrect.top, step + " top");

     ok(popuprect.bottom - 1 <= windowrect.bottom, step + " bottom");

     if (step == "shorter menu again")

       is(popuprect.bottom - popuprect.top, originalHeight, step + " height shortened");

   }

   $("menu").open = false;

 }

 ]]>

 </script>

 <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>