OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <style> | 2 <style> |
3 ::selection { | 3 #t1::selection { |
4 background-color: transparent; | 4 background-color: transparent; |
5 color: red | 5 color: red |
6 } | 6 } |
7 .green::selection { | 7 .green::selection { |
8 color: green | 8 color: green !important |
9 } | 9 } |
10 </style> | 10 </style> |
11 <span id="t1">This text should be green.</span> | 11 <span id="t1">This text </span><span id="t2">should be green.</span> |
12 <script> | 12 <script> |
13 if (window.testRunner) | 13 if (window.testRunner) |
14 testRunner.waitUntilDone(); | 14 testRunner.waitUntilDone(); |
15 | 15 |
16 function setSelection(textNode) { | 16 function setSelection(startNode, endNode) { |
17 window.getSelection().removeAllRanges(); | 17 window.getSelection().removeAllRanges(); |
18 var range = document.createRange(); | 18 var range = document.createRange(); |
19 range.setStart(textNode, 0); | 19 range.setStart(startNode, 0); |
20 range.setEnd(textNode, textNode.data.length); | 20 range.setEnd(endNode, endNode.data.length); |
21 window.getSelection().addRange(range); | 21 window.getSelection().addRange(range); |
22 } | 22 } |
23 | 23 |
24 setSelection(t1.firstChild); | 24 setSelection(t1.firstChild, t2.firstChild); |
25 requestAnimationFrame(() => | 25 requestAnimationFrame(() => |
26 requestAnimationFrame(() => { | 26 requestAnimationFrame(() => { |
27 t1.className = "green"; | 27 t1.className = "green"; |
| 28 t2.className = "green"; |
28 if (window.testRunner) | 29 if (window.testRunner) |
29 testRunner.notifyDone(); | 30 testRunner.notifyDone(); |
30 })); | 31 })); |
31 </script> | 32 </script> |
OLD | NEW |