pre-tab-selection-rect.html 1.8 KB

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