commit 81332a755566ed7742c5c1d4cfc5f0c65d5139f3 parent e3d7c1afbd50aafcff3e395b7a7e20d320beff6e Author: Ziran Sun <zsun@igalia.com> Date: Fri, 3 Oct 2025 08:59:36 +0000 Bug 1990894 [wpt PR 55071] - CSS caret-shape: Update and add overflow tests., a=testonly Automatic update from web-platform-tests CSS caret-shape: Update and add overflow tests. * Update expectation reference file for existing wpt tests with block caret shape. As discussed in [1], because the spec deliberately gives implementations flexibility to do things differently, we decided to use negative ref-tests for overflow test expectation. The point is that the caret should be visible somehow. * When overflow is hidden or clip, and some spaces are available to show part of the block shape, we should fill the available space with part f the block shape and hide the rest of the block. The starting position of the caret is implementation and platform dependent though. Hence, rather than introducing tests for this case to WPT, we added them as Chromium specific tests. [1] https://github.com/w3c/csswg-drafts/issues/10289 Bug: 353713061 Change-Id: I0d97d849ad00adce4a520cf8fb90f68f1a7f7bc4 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6971531 Reviewed-by: Stephen Chenney <schenney@chromium.org> Commit-Queue: Ziran Sun <zsun@igalia.com> Cr-Commit-Position: refs/heads/main@{#1521130} -- wpt-commits: 7029cfddda49a0b7929625070a9c5ccd335e4241 wpt-pr: 55071 Diffstat:
4 files changed, 8 insertions(+), 6 deletions(-)
diff --git a/testing/web-platform/tests/css/css-ui/caret-eol-001.html b/testing/web-platform/tests/css/css-ui/caret-eol-001.html @@ -4,7 +4,7 @@ <title>CSS Basic User Interface Test: end-of-line carets should be visible</title> <link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net"> <link rel="help" href="http://www.w3.org/TR/css4-ui/#caret-shape"> -<link rel=match href=reference/caret-eol-001.html> +<link rel="mismatch" href=reference/caret-eol-001.html> <meta name="assert" content="Checks that carets positioned at the end of the line are shown even if they overflow."> <style> div { diff --git a/testing/web-platform/tests/css/css-ui/caret-eol-002.html b/testing/web-platform/tests/css/css-ui/caret-eol-002.html @@ -4,7 +4,7 @@ <title>CSS Basic User Interface Test: end-of-line carets should be visible</title> <link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net"> <link rel="help" href="http://www.w3.org/TR/css4-ui/#caret-shape"> -<link rel=match href=reference/caret-eol-001.html> +<link rel="mismatch" href=reference/caret-eol-001.html> <meta name="assert" content="Checks that carets positioned at the end of the line are shown even if they overflow, even if the box has hidden overflow."> <style> div { diff --git a/testing/web-platform/tests/css/css-ui/caret-eol-003.html b/testing/web-platform/tests/css/css-ui/caret-eol-003.html @@ -1,10 +1,10 @@ -<!DOCTYPE html> +<!DOCTYPE html> <html lang=en> <meta charset="utf-8"> <title>CSS Basic User Interface Test: end-of-line carets should be visible</title> <link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net"> <link rel="help" href="http://www.w3.org/TR/css4-ui/#caret-shape"> -<link rel=match href=reference/caret-eol-001.html> +<link rel="mismatch" href=reference/caret-eol-001.html> <meta name="assert" content="Checks that carets positioned at the end of the line are shown even if they overflow, even if the box has overflow: clip."> <style> div { @@ -28,4 +28,4 @@ div { const t = document.querySelector("#test"); window.getSelection().selectAllChildren(t); window.getSelection().collapseToEnd(); -</script> +</script> +\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-ui/reference/caret-eol-001.html b/testing/web-platform/tests/css/css-ui/reference/caret-eol-001.html @@ -7,6 +7,7 @@ div { font-size: 40px; font-family: monospace; + width: 5ch; caret-color: orange; caret-shape: block; caret-animation: manual; @@ -17,7 +18,7 @@ div { <p>Test passes if you see a orange text insertion caret at the end of the line below. -<div id=test contenteditable spellcheck="false">abcde</div> +<div id=test spellcheck="false">abcde</div> <script> const t = document.querySelector("#test");