diff options
Diffstat (limited to 'toolkit/content/tests/chrome/test_arrowpanel.xul')
| -rw-r--r-- | toolkit/content/tests/chrome/test_arrowpanel.xul | 327 |
1 files changed, 327 insertions, 0 deletions
diff --git a/toolkit/content/tests/chrome/test_arrowpanel.xul b/toolkit/content/tests/chrome/test_arrowpanel.xul new file mode 100644 index 000000000..671c33a15 --- /dev/null +++ b/toolkit/content/tests/chrome/test_arrowpanel.xul @@ -0,0 +1,327 @@ +<?xml version="1.0"?> +<?xml-stylesheet href="chrome://global/skin" type="text/css"?> +<?xml-stylesheet href="/tests/SimpleTest/test.css" type="text/css"?> + +<window title="Arrow Panels" + style="padding: 10px;" + 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"/> + +<stack flex="1"> + <label id="topleft" value="Top Left Corner" left="15" top="15"/> + <label id="topright" value="Top Right" right="15" top="15"/> + <label id="bottomleft" value="Bottom Left Corner" left="15" bottom="15"/> + <label id="bottomright" value="Bottom Right" right="15" bottom="15"/> + <!-- Our SimpleTest/TestRunner.js runs tests inside an iframe which sizes are W=500 H=300. + 'left' and 'top' values need to be set so that the panel (popup) has enough room to display on its 4 sides. --> + <label id="middle" value="+/- Centered" left="225" top="135"/> + <iframe id="frame" type="content" + src="data:text/html,<input id='input'>" width="100" height="100" left="225" top="120"/> +</stack> + +<panel id="panel" type="arrow" animate="false" + onpopupshown="checkPanelPosition(this)" onpopuphidden="runNextTest.next()"> + <box width="115" height="65"/> +</panel> + +<panel id="bigpanel" type="arrow" animate="false" + onpopupshown="checkBigPanel(this)" onpopuphidden="runNextTest.next()"> + <box width="125" height="3000"/> +</panel> + +<panel id="animatepanel" type="arrow" + onpopupshown="animatedPopupShown = true;" + onpopuphidden="animatedPopupHidden = true; runNextTest.next();"> + <label value="Animate Closed" height="40"/> +</panel> + +<script type="application/javascript"> +<![CDATA[ + +SimpleTest.waitForExplicitFinish(); + +const isOSXYosemite = navigator.userAgent.indexOf("Mac OS X 10.10") != -1; + +var expectedAnchor = null; +var expectedSide = "", expectedAnchorEdge = "", expectedPack = "", expectedAlignment = ""; +var zoomFactor = 1; +var animatedPopupShown = false; +var animatedPopupHidden = false; +var runNextTest; + +function startTest() +{ + runNextTest = nextTest(); + runNextTest.next(); +} + +function nextTest() +{ + var panel = $("panel"); + + function openPopup(position, anchor, expected, anchorEdge, pack, alignment) + { + expectedAnchor = anchor instanceof Node ? anchor : $(anchor); + expectedSide = expected; + expectedAnchorEdge = anchorEdge; + expectedPack = pack; + expectedAlignment = alignment == undefined ? position : alignment; + + panel.removeAttribute("side"); + panel.openPopup(expectedAnchor, position, 0, 0, false, false, null); + } + + for (var iter = 0; iter < 2; iter++) { + openPopup("after_start", "topleft", "top", "left", "start"); + yield; + openPopup("after_start", "bottomleft", "bottom", "left", "start", "before_start"); + yield; + openPopup("before_start", "topleft", "top", "left", "start", "after_start"); + yield; + openPopup("before_start", "bottomleft", "bottom", "left", "start"); + yield; + openPopup("after_start", "middle", "top", "left", "start"); + yield; + openPopup("before_start", "middle", "bottom", "left", "start"); + yield; + + openPopup("after_start", "topright", "top", "right", "end", "after_end"); + yield; + openPopup("after_start", "bottomright", "bottom", "right", "end", "before_end"); + yield; + openPopup("before_start", "topright", "top", "right", "end", "after_end"); + yield; + openPopup("before_start", "bottomright", "bottom", "right", "end", "before_end"); + yield; + + openPopup("after_end", "middle", "top", "right", "end"); + yield; + openPopup("before_end", "middle", "bottom", "right", "end"); + yield; + + openPopup("start_before", "topleft", "left", "top", "start", "end_before"); + yield; + openPopup("start_before", "topright", "right", "top", "start"); + yield; + openPopup("end_before", "topleft", "left", "top", "start"); + yield; + openPopup("end_before", "topright", "right", "top", "start", "start_before"); + yield; + openPopup("start_before", "middle", "right", "top", "start"); + yield; + openPopup("end_before", "middle", "left", "top", "start"); + yield; + + openPopup("start_before", "bottomleft", "left", "bottom", "end", "end_after"); + yield; + openPopup("start_before", "bottomright", "right", "bottom", "end", "start_after"); + yield; + openPopup("end_before", "bottomleft", "left", "bottom", "end", "end_after"); + yield; + openPopup("end_before", "bottomright", "right", "bottom", "end", "start_after"); + yield; + + openPopup("start_after", "middle", "right", "bottom", "end"); + yield; + openPopup("end_after", "middle", "left", "bottom", "end"); + yield; + + openPopup("topcenter bottomleft", "bottomleft", "bottom", "center left", "start", "before_start"); + yield; + openPopup("bottomcenter topleft", "topleft", "top", "center left", "start", "after_start"); + yield; + openPopup("topcenter bottomright", "bottomright", "bottom", "center right", "end", "before_end"); + yield; + openPopup("bottomcenter topright", "topright", "top", "center right", "end", "after_end"); + yield; + openPopup("topcenter bottomleft", "middle", "bottom", "center left", "start", "before_start"); + yield; + openPopup("bottomcenter topleft", "middle", "top", "center left", "start", "after_start"); + yield; + + openPopup("leftcenter topright", "middle", "right", "center top", "start", "start_before"); + yield; + openPopup("rightcenter bottomleft", "middle", "left", "center bottom", "end", "end_after"); + yield; + +/* + XXXndeakin disable these parts of the test which often cause problems, see bug 626563 + + openPopup("after_start", frames[0].document.getElementById("input"), "top", "left", "start"); + yield; + + setScale(frames[0], 1.5); + openPopup("after_start", frames[0].document.getElementById("input"), "top", "left", "start"); + yield; + + setScale(frames[0], 2.5); + openPopup("before_start", frames[0].document.getElementById("input"), "bottom", "left", "start"); + yield; + + setScale(frames[0], 1); +*/ + + $("bigpanel").openPopup($("topleft"), "after_start", 0, 0, false, false, null, "start"); + yield; + + // switch to rtl mode + document.documentElement.style.direction = "rtl"; + $("topleft").setAttribute("right", "15"); + $("topright").setAttribute("left", "15"); + $("bottomleft").setAttribute("right", "15"); + $("bottomright").setAttribute("left", "15"); + $("topleft").removeAttribute("left"); + $("topright").removeAttribute("right"); + $("bottomleft").removeAttribute("left"); + $("bottomright").removeAttribute("right"); + } + + // Test that a transition occurs when opening or closing the popup. The transition is + // disabled on Linux. + if (navigator.platform.indexOf("Linux") == -1) { + function transitionEnded(event) { + if ($("animatepanel").state != "open") { + is($("animatepanel").state, "showing", "state is showing during transitionend"); + ok(!animatedPopupShown, "popupshown not fired yet") + } else { + is($("animatepanel").state, "open", "state is open after transitionend"); + ok(animatedPopupShown, "popupshown now fired") + SimpleTest.executeSoon(() => runNextTest.next()); + } + } + + // Check that the transition occurs for an arrow panel with animate="true" + window.addEventListener("transitionend", transitionEnded, false); + $("animatepanel").openPopup($("topleft"), "after_start", 0, 0, false, false, null, "start"); + is($("animatepanel").state, "showing", "state is showing"); + yield; + window.removeEventListener("transitionend", transitionEnded, false); + + synthesizeKey("VK_ESCAPE", { }); + ok(!animatedPopupHidden, "animated popup not hidden yet"); + yield; + } + + SimpleTest.finish() + yield; +} + +function setScale(win, scale) +{ + var wn = win.QueryInterface(Components.interfaces.nsIInterfaceRequestor) + .getInterface(Components.interfaces.nsIWebNavigation); + var shell = wn.QueryInterface(Components.interfaces.nsIDocShell); + var docViewer = shell.contentViewer; + docViewer.fullZoom = scale; + zoomFactor = scale; +} + +function checkPanelPosition(panel) +{ + let anchor = panel.anchorNode; + let adj = 0, hwinpos = 0, vwinpos = 0; + if (anchor.ownerDocument != document) { + var framerect = anchor.ownerDocument.defaultView.frameElement.getBoundingClientRect(); + hwinpos = framerect.left; + vwinpos = framerect.top; + } + + // Positions are reversed in rtl yet the coordinates used in the computations + // are not, so flip the expected label side and anchor edge. + var isRTL = (window.getComputedStyle(panel).direction == "rtl"); + if (isRTL) { + var flipLeftRight = val => val == "left" ? "right" : "left"; + expectedAnchorEdge = expectedAnchorEdge.replace(/(left|right)/, flipLeftRight); + expectedSide = expectedSide.replace(/(left|right)/, flipLeftRight); + } + + var panelRect = panel.getBoundingClientRect(); + var anchorRect = anchor.getBoundingClientRect(); + var contentBO = panel.firstChild.boxObject; + var contentRect = { top: contentBO.y, + left: contentBO.x, + bottom: contentBO.y + contentBO.height, + right: contentBO.x + contentBO.width }; + switch (expectedSide) { + case "top": + ok(contentRect.top > vwinpos + anchorRect.bottom * zoomFactor + 5, "panel content is below"); + break; + case "bottom": + ok(contentRect.bottom < vwinpos + anchorRect.top * zoomFactor - 5, "panel content is above"); + break; + case "left": + ok(contentRect.left > hwinpos + anchorRect.right * zoomFactor + 5, "panel content is right"); + break; + case "right": + ok(contentRect.right < hwinpos + anchorRect.left * zoomFactor - 5, "panel content is left"); + break; + } + + let iscentered = false; + if (expectedAnchorEdge.indexOf("center ") == 0) { + expectedAnchorEdge = expectedAnchorEdge.substring(7); + iscentered = true; + } + + switch (expectedAnchorEdge) { + case "top": + adj = vwinpos + parseInt(getComputedStyle(panel, "").marginTop); + if (iscentered) + adj += Math.round(anchorRect.height) / 2; + isWithinHalfPixel(panelRect.top, anchorRect.top * zoomFactor + adj, "anchored on top"); + break; + case "bottom": + adj = vwinpos + parseInt(getComputedStyle(panel, "").marginBottom); + if (iscentered) + adj += Math.round(anchorRect.height) / 2; + isWithinHalfPixel(panelRect.bottom, anchorRect.bottom * zoomFactor - adj, "anchored on bottom"); + break; + case "left": + adj = hwinpos + parseInt(getComputedStyle(panel, "").marginLeft); + if (iscentered) + adj += Math.round(anchorRect.width) / 2; + isWithinHalfPixel(panelRect.left, anchorRect.left * zoomFactor + adj, "anchored on left "); + break; + case "right": + adj = hwinpos + parseInt(getComputedStyle(panel, "").marginRight); + if (iscentered) + adj += Math.round(anchorRect.width) / 2; + if (!isOSXYosemite) + isWithinHalfPixel(panelRect.right, anchorRect.right * zoomFactor - adj, "anchored on right"); + break; + } + + is(anchor, expectedAnchor, "anchor"); + + var arrow = document.getAnonymousElementByAttribute(panel, "anonid", "arrow"); + is(arrow.getAttribute("side"), expectedSide, "panel arrow side"); + is(arrow.hidden, false, "panel hidden"); + is(arrow.parentNode.pack, expectedPack, "panel arrow pack"); + is(panel.alignmentPosition, expectedAlignment, "panel alignmentPosition"); + + panel.hidePopup(); +} + +function isWithinHalfPixel(a, b, desc) +{ + ok(Math.abs(a - b) <= 0.5, desc); +} + +function checkBigPanel(panel) +{ + ok(panel.firstChild.getBoundingClientRect().height < 2800, "big panel height"); + panel.hidePopup(); +} + +SimpleTest.waitForFocus(startTest); + +]]> +</script> + +<body xmlns="http://www.w3.org/1999/xhtml"/> + +</window> |