118 lines
4.2 KiB
XML
118 lines
4.2 KiB
XML
<?xml version="1.0"?>
|
|
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
|
|
<?xml-stylesheet href="/tests/SimpleTest/test.css" type="text/css"?>
|
|
<?xml-stylesheet href="data:text/css, hbox { border: 1px solid red; } vbox { border: 1px solid green }" type="text/css"?>
|
|
<!--
|
|
XUL <splitter> collapsing tests
|
|
-->
|
|
<window title="XUL splitter collapsing tests"
|
|
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
|
orient="horizontal">
|
|
<script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"/>
|
|
<script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"/>
|
|
|
|
<!-- test results are displayed in the html:body -->
|
|
<body xmlns="http://www.w3.org/1999/xhtml">
|
|
</body>
|
|
|
|
<!-- test code goes here -->
|
|
<script type="application/javascript"><![CDATA[
|
|
SimpleTest.waitForExplicitFinish();
|
|
|
|
function dragSplitter(offsetX, callback) {
|
|
var splitterWidth = splitter.boxObject.width;
|
|
synthesizeMouse(splitter, splitterWidth / 2, 2, {type: "mousedown"});
|
|
synthesizeMouse(splitter, splitterWidth / 2, 1, {type: "mousemove"});
|
|
SimpleTest.executeSoon(function() {
|
|
SimpleTest.is(splitter.getAttribute("state"), "dragging", "The splitter should be dragged");
|
|
synthesizeMouse(splitter, offsetX, 1, {type: "mousemove"});
|
|
synthesizeMouse(splitter, offsetX, 1, {type: "mouseup"});
|
|
SimpleTest.executeSoon(callback);
|
|
});
|
|
}
|
|
|
|
function shouldBeCollapsed(where) {
|
|
SimpleTest.is(splitter.getAttribute("state"), "collapsed", "The splitter should be collapsed");
|
|
SimpleTest.is(splitter.getAttribute("substate"), where, "The splitter should be collapsed " + where);
|
|
}
|
|
|
|
function shouldNotBeCollapsed() {
|
|
SimpleTest.is(splitter.getAttribute("state"), "", "The splitter should not be collapsed");
|
|
}
|
|
|
|
function runPass(rightCollapsed, leftCollapsed, callback) {
|
|
var containerWidth = container.boxObject.width;
|
|
var isRTL = getComputedStyle(splitter, null).direction == "rtl";
|
|
dragSplitter(containerWidth, function() {
|
|
if (rightCollapsed) {
|
|
shouldBeCollapsed(isRTL ? "before" : "after");
|
|
} else {
|
|
shouldNotBeCollapsed();
|
|
}
|
|
dragSplitter(-containerWidth * 2, function() {
|
|
if (leftCollapsed) {
|
|
shouldBeCollapsed(isRTL ? "after" : "before");
|
|
} else {
|
|
shouldNotBeCollapsed();
|
|
}
|
|
dragSplitter(containerWidth / 2, function() {
|
|
// the splitter should never be collapsed in the middle
|
|
shouldNotBeCollapsed();
|
|
callback();
|
|
});
|
|
});
|
|
});
|
|
}
|
|
|
|
var splitter, container;
|
|
function runLTRTests(callback) {
|
|
splitter = document.getElementById("ltr-splitter");
|
|
container = splitter.parentNode;
|
|
splitter.setAttribute("collapse", "before");
|
|
runPass(false, true, function() {
|
|
splitter.setAttribute("collapse", "after");
|
|
runPass(true, false, function() {
|
|
splitter.setAttribute("collapse", "both");
|
|
runPass(true, true, callback);
|
|
});
|
|
});
|
|
}
|
|
|
|
function runRTLTests(callback) {
|
|
splitter = document.getElementById("rtl-splitter");
|
|
container = splitter.parentNode;
|
|
splitter.setAttribute("collapse", "before");
|
|
runPass(true, false, function() {
|
|
splitter.setAttribute("collapse", "after");
|
|
runPass(false, true, function() {
|
|
splitter.setAttribute("collapse", "both");
|
|
runPass(true, true, callback);
|
|
});
|
|
});
|
|
}
|
|
|
|
function runTests() {
|
|
runLTRTests(function() {
|
|
runRTLTests(function() {
|
|
SimpleTest.finish();
|
|
});
|
|
});
|
|
}
|
|
|
|
addLoadEvent(function() {SimpleTest.executeSoon(runTests);});
|
|
]]></script>
|
|
|
|
<hbox style="max-width: 200px; height: 300px; direction: ltr;">
|
|
<vbox style="width: 100px; height: 300px;" flex="1"/>
|
|
<splitter id="ltr-splitter"/>
|
|
<vbox style="width: 100px; height: 300px;" flex="1"/>
|
|
</hbox>
|
|
|
|
<hbox style="max-width: 200px; height: 300px; direction: rtl;">
|
|
<vbox style="width: 100px; height: 300px;" flex="1"/>
|
|
<splitter id="rtl-splitter"/>
|
|
<vbox style="width: 100px; height: 300px;" flex="1"/>
|
|
</hbox>
|
|
|
|
</window>
|