diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-highlight-api/painting')
2 files changed, 52 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-highlight-api/painting/custom-highlight-painting-019-ref.html b/testing/web-platform/tests/css/css-highlight-api/painting/custom-highlight-painting-019-ref.html new file mode 100644 index 0000000000..2266233684 --- /dev/null +++ b/testing/web-platform/tests/css/css-highlight-api/painting/custom-highlight-painting-019-ref.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Highlight API Reference: Non-overlapping highlight colors</title> +<style> + body { + text-decoration: 2px green underline; + } + #highlight { + color:blue; + text-decoration: 2px blue underline; + } +</style> +<body><span id="highlight">This part should be blue</span> and this part should be black diff --git a/testing/web-platform/tests/css/css-highlight-api/painting/custom-highlight-painting-019.html b/testing/web-platform/tests/css/css-highlight-api/painting/custom-highlight-painting-019.html new file mode 100644 index 0000000000..8c5ccbf020 --- /dev/null +++ b/testing/web-platform/tests/css/css-highlight-api/painting/custom-highlight-painting-019.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Highlight API Test: Non-overlapping highlight colors</title> +<link rel="author" title="Stephen Chenney" href="mailto:schenney@igalia.com"> +<link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#highlight-text"> +<link rel="match" href="custom-highlight-painting-019-ref.html"> +<meta name="assert" value="When painting non-overlapping highlights the current color should be resolved against the next layer beneath the highlight at the current location within the span."> +<meta name="fuzzy" content="0-130;0-4"> +<style> + body { + text-decoration: 2px green underline; + } + ::highlight(foo) { + color:blue; + text-decoration: 2px blue underline; + } + ::highlight(bar) { + text-decoration-line: underline; + text-decoration-thickness: 2px; + } +</style> +<body>This part should be blue and this part should be black +<script> + let textNode = document.body.firstChild; + + let r1 = new Range(); + r1.setStart(textNode, 0); + r1.setEnd(textNode, 24); + + let r2 = new Range(); + r2.setStart(textNode, 29); + r2.setEnd(textNode, 54); + + let h1 = new Highlight(r1); + let h2 = new Highlight(r2); + + CSS.highlights.set("foo", h1); + CSS.highlights.set("bar", h2); +</script>
\ No newline at end of file |