third_party/WebKit/ManualTests/pre-tab-selection-rect.html

   1 <html>
   2 <head>
   3 <title>Highlighting preformatted text after tab</title>
   4 <style type="text/css">
   5 #t4 { font-size: 36px; }
   6 #t4:first-line { font-size:16px; }
   7 </style>
   8 <script type="text/javascript">
   9 function test1()
  10 {
  11     var t = document.getElementById('t1').childNodes[1];
  12     window.getSelection().setBaseAndExtent(t, 1, t, 13);
  13 }
  14
  15 function test2()
  16 {
  17     var t = document.getElementById('t2').childNodes[0];
  18     window.getSelection().setBaseAndExtent(t, 5, t, 23);
  19 }
  20
  21 function test3()
  22 {
  23     var t = document.getElementById('t3').childNodes[0];
  24     window.getSelection().setBaseAndExtent(t, 5, t, 23);
  25 }
  26
  27 function test4()
  28 {
  29     var t = document.getElementById('t4').childNodes[0];
  30     window.getSelection().setBaseAndExtent(t, 11, t, 29);
  31 }
  32 </script>
  33 </head>
  34 <body>
  35 <p>
  36 This is a test for <i>http://bugs.webkit.org/show_bug.cgi?id=6043
  37 Incorrect selection highlighting in pre-formatted text with tabs</i>.
  38 </p>
  39 <hr>
  40 <p>
  41 Instructions:
  42 </p>
  43 <p>
  44 1. Click <a href="#" onclick="window.setTimeout(test1,1);">test 1</a>.
  45 The entire word &ldquo;highlighting&rdquo; below should be highlighted.
  46 </p>
  47 <pre id="t1"><span>Buggy</span> highlighting</pre>
  48 <p>
  49 2. Click <a href="#" onclick="window.setTimeout(test2,1);">test 2</a>.
  50 The words &ldquo;buggy highlighting&rdquo; below should be fully highlighted.
  51 </p>
  52 <pre id="t2" style="padding-left: 10px;">Very buggy     highlighting</pre>
  53 <p>
  54 3. Click <a href="#" onclick="window.setTimeout(test3,1);">test 3</a>.
  55 The words &ldquo;buggy highlighting&rdquo; below should be fully highlighted.
  56 </p>
  57 <pre id="t3" style="margin-left: 10px;">Very buggy      highlighting</pre>
  58 <p>
  59 4. Click <a href="#" onclick="window.setTimeout(test4,1);">test 4</a>.
  60 The words &ldquo;buggy highlighting&rdquo; below should be fully highlighted.
  61 </p>
  62 <p id="t4">
  63 Even more buggy highlighting.
  64 </p>
  65 </body>
  66 </html>