| <!DOCTYPE html> |
| <meta charset="UTF-8"> |
| <title>CSS Highlight API Test: Painting</title> |
| <link rel="help" href="https://drafts.csswg.org/css-highlight-api-1/"> |
| <link rel="match" href="custom-highlight-painting-001-ref.html"> |
| <meta name="assert" value="Highlighted elements must be correctly painted and there should be no caching that doesn't take highlight names into account"> |
| <style> |
| #affected::highlight(foo) { |
| background-color: yellow; |
| color: blue; |
| } |
| </style> |
| <body><span></span><span id="affected">One </span><span id="affected">two </span><span>three…</span> |
| <script> |
| // The first <span> style resolution shouldn't cause caching an empty set of matched properties that could be used with the spans that should be highlighted later. |
| const node = document.body; |
| let r = new Range(); |
| r.setStart(node, 1); |
| r.setEnd(node, 3); |
| CSS.highlights.set("foo", new Highlight(r)); |
| </script> |
