mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-28 19:59:17 +00:00
LibWeb/CSS: Implement the caret-color
property
This commit is contained in:
parent
bf15b7ac12
commit
88d35c547c
Notes:
github-actions[bot]
2025-03-09 18:37:22 +00:00
Author: https://github.com/tcl3
Commit: 88d35c547c
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/3876
16 changed files with 381 additions and 218 deletions
|
@ -0,0 +1,50 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Basic User Interface Test: caret-color dynamic changes</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
|
||||
<link rel="help" href="https://www.w3.org/TR/css3-color/#color0">
|
||||
<meta name="flags" content="dom">
|
||||
<meta name="assert" content="Test checks checks that carret-color can be correctly changed using the style attribute, and that the computed value is done correctly.">
|
||||
<script src="../../resources/testharness.js"></script>
|
||||
<script src="../../resources/testharnessreport.js"></script>
|
||||
|
||||
<div id="log"></div>
|
||||
<div id="wrapper">
|
||||
<textarea id="textarea"></textarea>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function testStyleCaretColor(element, value) {
|
||||
assert_equals(element.style.caretColor, value, "The style attribute's caret-color should be '" + value + "'");
|
||||
}
|
||||
|
||||
function testComputedStyleCaretColor(element, value) {
|
||||
assert_equals(getComputedStyle(element).getPropertyValue("caret-color"), value, "caret-color computed style should be '" + value + "'");
|
||||
}
|
||||
|
||||
function setAndCheckCaretColor(element, caretColor, styleValue, computedStyleValue, description) {
|
||||
element.style.caretColor = caretColor;
|
||||
test(function() {
|
||||
testStyleCaretColor(element, styleValue);
|
||||
testComputedStyleCaretColor(element, computedStyleValue);
|
||||
}, description);
|
||||
}
|
||||
|
||||
var textarea = document.getElementById("textarea");
|
||||
setAndCheckCaretColor(textarea, "", "", "rgb(0, 0, 0)", "Test default caret-color");
|
||||
setAndCheckCaretColor(textarea, "initial", "initial", "rgb(0, 0, 0)", "Test caret-color: initial");
|
||||
setAndCheckCaretColor(textarea, "inherit", "inherit", "rgb(0, 0, 0)", "Test caret-color: inherit");
|
||||
setAndCheckCaretColor(textarea, "auto", "auto", "rgb(0, 0, 0)", "Test caret-color: auto");
|
||||
setAndCheckCaretColor(textarea, "currentcolor", "currentcolor", "rgb(0, 0, 0)", "Test caret-color: currentcolor");
|
||||
setAndCheckCaretColor(textarea, "lime", "lime", "rgb(0, 255, 0)", "Test caret-color: lime");
|
||||
setAndCheckCaretColor(textarea, "initial", "initial", "rgb(0, 0, 0)", "Reset caret-color: initial");
|
||||
setAndCheckCaretColor(textarea, "rgb(0, 100, 100)", "rgb(0, 100, 100)", "rgb(0, 100, 100)", "Test caret-color: rgb(0, 100, 100)");
|
||||
|
||||
var wrapper = document.getElementById("wrapper");
|
||||
wrapper.style.caretColor = "green";
|
||||
|
||||
setAndCheckCaretColor(textarea, "initial", "initial", "rgb(0, 0, 0)", "Test caret-color: initial (inherited)");
|
||||
setAndCheckCaretColor(textarea, "inherit", "inherit", "rgb(0, 128, 0)", "Test caret-color: inherit (inherited)");
|
||||
setAndCheckCaretColor(textarea, "blue", "blue", "rgb(0, 0, 255)", "Test caret-color: blue (inherited)");
|
||||
</script>
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS UI Level 3: parsing caret-color with invalid values</title>
|
||||
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-ui-3/#caret-color">
|
||||
<meta name="assert" content="caret-color supports only the grammar 'auto | <color>'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_invalid_value("caret-color", "none");
|
||||
test_invalid_value("caret-color", "invert");
|
||||
test_invalid_value("caret-color", "50%");
|
||||
test_invalid_value("caret-color", "red green");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS UI Level 3: parsing caret-color with valid values</title>
|
||||
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-ui-3/#caret-color">
|
||||
<meta name="assert" content="caret-color supports the full grammar 'auto | <color>'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_valid_value("caret-color", "auto");
|
||||
test_valid_value("caret-color", "rgba(10, 20, 30, 0.4)");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Add a link
Reference in a new issue