LibWeb/CSS: Implement the caret-color property

This commit is contained in:
Tim Ledbetter 2025-03-09 13:59:33 +00:00 committed by Alexander Kalenik
commit 88d35c547c
Notes: github-actions[bot] 2025-03-09 18:37:22 +00:00
16 changed files with 381 additions and 218 deletions

View file

@ -1,6 +1,6 @@
All supported properties and their default values exposed from CSSStyleDeclaration from getComputedStyle:
'cssText': ''
'length': '219'
'length': '220'
'parentRule': 'null'
'cssFloat': 'none'
'WebkitAlignContent': 'normal'
@ -245,6 +245,8 @@ All supported properties and their default values exposed from CSSStyleDeclarati
'box-sizing': 'content-box'
'captionSide': 'top'
'caption-side': 'top'
'caretColor': 'rgb(0, 0, 0)'
'caret-color': 'rgb(0, 0, 0)'
'clear': 'none'
'clip': 'auto'
'clipPath': 'none'

View file

@ -5,220 +5,221 @@ All properties associated with getComputedStyle(document.body):
"2": "border-collapse",
"3": "border-spacing",
"4": "caption-side",
"5": "clip-rule",
"6": "color",
"7": "color-scheme",
"8": "cursor",
"9": "direction",
"10": "fill",
"11": "fill-opacity",
"12": "fill-rule",
"13": "font-family",
"14": "font-feature-settings",
"15": "font-language-override",
"16": "font-size",
"17": "font-style",
"18": "font-variant-alternates",
"19": "font-variant-caps",
"20": "font-variant-east-asian",
"21": "font-variant-emoji",
"22": "font-variant-ligatures",
"23": "font-variant-numeric",
"24": "font-variant-position",
"25": "font-variation-settings",
"26": "font-weight",
"27": "font-width",
"28": "image-rendering",
"29": "letter-spacing",
"30": "line-height",
"31": "list-style-image",
"32": "list-style-position",
"33": "list-style-type",
"34": "math-depth",
"35": "math-shift",
"36": "math-style",
"37": "pointer-events",
"38": "quotes",
"39": "stroke",
"40": "stroke-dasharray",
"41": "stroke-dashoffset",
"42": "stroke-linecap",
"43": "stroke-linejoin",
"44": "stroke-miterlimit",
"45": "stroke-opacity",
"46": "stroke-width",
"47": "tab-size",
"48": "text-align",
"49": "text-anchor",
"50": "text-decoration-line",
"51": "text-indent",
"52": "text-justify",
"53": "text-shadow",
"54": "text-transform",
"55": "visibility",
"56": "white-space",
"57": "word-break",
"58": "word-spacing",
"59": "word-wrap",
"60": "writing-mode",
"61": "align-content",
"62": "align-items",
"63": "align-self",
"64": "animation-delay",
"65": "animation-direction",
"66": "animation-duration",
"67": "animation-fill-mode",
"68": "animation-iteration-count",
"69": "animation-name",
"70": "animation-play-state",
"71": "animation-timing-function",
"72": "appearance",
"73": "aspect-ratio",
"74": "backdrop-filter",
"75": "background-attachment",
"76": "background-clip",
"77": "background-color",
"78": "background-image",
"79": "background-origin",
"80": "background-position-x",
"81": "background-position-y",
"82": "background-repeat",
"83": "background-size",
"84": "block-size",
"85": "border-bottom-color",
"86": "border-bottom-left-radius",
"87": "border-bottom-right-radius",
"88": "border-bottom-style",
"89": "border-bottom-width",
"90": "border-left-color",
"91": "border-left-style",
"92": "border-left-width",
"93": "border-right-color",
"94": "border-right-style",
"95": "border-right-width",
"96": "border-top-color",
"97": "border-top-left-radius",
"98": "border-top-right-radius",
"99": "border-top-style",
"100": "border-top-width",
"101": "bottom",
"102": "box-shadow",
"103": "box-sizing",
"104": "clear",
"105": "clip",
"106": "clip-path",
"107": "column-count",
"108": "column-gap",
"109": "column-span",
"110": "column-width",
"111": "contain",
"112": "content",
"113": "content-visibility",
"114": "counter-increment",
"115": "counter-reset",
"116": "counter-set",
"117": "cx",
"118": "cy",
"119": "display",
"120": "filter",
"121": "flex-basis",
"122": "flex-direction",
"123": "flex-grow",
"124": "flex-shrink",
"125": "flex-wrap",
"126": "float",
"127": "grid-auto-columns",
"128": "grid-auto-flow",
"129": "grid-auto-rows",
"130": "grid-column-end",
"131": "grid-column-start",
"132": "grid-row-end",
"133": "grid-row-start",
"134": "grid-template-areas",
"135": "grid-template-columns",
"136": "grid-template-rows",
"137": "height",
"138": "inline-size",
"139": "inset-block-end",
"140": "inset-block-start",
"141": "inset-inline-end",
"142": "inset-inline-start",
"143": "isolation",
"144": "justify-content",
"145": "justify-items",
"146": "justify-self",
"147": "left",
"148": "margin-block-end",
"149": "margin-block-start",
"150": "margin-bottom",
"151": "margin-inline-end",
"152": "margin-inline-start",
"153": "margin-left",
"154": "margin-right",
"155": "margin-top",
"156": "mask-image",
"157": "mask-type",
"158": "max-block-size",
"159": "max-height",
"160": "max-inline-size",
"161": "max-width",
"162": "min-block-size",
"163": "min-height",
"164": "min-inline-size",
"165": "min-width",
"166": "mix-blend-mode",
"167": "object-fit",
"168": "object-position",
"169": "opacity",
"170": "order",
"171": "outline-color",
"172": "outline-offset",
"173": "outline-style",
"174": "outline-width",
"175": "overflow-x",
"176": "overflow-y",
"177": "padding-block-end",
"178": "padding-block-start",
"179": "padding-bottom",
"180": "padding-inline-end",
"181": "padding-inline-start",
"182": "padding-left",
"183": "padding-right",
"184": "padding-top",
"185": "position",
"186": "r",
"187": "right",
"188": "rotate",
"189": "row-gap",
"190": "rx",
"191": "ry",
"192": "scale",
"193": "scrollbar-gutter",
"194": "scrollbar-width",
"195": "stop-color",
"196": "stop-opacity",
"197": "table-layout",
"198": "text-decoration-color",
"199": "text-decoration-style",
"200": "text-decoration-thickness",
"201": "text-overflow",
"202": "top",
"203": "transform",
"204": "transform-box",
"205": "transform-origin",
"206": "transition-delay",
"207": "transition-duration",
"208": "transition-property",
"209": "transition-timing-function",
"210": "translate",
"211": "unicode-bidi",
"212": "user-select",
"213": "vertical-align",
"214": "view-transition-name",
"215": "width",
"216": "x",
"217": "y",
"218": "z-index"
"5": "caret-color",
"6": "clip-rule",
"7": "color",
"8": "color-scheme",
"9": "cursor",
"10": "direction",
"11": "fill",
"12": "fill-opacity",
"13": "fill-rule",
"14": "font-family",
"15": "font-feature-settings",
"16": "font-language-override",
"17": "font-size",
"18": "font-style",
"19": "font-variant-alternates",
"20": "font-variant-caps",
"21": "font-variant-east-asian",
"22": "font-variant-emoji",
"23": "font-variant-ligatures",
"24": "font-variant-numeric",
"25": "font-variant-position",
"26": "font-variation-settings",
"27": "font-weight",
"28": "font-width",
"29": "image-rendering",
"30": "letter-spacing",
"31": "line-height",
"32": "list-style-image",
"33": "list-style-position",
"34": "list-style-type",
"35": "math-depth",
"36": "math-shift",
"37": "math-style",
"38": "pointer-events",
"39": "quotes",
"40": "stroke",
"41": "stroke-dasharray",
"42": "stroke-dashoffset",
"43": "stroke-linecap",
"44": "stroke-linejoin",
"45": "stroke-miterlimit",
"46": "stroke-opacity",
"47": "stroke-width",
"48": "tab-size",
"49": "text-align",
"50": "text-anchor",
"51": "text-decoration-line",
"52": "text-indent",
"53": "text-justify",
"54": "text-shadow",
"55": "text-transform",
"56": "visibility",
"57": "white-space",
"58": "word-break",
"59": "word-spacing",
"60": "word-wrap",
"61": "writing-mode",
"62": "align-content",
"63": "align-items",
"64": "align-self",
"65": "animation-delay",
"66": "animation-direction",
"67": "animation-duration",
"68": "animation-fill-mode",
"69": "animation-iteration-count",
"70": "animation-name",
"71": "animation-play-state",
"72": "animation-timing-function",
"73": "appearance",
"74": "aspect-ratio",
"75": "backdrop-filter",
"76": "background-attachment",
"77": "background-clip",
"78": "background-color",
"79": "background-image",
"80": "background-origin",
"81": "background-position-x",
"82": "background-position-y",
"83": "background-repeat",
"84": "background-size",
"85": "block-size",
"86": "border-bottom-color",
"87": "border-bottom-left-radius",
"88": "border-bottom-right-radius",
"89": "border-bottom-style",
"90": "border-bottom-width",
"91": "border-left-color",
"92": "border-left-style",
"93": "border-left-width",
"94": "border-right-color",
"95": "border-right-style",
"96": "border-right-width",
"97": "border-top-color",
"98": "border-top-left-radius",
"99": "border-top-right-radius",
"100": "border-top-style",
"101": "border-top-width",
"102": "bottom",
"103": "box-shadow",
"104": "box-sizing",
"105": "clear",
"106": "clip",
"107": "clip-path",
"108": "column-count",
"109": "column-gap",
"110": "column-span",
"111": "column-width",
"112": "contain",
"113": "content",
"114": "content-visibility",
"115": "counter-increment",
"116": "counter-reset",
"117": "counter-set",
"118": "cx",
"119": "cy",
"120": "display",
"121": "filter",
"122": "flex-basis",
"123": "flex-direction",
"124": "flex-grow",
"125": "flex-shrink",
"126": "flex-wrap",
"127": "float",
"128": "grid-auto-columns",
"129": "grid-auto-flow",
"130": "grid-auto-rows",
"131": "grid-column-end",
"132": "grid-column-start",
"133": "grid-row-end",
"134": "grid-row-start",
"135": "grid-template-areas",
"136": "grid-template-columns",
"137": "grid-template-rows",
"138": "height",
"139": "inline-size",
"140": "inset-block-end",
"141": "inset-block-start",
"142": "inset-inline-end",
"143": "inset-inline-start",
"144": "isolation",
"145": "justify-content",
"146": "justify-items",
"147": "justify-self",
"148": "left",
"149": "margin-block-end",
"150": "margin-block-start",
"151": "margin-bottom",
"152": "margin-inline-end",
"153": "margin-inline-start",
"154": "margin-left",
"155": "margin-right",
"156": "margin-top",
"157": "mask-image",
"158": "mask-type",
"159": "max-block-size",
"160": "max-height",
"161": "max-inline-size",
"162": "max-width",
"163": "min-block-size",
"164": "min-height",
"165": "min-inline-size",
"166": "min-width",
"167": "mix-blend-mode",
"168": "object-fit",
"169": "object-position",
"170": "opacity",
"171": "order",
"172": "outline-color",
"173": "outline-offset",
"174": "outline-style",
"175": "outline-width",
"176": "overflow-x",
"177": "overflow-y",
"178": "padding-block-end",
"179": "padding-block-start",
"180": "padding-bottom",
"181": "padding-inline-end",
"182": "padding-inline-start",
"183": "padding-left",
"184": "padding-right",
"185": "padding-top",
"186": "position",
"187": "r",
"188": "right",
"189": "rotate",
"190": "row-gap",
"191": "rx",
"192": "ry",
"193": "scale",
"194": "scrollbar-gutter",
"195": "scrollbar-width",
"196": "stop-color",
"197": "stop-opacity",
"198": "table-layout",
"199": "text-decoration-color",
"200": "text-decoration-style",
"201": "text-decoration-thickness",
"202": "text-overflow",
"203": "top",
"204": "transform",
"205": "transform-box",
"206": "transform-origin",
"207": "transition-delay",
"208": "transition-duration",
"209": "transition-property",
"210": "transition-timing-function",
"211": "translate",
"212": "unicode-bidi",
"213": "user-select",
"214": "vertical-align",
"215": "view-transition-name",
"216": "width",
"217": "x",
"218": "y",
"219": "z-index"
}
All properties associated with document.body.style by default:
{}

