The Tor Browser: layout/base/tests/test_maxLineBoxWidth.html@6474c204b198 (annotated)

layout/base/tests/test_maxLineBoxWidth.html@6474c204b198 (annotated)

layout/base/tests/test_maxLineBoxWidth.html

Wed, 31 Dec 2014 06:09:35 +0100

author: Michael Schloh von Bennewitz <michael@schloh.com>
date: Wed, 31 Dec 2014 06:09:35 +0100
changeset 0: 6474c204b198
permissions: -rw-r--r--

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

 <!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">&nbsp;</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>

The Tor Browser / annotate

layout/base/tests/test_maxLineBoxWidth.html@6474c204b198 (annotated)

layout/base/tests/test_maxLineBoxWidth.html