| <!DOCTYPE html> |
| <script src="../../resources/run-after-layout-and-paint.js"></script> |
| <style> |
| div:first-letter { |
| color: red; |
| } |
| </style> |
| |
| <div id="div">None Composition Spelling TextMatch</div> |
| |
| <script> |
| function addCompositionMarker(elem, start, end) { |
| const range = document.createRange(); |
| const textNode = elem.firstChild; |
| range.setStart(textNode, start); |
| range.setEnd(textNode, end); |
| if (typeof internals !== 'undefined') |
| internals.addCompositionMarker(range, 'orange', 'thin', 'lightBlue'); |
| }; |
| |
| function addSpellingMarker(elem, start, end) { |
| const range = document.createRange(); |
| const textNode = elem.firstChild; |
| range.setStart(textNode, start); |
| range.setEnd(textNode, end); |
| if (typeof internals !== 'undefined') |
| internals.setMarker(document, range, 'spelling'); |
| }; |
| |
| function addTextMatchMarker(elem, start, end) { |
| const range = document.createRange(); |
| const textNode = elem.firstChild; |
| range.setStart(textNode, start); |
| range.setEnd(textNode, end); |
| if (typeof internals !== 'undefined') { |
| internals.addTextMatchMarker(range, 'kActive'); |
| internals.setMarkedTextMatchesAreHighlighted(document, true); |
| } |
| }; |
| |
| onload = runAfterLayoutAndPaint(function() { |
| addCompositionMarker(div, 5, 16); |
| addSpellingMarker(div, 17, 25); |
| addTextMatchMarker(div, 26, 35); |
| }, true); |
| </script> |
