summaryrefslogtreecommitdiffstats
path: root/toolkit/content/tests/chrome/test_popup_scaled.xhtml
diff options
context:
space:
mode:
Diffstat (limited to 'toolkit/content/tests/chrome/test_popup_scaled.xhtml')
-rw-r--r--toolkit/content/tests/chrome/test_popup_scaled.xhtml98
1 files changed, 98 insertions, 0 deletions
diff --git a/toolkit/content/tests/chrome/test_popup_scaled.xhtml b/toolkit/content/tests/chrome/test_popup_scaled.xhtml
new file mode 100644
index 0000000000..eda4d7231e
--- /dev/null
+++ b/toolkit/content/tests/chrome/test_popup_scaled.xhtml
@@ -0,0 +1,98 @@
+<?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="Popups in Scaled Content"
+ onload="setTimeout(runTests, 0);"
+ xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+
+ <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+ <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
+
+<!-- This test checks that the position is correct in two cases:
+ - a popup anchored at an element in a scaled document
+ - a popup opened at a screen coordinate in a scaled window
+ -->
+
+<iframe id="frame" width="60" height="140"
+ src="data:text/html,&lt;html&gt;&lt;body&gt;&lt;input size='4' id='one'&gt;&lt;input size='4' id='two'&gt;&lt;/body&gt;&lt;/html&gt;"/>
+
+<menupopup id="popup" onpopupshown="shown()" onpopuphidden="nextTest()">
+ <menuitem label="One"/>
+</menupopup>
+
+<script class="testbody" type="application/javascript">
+<![CDATA[
+
+var screenTest = false;
+var screenx = -1, screeny = -1;
+
+SimpleTest.waitForExplicitFinish();
+
+function runTests()
+{
+ setScale($("frame").contentWindow, 2);
+
+ var anchor = $("frame").contentDocument.getElementById("two");
+ anchor.getBoundingClientRect(); // flush to update display after scale change
+ $("popup").openPopup(anchor, "after_start");
+}
+
+function setScale(win, scale)
+{
+ SpecialPowers.setFullZoom(win, scale);
+}
+
+function shown()
+{
+ var popup = $("popup");
+ var marginLeft = parseFloat(getComputedStyle(popup).marginLeft);
+ var marginTop = parseFloat(getComputedStyle(popup).marginTop);
+ if (screenTest) {
+ is(popup.screenX - marginLeft, screenx, "screen left position");
+ is(popup.screenY - marginTop, screeny, "screen top position");
+ } else {
+ var anchor = $("frame").contentDocument.getElementById("two");
+ is(Math.round(anchor.getBoundingClientRect().left * 2),
+ Math.round(popup.getBoundingClientRect().left - marginLeft), "anchored left position");
+ is(Math.round(anchor.getBoundingClientRect().bottom * 2),
+ Math.round(popup.getBoundingClientRect().top - marginTop), "anchored top position");
+ }
+
+ popup.hidePopup();
+}
+
+function nextTest()
+{
+ if (screenTest) {
+ setScale(window, 1);
+ SimpleTest.finish();
+ }
+ else {
+ screenTest = true;
+ var rootElement = document.documentElement;
+
+ setScale(window, 2);
+ // - the iframe will be at 4×, but out here css pixels are only 2× device pixels
+
+ requestAnimationFrame(() => requestAnimationFrame(() => {
+ screenx = rootElement.screenX + 20;
+ screeny = rootElement.screenY + 20;
+ $("popup").openPopupAtScreen(screenx, screeny);
+ }));
+ }
+}
+
+]]>
+</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>