Source code
Revision control
Copy as Markdown
Other Tools
<?xml version="1.0"?>
<!--
XUL Widget Test for panels
-->
<window title="Titlebar" width="200" height="200"
<html:style>
<![CDATA[
panel, panel::part(content) {
border: 0;
margin: 0;
padding: 0;
}
]]>
</html:style>
<tree id="tree" seltype="single" width="100" height="100">
<treecols>
<treecol flex="1"/>
<treecol flex="1"/>
</treecols>
<treechildren id="treechildren">
<treeitem><treerow><treecell label="One"/><treecell label="Two"/></treerow></treeitem>
<treeitem><treerow><treecell label="One"/><treecell label="Two"/></treerow></treeitem>
<treeitem><treerow><treecell label="One"/><treecell label="Two"/></treerow></treeitem>
<treeitem><treerow><treecell label="One"/><treecell label="Two"/></treerow></treeitem>
<treeitem><treerow><treecell label="One"/><treecell label="Two"/></treerow></treeitem>
<treeitem><treerow><treecell label="One"/><treecell label="Two"/></treerow></treeitem>
</treechildren>
</tree>
<!-- test results are displayed in the html:body -->
<!-- test code goes here -->
<script type="application/javascript"><![CDATA[
SimpleTest.waitForExplicitFinish();
var currentTest = null;
function ok(condition, message) {
window.arguments[0].SimpleTest.ok(condition, message);
}
function is(left, right, message) {
window.arguments[0].SimpleTest.is(left, right, message);
}
function test_panels()
{
checkTreeCoords();
addEventListener("popupshowing", popupShowing, false);
addEventListener("popupshown", popupShown, false);
addEventListener("popuphidden", nextTest, false);
nextTest();
}
function nextTest()
{
if (!tests.length) {
window.close();
window.arguments[0].SimpleTest.finish();
return;
}
currentTest = tests.shift();
var panel = createPanel(currentTest.attrs);
currentTest.test(panel);
}
function popupShowing(event)
{
var rect = event.target.getOuterScreenRect();
ok(!rect.left && !rect.top && !rect.width && !rect.height,
currentTest.testname + " empty rectangle during popupshowing");
}
var waitSteps = 0;
function popupShown(event)
{
var panel = event.target;
if (waitSteps > 0 && navigator.platform.includes("Linux") &&
panel.screenY == 210) {
waitSteps--;
setTimeout(popupShown, 10, event);
return;
}
currentTest.result(currentTest.testname + " ", panel);
panel.hidePopup();
}
function createPanel(attrs)
{
var panel = document.createXULElement("panel");
for (var a in attrs) {
panel.setAttribute(a, attrs[a]);
}
var button = document.createXULElement("button");
panel.appendChild(button);
button.label = "OK";
button.setAttribute("style", "appearance: none; border: 0; margin: 0; width: 120px; height: 40px;");
panel.setAttribute("style", "appearance: none; border: 0; margin: 0;");
return document.documentElement.appendChild(panel);
}
function checkTreeCoords()
{
var tree = $("tree");
var treechildren = $("treechildren");
tree.currentIndex = 0;
tree.scrollToRow(0);
synthesizeMouse(treechildren, 10, tree.rowHeight + 2, { });
is(tree.currentIndex, 1, "tree selection");
tree.scrollToRow(2);
synthesizeMouse(treechildren, 10, tree.rowHeight + 2, { });
is(tree.currentIndex, 3, "tree selection after scroll");
}
var tests = [
{
testname: "normal panel",
attrs: { },
test(panel) {
var screenRect = panel.getOuterScreenRect();
is(screenRect.left, 0, this.testname + " screen left before open");
is(screenRect.top, 0, this.testname + " screen top before open");
is(screenRect.width, 0, this.testname + " screen width before open");
is(screenRect.height, 0, this.testname + " screen height before open");
panel.openPopupAtScreen(200, 210);
},
result(testname, panel) {
var panelrect = panel.getBoundingClientRect();
is(panelrect.left, 200 - window.mozInnerScreenX, testname + "left");
is(panelrect.top, 210 - window.mozInnerScreenY, testname + "top");
is(panelrect.width, 120, testname + "width");
is(panelrect.height, 40, testname + "height");
var screenRect = panel.getOuterScreenRect();
is(screenRect.left, 200, testname + " screen left");
is(screenRect.top, 210, testname + " screen top");
is(screenRect.width, 120, testname + " screen width");
is(screenRect.height, 40, testname + " screen height");
}
},
{
// only noautohide panels support titlebars, so one shouldn't be shown here
testname: "autohide panel with titlebar",
attrs: { titlebar: "normal" },
test(panel) {
var screenRect = panel.getOuterScreenRect();
is(screenRect.left, 0, this.testname + " screen left before open");
is(screenRect.top, 0, this.testname + " screen top before open");
is(screenRect.width, 0, this.testname + " screen width before open");
is(screenRect.height, 0, this.testname + " screen height before open");
panel.openPopupAtScreen(200, 210);
},
result(testname, panel) {
var panelrect = panel.getBoundingClientRect();
is(panelrect.left, 200 - window.mozInnerScreenX, testname + "left");
is(panelrect.top, 210 - window.mozInnerScreenY, testname + "top");
is(panelrect.width, 120, testname + "width");
is(panelrect.height, 40, testname + "height");
var screenRect = panel.getOuterScreenRect();
is(screenRect.left, 200, testname + " screen left");
is(screenRect.top, 210, testname + " screen top");
is(screenRect.width, 120, testname + " screen width");
is(screenRect.height, 40, testname + " screen height");
}
},
{
testname: "noautohide panel with titlebar",
attrs: { noautohide: true, titlebar: "normal" },
test(panel) {
waitSteps = 25;
var screenRect = panel.getOuterScreenRect();
is(screenRect.left, 0, this.testname + " screen left before open");
is(screenRect.top, 0, this.testname + " screen top before open");
is(screenRect.width, 0, this.testname + " screen width before open");
is(screenRect.height, 0, this.testname + " screen height before open");
panel.openPopupAtScreen(200, 210);
},
result(testname, panel) {
var panelrect = panel.getBoundingClientRect();
ok(panelrect.left >= 200 - window.mozInnerScreenX, testname + "left");
if (!navigator.platform.includes("Linux")) {
ok(panelrect.top >= 210 - window.mozInnerScreenY, testname + "top greater " + panelrect.top + " " + window.mozInnerScreenY);
}
ok(panelrect.top <= 210 - window.mozInnerScreenY + 36, testname + "top less");
is(panelrect.width, 120, testname + "width");
is(panelrect.height, 40, testname + "height");
var screenRect = panel.getOuterScreenRect();
if (!navigator.platform.includes("Linux")) {
is(screenRect.left, 200, testname + " screen left");
is(screenRect.top, 210, testname + " screen top");
}
ok(screenRect.width >= 120 && screenRect.width <= 140, testname + " screen width");
ok(screenRect.height >= 40 && screenRect.height <= 118, testname + " screen height");
var gotMouseEvent = false;
function mouseMoved(event)
{
is(event.clientY, panelrect.top + 10,
"popup clientY");
is(event.screenY, panel.screenY + 10,
"popup screenY");
is(event.originalTarget, panel.firstChild, "popup target");
gotMouseEvent = true;
}
panel.addEventListener("mousemove", mouseMoved, true);
synthesizeMouse(panel, 10, 10, { type: "mousemove" });
ok(gotMouseEvent, "mouse event on panel");
panel.removeEventListener("mousemove", mouseMoved, true);
var tree = $("tree");
tree.currentIndex = 0;
panel.appendChild(tree);
checkTreeCoords();
}
},
{
// The panel should be allowed to appear and remain offscreen
testname: "normal panel with flip='none' off-screen",
attrs: { "flip": "none" },
test(panel) {
panel.openPopup(document.documentElement, "", -100 - window.mozInnerScreenX, -100 - window.mozInnerScreenY, false, false, null);
},
result(testname, panel) {
var panelrect = panel.getBoundingClientRect();
is(panelrect.left, -100 - window.mozInnerScreenX, testname + "left");
is(panelrect.top, -100 - window.mozInnerScreenY, testname + "top");
is(panelrect.width, 120, testname + "width");
is(panelrect.height, 40, testname + "height");
var screenRect = panel.getOuterScreenRect();
is(screenRect.left, -100, testname + " screen left");
is(screenRect.top, -100, testname + " screen top");
is(screenRect.width, 120, testname + " screen width");
is(screenRect.height, 40, testname + " screen height");
}
},
{
// The panel should be allowed to remain offscreen after moving and it should follow the anchor
testname: "normal panel with flip='none' moved off-screen",
attrs: { "flip": "none" },
test(panel) {
panel.openPopup(document.documentElement, "", -100 - window.mozInnerScreenX, -100 - window.mozInnerScreenY, false, false, null);
window.moveBy(-50, -50);
},
result(testname, panel) {
if (navigator.platform.includes("Linux")) {
// The window position doesn't get updated immediately on Linux.
return;
}
var panelrect = panel.getBoundingClientRect();
is(panelrect.left, -150 - window.mozInnerScreenX, testname + "left");
is(panelrect.top, -150 - window.mozInnerScreenY, testname + "top");
is(panelrect.width, 120, testname + "width");
is(panelrect.height, 40, testname + "height");
var screenRect = panel.getOuterScreenRect();
is(screenRect.left, -150, testname + " screen left");
is(screenRect.top, -150, testname + " screen top");
is(screenRect.width, 120, testname + " screen width");
is(screenRect.height, 40, testname + " screen height");
}
},
];
window.arguments[0].SimpleTest.waitForFocus(test_panels, window);
]]>
</script>
</window>