Files
tubestation/toolkit/content/tests/chrome/test_scrollbar.xhtml
Emilio Cobos Álvarez f9e7ddcde4 Bug 1824236 - Stop using XUL layout for scrollbars. r=jwatt
This rewrites scrollbar layout to work with regular reflow rather than
box layout.

Overall it's about the same amount of code (mostly because
nsScrollbarFrame::Reflow is sorta hand-rolled), but it cleans up a bit
and it is progress towards removing XUL layout altogether, without
getting into much deeper refactoring.

This also blocks some other performance improvements and refactorings I
want to make in this code.

We make some assumptions to simplify the code that to some extent were
made already before, both explicitly and by virtue of using XUL layout.

In particular, we assume that scrollbar / slider / thumb has no border or
padding and that the writing-mode is horizontal ltr.

Differential Revision: https://phabricator.services.mozilla.com/D173489
2023-03-27 20:54:53 +00:00

132 lines
4.8 KiB
HTML

<?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"?>
<!--
XUL Widget Test for scrollbars
-->
<window title="Scrollbar"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"/>
<script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"/>
<!-- test results are displayed in the html:body -->
<body xmlns="http://www.w3.org/1999/xhtml"/>
<hbox>
<scrollbar orient="horizontal"
id="scroller"
curpos="0"
maxpos="600"
pageincrement="400"
style="width: 500px; margin: 0"/>
</hbox>
<!-- test code goes here -->
<script type="application/javascript"><![CDATA[
/** Test for Scrollbar **/
var scrollbarTester = {
scrollbar: null,
middlePref: false,
startTest() {
this.scrollbar = $("scroller");
this.middlePref = this.getMiddlePref();
var self = this;
[0, 1, 2].map(function(button) {
[false, true].map(function(alt) {
[false, true].map(function(shift) {
self.testThumbDragging(button, alt, shift);
})
})
});
SimpleTest.finish();
},
testThumbDragging(button, withAlt, withShift) {
this.reset();
var x = 160; // on the right half of the thumb
var y = 5;
var isMac = navigator.platform.includes("Mac");
let runtime = SpecialPowers.Services.appinfo;
var isGtk = runtime.widgetToolkit.includes("gtk");
// Start the drag.
this.mousedown(x, y, button, withAlt, withShift);
var newPos = this.getPos();
var scrollToClick = (newPos != 0);
if (isMac || isGtk) {
ok(!scrollToClick, "On Linux and Mac OS X, clicking the scrollbar thumb "+
"should never move it.");
} else if (button == 0 && withShift) {
ok(scrollToClick, "On platforms other than Linux and Mac OS X, holding "+
"shift should enable scroll-to-click on the scrollbar thumb.");
} else if (button == 1 && this.middlePref) {
ok(scrollToClick, "When middlemouse.scrollbarPosition is on, clicking the "+
"thumb with the middle mouse button should center it "+
"around the cursor.")
}
// Move one pixel to the right.
this.mousemove(x+1, y, button, withAlt, withShift);
var newPos2 = this.getPos();
if (newPos2 != newPos) {
ok(newPos2 > newPos, "Scrollbar thumb should follow the mouse when dragged.");
ok(newPos2 - newPos < 3, "Scrollbar shouldn't move further than the mouse when dragged.");
ok(button == 0 || (button == 1 && this.middlePref) || (button == 2 && isGtk),
"Dragging the scrollbar should only be possible with the left mouse button.");
} else if (button == 0) {
// Dragging had no effect.
ok(false, "Dragging the scrollbar thumb should work.");
} else if (button == 1 && this.middlePref && (!isGtk && !isMac)) {
ok(false, "When middlemouse.scrollbarPosition is on, dragging the "+
"scrollbar thumb should be possible using the middle mouse button.");
} else {
ok(true, "Dragging works correctly.");
}
// Release the mouse button.
this.mouseup(x+1, y, button, withAlt, withShift);
var newPos3 = this.getPos();
ok(newPos3 == newPos2,
"Releasing the mouse button after dragging the thumb shouldn't move it.");
},
getMiddlePref() {
// It would be better to test with different middlePref settings,
// but the setting is only queried once, at browser startup, so
// changing it here wouldn't have any effect
var mouseBranch = SpecialPowers.Services.prefs.getBranch("middlemouse.");
return mouseBranch.getBoolPref("scrollbarPosition");
},
setPos(pos) {
this.scrollbar.setAttribute("curpos", pos);
},
getPos() {
return this.scrollbar.getAttribute("curpos");
},
reset() {
this.setPos(0);
},
mousedown(x, y, button, alt, shift) {
synthesizeMouse(this.scrollbar, x, y, { type: "mousedown", 'button': button,
altKey: alt, shiftKey: shift });
},
mousemove(x, y, button, alt, shift) {
synthesizeMouse(this.scrollbar, x, y, { type: "mousemove", 'button': button,
altKey: alt, shiftKey: shift });
},
mouseup(x, y, button, alt, shift) {
synthesizeMouse(this.scrollbar, x, y, { type: "mouseup", 'button': button,
altKey: alt, shiftKey: shift });
}
}
function doTest() {
setTimeout(function() { scrollbarTester.startTest(); }, 0);
}
SimpleTest.waitForExplicitFinish();
addLoadEvent(doTest);
]]></script>
</window>