| <!DOCTYPE html> |
| <meta charset="UTF-8"> |
| <title>CSS Highlight API Test: </title> |
| <link rel="help" href="https://drafts.csswg.org/css-highlight-api-1/"> |
| <link rel="match" href="custom-highlight-painting-below-selection-ref.html"> |
| <meta name="assert" value="Highlight overlay is painted below selection overlay"> |
| <style> |
| ::highlight(foo) { |
| background: cyan; |
| color: blue; |
| } |
| ::selection { |
| background: blue; |
| color: cyan; |
| } |
| </style> |
| <body>Text should be blue over cyan here and <span id="selected">cyan over blue here</span>. |
| <script> |
| let highlightRange = new Range(); |
| highlightRange.setStart(document.body.firstChild, 0); |
| highlightRange.setEnd(document.body.lastChild, 0); |
| CSS.highlights.set("foo", new Highlight(highlightRange)); |
| getSelection().setBaseAndExtent(selected, 0, selected, 1); |
| </script> |