src/third_party/WebKit/LayoutTests/fast/regions/cssom/flowed-content-bounding-client-rect-vertical.html

   1 <!DOCTYPE html>
   2
   3 <link rel="stylesheet" href="../resources/region-style.css"></link>
   4 <script type="text/javascript" charset="utf-8" src="../resources/helper.js"></script>
   5
   6 <style>
   7     html { -webkit-writing-mode: vertical-lr; }
   8
   9     body { margin: 10px; }
  10
  11     #region1 {
  12         position: absolute;
  13         left: 100px;
  14         width: 100px;
  15         height: 50px;
  16     }
  17
  18     #region2 {
  19         position: absolute;
  20         left: 240px;
  21         width: 60px;
  22         height: 70px;
  23         padding: 10px 20px 30px 40px;
  24         border: 1px solid black;
  25     }
  26
  27     .finished #region1, .finished #region2 {
  28         display: none;
  29     }
  30 </style>
  31
  32 <div id="flow" class="flowArticle">
  33     <div id="green" class="greenBox"></div>
  34     <div id="blue" class="blueBox"></div>
  35     <div id="orange" class="orangeBox"></div>
  36 </div>
  37
  38 <div id="region1" class="regionArticle"></div>
  39 <div id="region2" class="regionArticle"></div>
  40
  41 <script>
  42     if (window.testRunner)
  43         testRunner.dumpAsText();
  44
  45     var expectedBoundingRects = {
  46         green: [10, 100, 60, 150, 50, 50],
  47         blue: [10, 150, 60, 200, 50, 50],
  48         orange: [21, 281, 71, 331, 50, 50]
  49     };
  50
  51     if (testBoundingRects(expectedBoundingRects))
  52         document.body.className = "finished";
  53 </script>