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 “highlighting” 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 “buggy highlighting” 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 “buggy highlighting” 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 “buggy highlighting” below should be fully highlighted. 61 </p> 62 <p id="t4"> 63 Even more buggy highlighting. 64 </p> 65 </body> 66 </html> 67