<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
<?xml-stylesheet href="/tests/SimpleTest/test.css" type="text/css"?>
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=510426
-->
<window title="Mozilla Bug 510426"
  xmlns:html="http://www.w3.org/1999/xhtml"
  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
  align="start">
  <script type="application/javascript" src="/MochiKit/packed.js"></script>
  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>      

<body  xmlns="http://www.w3.org/1999/xhtml">
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=510426">Mozilla Bug 510426</a>
</body>

<notificationbox id="nb" width="300" height="100">
  <box width="100" height="100" id="overflowGenerator"/>
</notificationbox>

<script class="testbody" type="application/javascript">
<![CDATA[

/** Test for Bug 510426 **/
SimpleTest.waitForExplicitFinish();

function openNotification() {
  var nb = document.getElementById("nb");
  var n = nb.appendNotification("Notification", "", null,
                                nb.PRIORITY_WARNING_LOW, [{
                                  label: "Button",
                                  accesskey: "u",
                                  callback: null,
                                  popup: null
                                }]);
  n.addEventListener("transitionend", function (event) {
    if (event.propertyName == "margin-top") {
      setTimeout(function () {
        is(n.getBoundingClientRect().height, 27, "notification bar has wrong height");
        SimpleTest.finish();
      }, 0);
    }
  }, false);
}

window.onload = openNotification;

]]>
</script>
</window>
