2012-09-05 14:39:34 -07:00
<!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;
}
2012-10-25 14:38:54 -07:00
.leftPadd {
padding-left: 100px;
}
2012-09-05 14:39:34 -07:00
#container {
width: 200px;
}
2012-10-25 14:38:54 -07:00
#box {
2012-09-05 14:39:34 -07:00
position: absolute;
height: 600px;
width: 200px;
border: 1px solid blue;
}
2012-12-04 20:14:56 -08:00
#constrained {
display: none;
border: 1px solid red;
height: 200px;
width: 300px;
}
2012-09-05 14:39:34 -07:00
< / 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" >
2012-10-25 14:38:54 -07:00
< div id = "box" > < / div >
2012-09-05 14:39:34 -07:00
< 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 >
2012-12-04 20:14:56 -08:00
< 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 >
2012-09-05 14:39:34 -07:00
< / div >
< pre id = "test" >
< script type = "application/javascript" >
2012-10-25 14:38:54 -07:00
/** Test for Bug 780258 and Bug 803211 **/
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
var gNarrowerContentSnap;
var gWideContentSnap;
2012-09-05 14:39:34 -07:00
var gFirstBlankSnap;
var gUnchangedContentSnap;
var gIncorrectContentSnap;
var gCorrectContentSnap;
2012-10-25 14:38:54 -07:00
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");
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
// 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");
}
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
document.getElementById("box").style.paddingLeft = "100px";
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
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);
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
SpecialPowers.setMaxLineBoxWidth(window, 200);
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
// Take a snapshot with the new max line box width
gNarrowerContentSnap = snapshotWindow(window);
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
// 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");
}
2012-09-05 14:39:34 -07:00
2012-12-04 20:14:56 -08:00
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");
}
2012-10-25 14:38:54 -07:00
SimpleTest.waitForExplicitFinish();
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
// The first test verifies that the max line box width
// actually causes a change in page layout.
performFirstTest();
2012-09-05 14:39:34 -07:00
2012-10-25 14:38:54 -07:00
// 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();
2012-09-05 14:39:34 -07:00
2012-12-04 20:14:56 -08:00
// The third test verifies that the max line box width
// does not have any effect on constrained height elements.
performThirdTest();
2012-09-05 14:39:34 -07:00
// Finish the test.
SimpleTest.finish();
< / script >
< / pre >
< / body >
< / html >