mirror of
https://repo.dactyloidae.xyz/Dactyloidae/UXP.git
synced 2026-10-05 23:07:31 +09:00
Issue #1668 - Part 1: Implement support for caret-color property.
This CSS property allows input carets (that blinking input cursor you see in text fields), to be given a custom color. This was implemented in Firefox 53, and it was such a minor feature that no one ever missed it, but I don't see any harm in implementing this. https://bugzilla.mozilla.org/show_bug.cgi?id=1063162
This commit is contained in:
parent
e3f6690ee7
commit
33e50615d9
13 changed files with 118 additions and 11 deletions
|
|
@ -2836,6 +2836,18 @@ var gCSSProperties = {
|
|||
other_values: [ "bottom", "left", "right", "top-outside", "bottom-outside" ],
|
||||
invalid_values: []
|
||||
},
|
||||
"caret-color": {
|
||||
domProp: "caretColor",
|
||||
inherited: true,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
prerequisites: { "color": "black" },
|
||||
// Though "auto" is an independent computed-value time keyword value,
|
||||
// it is not distinguishable from currentcolor because getComputedStyle
|
||||
// always returns used value for <color>.
|
||||
initial_values: [ "auto", "currentcolor", "black", "rgb(0,0,0)" ],
|
||||
other_values: [ "green", "transparent", "rgba(128,128,128,.5)", "#123" ],
|
||||
invalid_values: [ "#0", "#00", "#00000", "cc00ff" ]
|
||||
},
|
||||
"clear": {
|
||||
domProp: "clear",
|
||||
inherited: false,
|
||||
|
|
|
|||
|
|
@ -1373,6 +1373,21 @@ function test_true_currentcolor_transition(prop, get_color=(x => x), is_shorthan
|
|||
div.style.removeProperty("color");
|
||||
}
|
||||
|
||||
function test_auto_color_transition(prop, get_color=(x => x), is_shorthand=false) {
|
||||
const msg_prefix = `color-valued property ${prop}: `;
|
||||
const test_color = "rgb(51, 102, 153)";
|
||||
div.style.setProperty("transition-property", "none", "");
|
||||
div.style.setProperty(prop, "auto", "");
|
||||
let used_value_of_auto = get_color(cs.getPropertyValue(prop));
|
||||
isnot(used_value_of_auto, test_color,
|
||||
msg_prefix + "ensure used auto value is different than our test color");
|
||||
|
||||
div.style.setProperty("transition-property", prop, "");
|
||||
div.style.setProperty(prop, test_color, "");
|
||||
is(get_color(cs.getPropertyValue(prop)), test_color,
|
||||
msg_prefix + "not interpolatable between auto and rgb color");
|
||||
}
|
||||
|
||||
function get_color_from_shorthand_value(value) {
|
||||
var m = value.match(/rgba?\([^, ]*, [^, ]*, [^, ]*(?:, [^, ]*)?\)/);
|
||||
isnot(m, null, "shorthand property value should contain color");
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue