custom-highlight-painting-line-wrap-001.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /css/css-highlight-api/painting/custom-highlight-painting-line-wrap-001.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<meta charset="UTF-8">

<title>CSS Highlight API Test: no trailing whitespace painted at line wrap</title>

<link rel="help" href="https://drafts.csswg.org/css-highlight-api-1/">

<link rel="match" href="custom-highlight-painting-line-wrap-001-ref.html">

<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">

<meta name="assert" value="Highlight backgrounds must not extend over trailing whitespace at line breaks.">

<style>

  div {

    font: 16px/1 Ahem;

    width: 100px;

  ::highlight(test) {

    background-color: green;

</style>

<body>

<div id="d">one two three four five six seven eight nine ten</div>

<script>

  const text = document.getElementById("d").firstChild;

  const r = new Range();

  r.setStart(text, 0);

  r.setEnd(text, text.length);

  CSS.highlights.set("test", new Highlight(r));

</script>