third_party/WebKit/LayoutTests/scrollbars/scrollbar-visibility-hidden.html

   1 <!DOCTYPE html>
   2 <html>
   3 <body>
   4 <p>Test that the scrollbars of a visibility:hidden overflow:auto DIV do not participate in hit testing - <a href="http://crbug.com/313908">http://crbug.com/313908</a></p>
   5
   6 <div id="result">FAIL: script didn't run to completion.</div>
   7
   8 <div id="div1" style="position: absolute; top: 100px; width: 100px; height: 340px; background-color: Pink; overflow: auto;">
   9 <div id="div1Content" style="width: 100%; height: 500px;">
  10     Div 1
  11 </div>
  12 </div>
  13 <div id="div2" style="position: absolute; top: 120px; width: 100px; height: 300px; background-color: Gold; overflow: auto; z-index: 1;">
  14 <div id="div2Content" style="width: 200%; height: 500px;">
  15     Div 2
  16 </div>
  17 </div>
  18
  19 <script>
  20
  21     if (window.testRunner)
  22         testRunner.dumpAsText();
  23
  24     var div1 = document.getElementById("div1");
  25     var div2 = document.getElementById("div2");
  26
  27     // First sanity check points that should be within div2's vertical and horizontal scrollbars
  28     // when it's visible.
  29     // Subtract 5px from the right (bottom) edge to get a point within the vertical (horizontal) scrollbar.
  30     var verticalPoint = [div2.offsetLeft + div2.offsetWidth - 5, div2.offsetTop + Math.floor(div2.offsetHeight / 2)];
  31     var horizontalPoint = [div2.offsetLeft + Math.floor(div2.offsetWidth / 2), div2.offsetTop + div2.offsetHeight - 5];
  32     var elem = document.elementFromPoint(verticalPoint[0], verticalPoint[1]);
  33     var elem2 = document.elementFromPoint(horizontalPoint[0], horizontalPoint[1]);
  34     if (elem.id != div2.id || elem2.id != div2.id) {
  35         document.getElementById("result").firstChild.data = "FAILURE: The element at points (" + verticalPoint + ") and (" + horizontalPoint + ") needs to be div2. You may need to turn on overflow scrollbars temporarily. (On Mac: Change the 'Show scroll bars' setting to 'Always'.)";
  36     } else {
  37         // Hide div2 by applying visibility:hidden and re-check.
  38         div2.style.visibility = "hidden";
  39
  40         elem = document.elementFromPoint(verticalPoint[0], verticalPoint[1]);
  41         elem2 = document.elementFromPoint(horizontalPoint[0], horizontalPoint[1]);
  42
  43         if (elem.id != div1.id) {
  44             document.getElementById("result").firstChild.data = "FAILURE: The element at point (" + verticalPoint + ") should be div1.";
  45         } else if (elem2.id != div1.firstElementChild.id) {
  46             document.getElementById("result").firstChild.data = "FAILURE: The element at point (" + horizontalPoint + ") should be div1Content.";
  47         } else {
  48             document.getElementById("result").firstChild.data = "SUCCESS";
  49         }
  50     }
  51
  52 </script>
  53 </body>
  54 </html>