third_party/WebKit/LayoutTests/compositing/contents-opaque/visibility-hidden.html

   1 <!DOCTYPE html>
   2 <html>
   3     <head>
   4         <style type="text/css">
   5             header {
   6                 position: absolute;
   7                 top: 20px;
   8                 width: 200px;
   9                 height: 50px;
  10                 background-color: silver;
  11                 transform: translateZ(0);
  12             }
  13             header.hidden {
  14                 visibility: hidden;
  15             }
  16             nav {
  17                 height: 37px;
  18                 overflow: hidden;
  19             }
  20             nav ul li {
  21                 height: 50px;
  22                 float: left;
  23                 overflow: hidden;
  24             }
  25         </style>
  26         <script type="text/javascript">
  27             if (window.testRunner)
  28                 testRunner.dumpAsText();
  29
  30             function doTest() {
  31                 var header = document.getElementsByTagName('header')[0];
  32                 header.classList.toggle('hidden');
  33                 if (window.testRunner && window.internals)
  34                     document.getElementById('layertree').innerText = window.internals.layerTreeAsText(document);
  35             }
  36             window.addEventListener('load', doTest, false);
  37         </script>
  38     </head>
  39
  40 <body>
  41     <header>
  42         <nav>
  43             <ul>
  44                 <li>Some text here</li>
  45             </ul>
  46         </nav>
  47     </header>
  48     <pre id="layertree"></pre>
  49 </body>
  50 </html>