LayoutTests/fast/overflow/hit-test-overflow-controls.html

   1 <html>
   2 <head>
   3     <title></title>
   4     <style>
   5         div.outer { width: 125px; height: 125px; float: left; background: red; margin-right: 10px; }
   6         div.overflow { width: 75px; height: 75px; resize: both; background: green; }
   7         div.inner { width: 100px; height: 100px; }
   8         div#t1 { overflow: auto; }
   9         div#t2 { overflow: scroll; }
  10         div#t3 { overflow-x: hidden; overflow-y: scroll; }
  11         div#t4 { overflow-x: scroll; overflow-y: hidden; }
  12     </style>
  13     <script>
  14         function resize(id)
  15         {
  16             var element = document.getElementById(id);
  17             var x = element.offsetLeft + element.offsetWidth - 7;
  18             var y = element.offsetTop + element.offsetHeight - 7;
  19             eventSender.mouseMoveTo(x, y);
  20             eventSender.mouseDown();
  21             eventSender.mouseMoveTo(x + 50, y + 50);
  22             eventSender.mouseUp();
  23         }
  24
  25         function test()
  26         {
  27             if (!window.eventSender)
  28                 return;
  29             resize("t1");
  30             resize("t2");
  31             resize("t3");
  32             resize("t4");
  33         }
  34     </script>
  35 </head>
  36 <body onload="test()">
  37     <p>
  38         Test for <i><a href="http://bugs.webkit.org/show_bug.cgi?id=13353">http://bugs.webkit.org/show_bug.cgi?id=13353</a>
  39         REGRESSION (r20754-20766): Textarea does not resize when scrollbar is present</i>.
  40     </p>
  41     <p>
  42         To test interactively, verify that you can resize each of the boxes below. The automatic test
  43         resizes them to 125 by 125.
  44     </p>
  45     <div class="outer">
  46         <div class="overflow" id="t1">
  47             <div class="inner"></div>
  48         </div>
  49     </div>
  50
  51     <div class="outer">
  52         <div class="overflow" id="t2">
  53             <div class="inner"></div>
  54         </div>
  55     </div>
  56
  57     <div class="outer">
  58         <div class="overflow" id="t3">
  59             <div class="inner"></div>
  60         </div>
  61     </div>
  62
  63     <div class="outer">
  64         <div class="overflow" id="t4">
  65             <div class="inner"></div>
  66         </div>
  67     </div>
  68 </body>
  69 </html>