mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-07 20:17:37 +00:00
192 lines
5.8 KiB
HTML
192 lines
5.8 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<!--
|
|
https://bugzilla.mozilla.org/show_bug.cgi?id=780258
|
|
-->
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Test for Bug 780258</title>
|
|
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
|
<script type="text/javascript" src="/tests/SimpleTest/WindowSnapshot.js"></script>
|
|
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
|
<style>
|
|
p {
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.leftPadd {
|
|
padding-left: 100px;
|
|
}
|
|
|
|
#container {
|
|
width: 200px;
|
|
}
|
|
|
|
#box {
|
|
position: absolute;
|
|
height: 600px;
|
|
width: 200px;
|
|
border: 1px solid blue;
|
|
}
|
|
|
|
#constrained {
|
|
display: none;
|
|
border: 1px solid red;
|
|
height: 200px;
|
|
width: 300px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=780258">Mozilla Bug 780258</a>
|
|
<p id="display"></p>
|
|
|
|
<div id="content" style="display: none">
|
|
<div id="box"> </div>
|
|
<div id="container">
|
|
<p>All of this text should be completely contained
|
|
within the blue box.
|
|
<p>I once knew a man, showed me the sleight of hand.
|
|
In the blink of an eye he danced across the strings.
|
|
He played a song I've never heard; poignant and absurd;
|
|
To this day, it leaves me wondering.
|
|
<p>Don't let tomorrow find you wishin'.
|
|
Boy, you've got a mission.
|
|
Shake it, rattle, and roll.
|
|
Now, just use your intuition.
|
|
You'll get less competition
|
|
from the clock up on the wall.
|
|
<p>You are what you are.
|
|
You dream what you dream.
|
|
Play on your blue guitar for me.
|
|
</div>
|
|
<div id="constrained">
|
|
<p>This text should not apply the max line box width, since it exists within a constrained height block. This is used for limiting the reflow-on-zoom feature for constrained height blocks, since otherwise they could overflow into an element later in the document, or potentially have their text cut off vertically.
|
|
</div>
|
|
</div>
|
|
<pre id="test">
|
|
<script type="application/javascript">
|
|
/** Test for Bug 780258 and Bug 803211 **/
|
|
|
|
var gNarrowerContentSnap;
|
|
var gWideContentSnap;
|
|
var gFirstBlankSnap;
|
|
var gUnchangedContentSnap;
|
|
var gIncorrectContentSnap;
|
|
var gCorrectContentSnap;
|
|
|
|
function setupFirstTest() {
|
|
gFirstBlankSnap = snapshotWindow(window);
|
|
|
|
// Display our content.
|
|
document.getElementById('content').style.display = 'block';
|
|
|
|
// Take a snapshot.
|
|
gUnchangedContentSnap = snapshotWindow(window);
|
|
}
|
|
|
|
function performFirstTest() {
|
|
setupFirstTest();
|
|
// Verify this isn't the same as the blank snapshot.
|
|
var result = compareSnapshots(gFirstBlankSnap, gUnchangedContentSnap, false);
|
|
ok(result[0], "content should appear different than blank page");
|
|
|
|
// Set container width to 350px.
|
|
document.getElementById('container').style.width = '350px';
|
|
|
|
// Take a snapshot.
|
|
gIncorrectContentSnap = snapshotWindow(window);
|
|
|
|
// Verify this is NOT the same as the first content snapshot.
|
|
result = compareSnapshots(gUnchangedContentSnap, gIncorrectContentSnap, false);
|
|
ok(result[0], "unchanged content should be different than changed content");
|
|
|
|
// Run the max line box width change.
|
|
SpecialPowers.setMaxLineBoxWidth(window, 200);
|
|
|
|
// Take snapshot.
|
|
gCorrectContentSnap = snapshotWindow(window);
|
|
|
|
// Compare snapshots.
|
|
result = compareSnapshots(gUnchangedContentSnap, gCorrectContentSnap, true);
|
|
ok(result[0], "unchanged content should be the same as corrected content");
|
|
}
|
|
|
|
function setupSecondTest() {
|
|
var elements = document.getElementById("container").getElementsByTagName("p");
|
|
for (var i = 0; i < elements.length; i++) {
|
|
elements[i].setAttribute("class", "leftPadd");
|
|
}
|
|
|
|
document.getElementById("box").style.paddingLeft = "100px";
|
|
|
|
document.getElementById("container").style.width = "300px";
|
|
}
|
|
|
|
// Another test to verify that the max line box width is
|
|
// actually forcing the WIDTH of the line boxes, and not
|
|
// the absolute right edge to be set
|
|
function performSecondTest() {
|
|
setupSecondTest();
|
|
SpecialPowers.setMaxLineBoxWidth(window, 2000);
|
|
|
|
// Take a snapshot with a max line box width of 200px;
|
|
gWideContentSnap = snapshotWindow(window);
|
|
|
|
SpecialPowers.setMaxLineBoxWidth(window, 200);
|
|
|
|
// Take a snapshot with the new max line box width
|
|
gNarrowerContentSnap = snapshotWindow(window);
|
|
|
|
// Compare snapshots.
|
|
result = compareSnapshots(gNarrowerContentSnap, gWideContentSnap, true);
|
|
ok(result[0], "content with a max line box width of 2000px and content with" +
|
|
" a max line box width of 200px should be the same with a 100px left padding");
|
|
}
|
|
|
|
function setupThirdTest() {
|
|
document.getElementById('container').style.display = 'none';
|
|
document.getElementById('box').style.display = 'none';
|
|
document.getElementById('constrained').style.display = 'block';
|
|
}
|
|
|
|
function performThirdTest() {
|
|
setupThirdTest();
|
|
|
|
// Take a snapshot of what the content looks like before.
|
|
gCorrectContentSnap = snapshotWindow(window);
|
|
|
|
// Apply a max line box width.
|
|
SpecialPowers.setMaxLineBoxWidth(window, 200);
|
|
|
|
// Take another snapshot.
|
|
gNarrowerContentSnap = snapshotWindow(window);
|
|
|
|
// Verify the max line box width change hasn't changed anything.
|
|
result = compareSnapshots(gNarrowerContentSnap, gCorrectContentSnap, true);
|
|
ok(result[0], "constrained height elements should not be subjected to max line box width adjustments");
|
|
}
|
|
|
|
SimpleTest.waitForExplicitFinish();
|
|
|
|
// The first test verifies that the max line box width
|
|
// actually causes a change in page layout.
|
|
performFirstTest();
|
|
|
|
// The second test verifies that the max line box width
|
|
// is actually measuring width, and not position of
|
|
// the left/right edges of the line box.
|
|
performSecondTest();
|
|
|
|
// The third test verifies that the max line box width
|
|
// does not have any effect on constrained height elements.
|
|
performThirdTest();
|
|
|
|
// Finish the test.
|
|
SimpleTest.finish();
|
|
|
|
</script>
|
|
</pre>
|
|
</body>
|
|
</html>
|