| <!DOCTYPE html> |
| <style> |
| #t1::selection { |
| background-color: transparent; |
| color: red |
| } |
| .green::selection { |
| color: green !important |
| } |
| </style> |
| <span id="t1">This text </span><span id="t2">should be green.</span> |
| <script> |
| if (window.testRunner) |
| testRunner.waitUntilDone(); |
| |
| function setSelection(startNode, endNode) { |
| window.getSelection().removeAllRanges(); |
| var range = document.createRange(); |
| range.setStart(startNode, 0); |
| range.setEnd(endNode, endNode.data.length); |
| window.getSelection().addRange(range); |
| } |
| |
| setSelection(t1.firstChild, t2.firstChild); |
| requestAnimationFrame(() => |
| requestAnimationFrame(() => { |
| t1.className = "green"; |
| t2.className = "green"; |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| })); |
| </script> |
