layout/reftests/invalidation/partially-scrolled-svg-group.html

   1 <!DOCTYPE html>
   2 <html lang="en" class="reftest-wait"
   3       reftest-displayport-x="0"
   4       reftest-displayport-y="0"
   5       reftest-displayport-w="800"
   6       reftest-displayport-h="1000">
   7 <meta charset="utf-8">
   8 <body>
   9     <div>
  10         <h4 style="height: 600px">All the lines at the bottom should show up when this is scrolled down.</h4>
  11         <div id="ember801" class="graph-data ember-view">
  12             <div style="position: relative;">
  13                 <div style="position: relative; width: 920px; height: 500px;" dir="ltr">
  14                     <div style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;" aria-label="A chart.">
  15                         <svg width="920" height="500" style="" aria-label="A chart.">
  16                             <defs id="defs">
  17                             <clipPath id="_ABSTRACT_RENDERER_ID_2">
  18                                 <rect x="85" y="50" width="708" height="400"></rect>
  19                             </clipPath></defs>
  20                             <rect x="0" y="0" width="920" height="500" stroke="none" stroke-width="0" fill="#ffffff"></rect>
  21                             <g></g>
  22                             <g>
  23                                 <rect x="85" y="50" width="708" height="400" stroke="none" stroke-width="0" fill-opacity="0" fill="#ffffff"></rect>
  24                                 <g clip-path="url(#_ABSTRACT_RENDERER_ID_2)">
  25                                     <g>
  26                                         <rect y="50" width="1" height="400" stroke="none" stroke-width="0" fill="#cccccc"></rect>
  27                                         <rect x="399" y="50" width="1" height="400" stroke="none" stroke-width="0" fill="#cccccc"></rect>
  28                                         <rect x="85" y="449" width="708" height="1" stroke="none" stroke-width="0" fill="#cccccc"></rect>
  29                                         <rect x="85" y="349" width="708" height="1" stroke="none" stroke-width="0" fill="#cccccc"></rect>
  30                                         <rect x="85" y="250" width="708" height="1" stroke="none" stroke-width="0" fill="#cccccc"></rect>
  31                                         <rect x="85" y="150" width="708" height="1" stroke="none" stroke-width="0" fill="#cccccc"></rect>
  32                                         <rect x="85" y="50" width="708" height="1" stroke="none" stroke-width="0" fill="#cccccc"></rect>
  33                                     </g>
  34                                 </g>
  35                             </g>
  36                         </svg>
  37                     </div>
  38                 </div>
  39                 <div aria-hidden="true" style="position: absolute; top: 510px; left: 930px; white-space: nowrap; font-family: Arial; font-size: 14px; display: none;">0.2.42</div>
  40                 <div></div>
  41             </div>
  42         </div>
  43     </div>
  44
  45 <script>
  46
  47 function doTest() {
  48   document.documentElement.scrollTop = 200;
  49   document.documentElement.removeAttribute("class");
  50 }
  51
  52 document.addEventListener("MozReftestInvalidate", doTest);
  53
  54 </script>
  55
  56   </body>
  57   </html>