Source code

Revision control

Copy as Markdown

Other Tools

<!DOCTYPE HTML>
<html>
<!--
-->
<head>
<meta charset="utf-8">
<title>Test for Bug 1689492, helper page</title>
<script type="application/javascript" src="apz_test_utils.js"></script>
<script type="application/javascript" src="apz_test_native_event_utils.js"></script>
<script src="/tests/SimpleTest/paint_listener.js"></script>
<script type="application/javascript">
// -------------------------------------------------------------------
// Infrastructure to get the test assertions to run at the right time.
// -------------------------------------------------------------------
var SimpleTest = window.opener.SimpleTest;
// --------------------------------------------------------------------
// In this test we have a scrollable root scroll frame (not needed, but
// more representative), a scrollable outer div, and a scrollable inner
// div. We scroll the inner div, and test that it gets a non-zero
// display port (not the main reason for the test, that should already
// work, but it's a good sanity check), and then check that the outer
// div gets a display port and (here's the important part of the test)
// that that display port has zero margins, ie it's relatively close to the
// dimensions of the outer div (it can't be exact because we align display
// ports). This tests a regression where the outer div would get non-zero
// margin display port even though it had never been scrolled (it still
// needs a display port because it has a scrollable child). We run the
// test several times with different sized outerdiv.
// --------------------------------------------------------------------
function createDivs(outerwidth, outerheight) {
let outerdiv = document.createElement("div");
outerdiv.id = "outerdiv";
outerdiv.style.width = outerwidth + "px";
outerdiv.style.height = outerheight + "px";
outerdiv.style.overflow = "scroll";
let innerdiv = document.createElement("div");
innerdiv.id = "innerdiv";
innerdiv.style.width = "25px";
innerdiv.style.height = "25px";
innerdiv.style.overflow = "scroll";
outerdiv.appendChild(innerdiv);
let innerspacer = document.createElement("div");
innerspacer.style.width = "25px";
innerspacer.style.height = "100px";
innerdiv.appendChild(innerspacer);
let outerspacer = document.createElement("div");
outerspacer.style.width = "50px";
outerspacer.style.height = "10000px";
outerdiv.appendChild(outerspacer);
let theplace = document.getElementById("theplace");
theplace.parentNode.insertBefore(outerdiv, theplace.nextSibling);
}
async function testOne(theheight, allowedscalefactor, outputprefix) {
createDivs(50, theheight);
// flush layout
document.documentElement.getBoundingClientRect();
await promiseApzFlushedRepaints();
document.getElementById("innerdiv").scrollTop = "10px";
// Activate the inner div.
await promiseMoveMouseAndScrollWheelOver(document.getElementById("innerdiv"), 0, 10);
await promiseApzFlushedRepaints();
let innerdp = getLastContentDisplayportFor("innerdiv");
ok(innerdp.height > 30, outputprefix + " innerdiv display port should be larger than innerdiv");
let outerdp = getLastContentDisplayportFor("outerdiv");
is(outerdp.x, 0, outputprefix + " outerdiv display port should be relatively bounded x");
is(outerdp.y, 0, outputprefix + " outerdiv display port should be relatively bounded y");
ok(outerdp.width <= 50, outputprefix + " outerdiv display port should relatively bounded w");
ok(outerdp.height < theheight * allowedscalefactor, outputprefix + " outerdiv display port should be relatively bounded h");
ok(true, "innerdp " + JSON.stringify(innerdp));
ok(true, "outerdp " + JSON.stringify(outerdp));
document.getElementById("outerdiv").remove();
}
async function test() {
// We test a variety of scroll frame heights.
// The first argument of testOne is the scroll frame height.
// The second argument is the allowed scale factor of scroll frame height
// to display port height.
// In the comment following each line we record the values of the display
// port height at the time of writing the test in both the good (ie with
// the bug this test is testing fixed), and bad (before the bug this
// test is testing fixed) cases. These values can obviously be different,
// but it gives a good idea that the good and bad values are far apart so
// this test should be robust, and provides good context in the future if
// this test starts failing.
await testOne( 50, 5.2, "(height 50)"); // good 256, bad 256
await testOne(128, 2.1, "(height128)"); // good 256, bad 512
await testOne(200, 2.0, "(height200)"); // good 384, bad 768
await testOne(256, 1.6, "(height256)"); // good 384, bad 768
await testOne(329, 1.6, "(height329)"); // good 512, bad 896
await testOne(500, 1.3, "(height500)"); // good 640, bad 280
await testOne(640, 1.7, "(height640)"); // good 1024, bad 1536
}
waitUntilApzStable()
.then(forceLayerTreeToCompositor)
.then(test)
.then(subtestDone, subtestFailed);
</script>
</head>
<body>
<a id="theplace" target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1689492">Mozilla Bug 1689492</a>
<!-- Put enough content into the page to make it have a nonzero scroll range, not needed -->
<div style="height: 5000px"></div>
</body>
</html>