src/third_party/WebKit/LayoutTests/fast/regions/auto-size/autoheight-regions-mark.html

   1 <!doctype html>
   2 <html>
   3     <!-- Tests that regions with auto-height are identified and flagged correctly -->
   4     <head>
   5         <style>
   6             .specifiedWidth { width: 50px; }
   7             .specifiedWidth2 { width: 100px; }
   8             .specifiedHeight { height: 50px; }
   9             .autoHeight { height: auto; }
  10
  11             #region  { -webkit-flow-from: flow; }
  12             #region2  { -webkit-flow-from: flow2; }
  13             #region3 { -webkit-flow-from: flow3; position: absolute; top: 50px; bottom: 100px; }
  14             #region4 { -webkit-flow-from: flow4; -webkit-writing-mode: vertical-lr; position: absolute; left: 50px; right: 100px; }
  15             #region5 { -webkit-flow-from: flow5; }
  16             #region6 { -webkit-flow-from: flow6; }
  17             #article7 { -webkit-flow-into: flow7; }
  18             #region7 { -webkit-flow-from: flow7; }
  19             #article8 { -webkit-flow-into: flow8; }
  20             #region8 { -webkit-flow-from: flow8; }
  21         </style>
  22     </head>
  23     <body>
  24         <!-- A region with specified height should not be marked as having auto height -->
  25         <div id="region" class="specifiedWidth specifiedHeight"></div>
  26
  27         <!-- A region without a specified height should be marked as having auto height -->
  28         <div id="region2" class="specifiedWidth"></div>
  29
  30         <!-- An out of flow region with height auto and specified top/bottom should not be marked
  31         as auto-height -->
  32         <div id="region3" class="specifiedWidth"></div>
  33
  34         <!-- An out of flow region with height auto, vertical writing mode, specified left/right should
  35         not be marked as auto-height-->
  36         <div id="region4" class="specifiedHeight"></div>
  37
  38         <!-- Dynamic change of height values should mark the regions auto height correctly -->
  39         <div id="region5" class="specifiedWidth specifiedHeight"></div>
  40         <div id="region6" class="specifiedWidth"></div>
  41         <script>
  42             document.getElementById("region5").className = "specifiedWidth autoHeight";
  43             document.getElementById("region6").className = "specifiedWidth specifiedHeight";
  44         </script>
  45
  46         <!-- An invalid region should not be marked as auto height even if it has height:auto since it will not get
  47         any content. Below, region8 is invalid. -->
  48         <div id="article8">
  49             <div id="region7" class="specifiedWidth"></div>
  50         </div>
  51         <div id="article7">
  52             <div id="region8" class="specifiedWidth"></div>
  53         </div>
  54         <script>
  55             // Changing style for an invalid region should not mark the region as autoHeight.
  56             document.getElementById("region8").className = "specifiedWidth2";
  57         </script>
  58     </body>
  59 </html>