LayoutTests/fast/layers/scroll-rect-to-visible.html

   1 <html>
   2 <head>
   3     <style>
   4         div.overflow { margin: 20px; width: 150px; height: 50px; overflow: auto;}
   5         div.overflow div { width: 200px; }
   6     </style>
   7 </head>
   8 <body>
   9     <p>
  10         Test for <i><a href="http://bugs.webkit.org/show_bug.cgi?id=14875">http://bugs.webkit.org/show_bug.cgi?id=14875</a>
  11         Textarea with nowrap - left/right nav, Up/down nav both hide text</i>.
  12     </p>
  13     <p>
  14         The letter A should be fully visible in each one of the eight boxes below.
  15     </p>
  16     <div id="t1" contenteditable="true" class="overflow">
  17         <div style="text-align: right;">
  18             A
  19         </div>
  20     </div>
  21
  22     <div id="t2" contenteditable="true" class="overflow" style="border-left: 10px solid;">
  23         <div style="text-align: right;">
  24             A
  25         </div>
  26     </div>
  27
  28     <div id="t3" contenteditable="true" class="overflow" style="border-right: 10px solid;">
  29         <div style="text-align: right;">
  30             A
  31         </div>
  32     </div>
  33
  34     <div id="t4" contenteditable="true" class="overflow" style="overflow-y: scroll;">
  35         <div style="text-align: right;">
  36             A
  37         </div>
  38     </div>
  39
  40     <div id="t5" contenteditable="true" class="overflow">
  41         <div>
  42             A
  43         </div>
  44     </div>
  45
  46     <div id="t6" contenteditable="true" class="overflow" style="border-left: 10px solid;">
  47         <div>
  48             A
  49         </div>
  50     </div>
  51
  52     <div id="t7" contenteditable="true" class="overflow" style="border-right: 10px solid;">
  53         <div>
  54             A
  55         </div>
  56     </div>
  57
  58     <div id="t8" contenteditable="true" class="overflow" style="overflow-y: scroll;">
  59         <div>
  60             A
  61         </div>
  62     </div>
  63
  64     <script>
  65         function focusDiv(id)
  66         {
  67             var div = document.getElementById(id);
  68             div.focus();
  69             div.blur();
  70         }
  71
  72         function scrollAndFocusDiv(id)
  73         {
  74             var div = document.getElementById(id);
  75             div.scrollLeft = 400;
  76             div.focus();
  77             div.blur();
  78         }
  79
  80         focusDiv("t1");
  81         focusDiv("t2");
  82         focusDiv("t3");
  83         focusDiv("t4");
  84         scrollAndFocusDiv("t5");
  85         scrollAndFocusDiv("t6");
  86         scrollAndFocusDiv("t7");
  87         scrollAndFocusDiv("t8");
  88     </script>
  89 </body>
  90 </html>