View file

@ -3,6 +3,7 @@ accent-color: auto
border-collapse: separate
border-spacing: 0px
caption-side: top
caret-color: rgb(0, 0, 0)
clip-rule: nonzero
color: rgb(0, 0, 0)
color-scheme: normal
@ -135,7 +136,7 @@ grid-row-start: auto
grid-template-areas: none
grid-template-columns: auto
grid-template-rows: auto
height: 1918px
height: 1932px
inline-size: auto
inset-block-end: auto
inset-block-start: auto

View file

@ -0,0 +1,16 @@
Harness status: OK
Found 11 tests
11 Pass
Pass Test default caret-color
Pass Test caret-color: initial
Pass Test caret-color: inherit
Pass Test caret-color: auto
Pass Test caret-color: currentcolor
Pass Test caret-color: lime
Pass Reset caret-color: initial
Pass Test caret-color: rgb(0, 100, 100)
Pass Test caret-color: initial (inherited)
Pass Test caret-color: inherit (inherited)
Pass Test caret-color: blue (inherited)

View file

@ -0,0 +1,9 @@
Harness status: OK
Found 4 tests
4 Pass
Pass e.style['caret-color'] = "none" should not set the property value
Pass e.style['caret-color'] = "invert" should not set the property value
Pass e.style['caret-color'] = "50%" should not set the property value
Pass e.style['caret-color'] = "red green" should not set the property value

View file

@ -0,0 +1,7 @@
Harness status: OK
Found 2 tests
2 Pass
Pass e.style['caret-color'] = "auto" should set the property value
Pass e.style['caret-color'] = "rgba(10, 20, 30, 0.4)" should set the property value