src/third_party/WebKit/LayoutTests/fast/regions/cssom/overset-break.html

   1 <!doctype html>
   2 <html>
   3     <head>
   4         <title>Bug 92497 - [CSS Regions] Region overset property is not properly computed when there is a region break</title>
   5         <style type="text/css">
   6             .content {
   7                 -webkit-flow-into: flow;
   8                 background-color: #ddd;
   9             }
  10
  11             .content p:first-child {
  12                 -webkit-region-break-after: always;
  13                 margin-bottom: 4em; /*shouldn't spill over the forced break*/
  14             }
  15
  16             .container {
  17                 -webkit-flow-from: flow;
  18                 width:250px;
  19                 height:120px;
  20                 border: 1px solid #444;
  21                 margin-top: 1em;
  22             }
  23
  24             .fail #pass, .pass #fail { display: none; }
  25         </style>
  26     </head>
  27
  28     <body>
  29         <div class="content"><p>content with break-after: always;</p></div>
  30
  31         <div class="container" id="r1"></div> <div id="overset1">explanation goes here</div>
  32         <div class="container" id="r2"></div> <div id="overset2">explanation goes here</div>
  33         <div class="container" id="r3"></div> <div id="overset3">explanation goes here</div>
  34
  35         <script type="text/javascript">
  36             if(window.testRunner)
  37                 testRunner.dumpAsText();
  38             var r1 = document.getElementById("r1").webkitRegionOverset;
  39             document.getElementById("overset1").innerHTML = r1 + " vs fit";
  40             var r2 = document.getElementById("r2").webkitRegionOverset;
  41             document.getElementById("overset2").innerHTML = r2 + " vs empty";
  42             var r3 = document.getElementById("r3").webkitRegionOverset;
  43             document.getElementById("overset3").innerHTML = r3 + " vs empty";
  44             document.body.className = (r1 == "fit" && r2 == "empty" && r3 == "empty") ? "pass" : "fail";
  45         </script>
  46
  47         <div id="pass">PASS</div>
  48         <div id="fail">FAIL</div>
  49
  50         <p><a href="https://bugs.webkit.org/show_bug.cgi?id=92497">Bug 92497</a> - [CSS Regions] Region overset property is not properly computed when there is a region break</p>
  51
  52     </body>
  53 </html>