LibWeb: Apply HTMLTableElement bordercolor presentational hint

This commit is contained in:
Tim Ledbetter 2025-02-18 10:09:40 +00:00 committed by Sam Atkins
parent 01c659ce9b
commit 3ffc7bd131
Notes: github-actions[bot] 2025-02-20 17:12:59 +00:00
4 changed files with 70 additions and 0 deletions

View file

@ -33,6 +33,7 @@ namespace AttributeNames {
__ENUMERATE_HTML_ATTRIBUTE(behavior, "behavior") \
__ENUMERATE_HTML_ATTRIBUTE(bgcolor, "bgcolor") \
__ENUMERATE_HTML_ATTRIBUTE(border, "border") \
__ENUMERATE_HTML_ATTRIBUTE(bordercolor, "bordercolor") \
__ENUMERATE_HTML_ATTRIBUTE(bottommargin, "bottommargin") \
__ENUMERATE_HTML_ATTRIBUTE(cellpadding, "cellpadding") \
__ENUMERATE_HTML_ATTRIBUTE(cellspacing, "cellspacing") \

View file

@ -62,6 +62,7 @@ bool HTMLTableElement::is_presentational_hint(FlyString const& name) const
HTML::AttributeNames::background,
HTML::AttributeNames::bgcolor,
HTML::AttributeNames::border,
HTML::AttributeNames::bordercolor,
HTML::AttributeNames::cellpadding,
HTML::AttributeNames::cellspacing,
HTML::AttributeNames::height,
@ -123,6 +124,19 @@ void HTMLTableElement::apply_presentational_hints(GC::Ref<CSS::CascadedPropertie
apply_border_style(CSS::PropertyID::BorderRightStyle, CSS::PropertyID::BorderRightWidth, CSS::PropertyID::BorderRightColor);
apply_border_style(CSS::PropertyID::BorderBottomStyle, CSS::PropertyID::BorderBottomWidth, CSS::PropertyID::BorderBottomColor);
}
if (name == HTML::AttributeNames::bordercolor) {
// https://html.spec.whatwg.org/multipage/rendering.html#tables-2:attr-table-bordercolor
// When a table element has a bordercolor attribute, its value is expected to be parsed using the rules for parsing a legacy color value,
// and if that does not return failure, the user agent is expected to treat the attribute as a presentational hint setting the element's
// 'border-top-color', 'border-right-color', 'border-bottom-color', and 'border-left-color' properties to the resulting color.
if (auto parsed_color = parse_legacy_color_value(value); parsed_color.has_value()) {
auto color_value = CSS::CSSColorValue::create_from_color(parsed_color.value());
cascaded_properties->set_property_from_presentational_hint(CSS::PropertyID::BorderTopColor, color_value);
cascaded_properties->set_property_from_presentational_hint(CSS::PropertyID::BorderRightColor, color_value);
cascaded_properties->set_property_from_presentational_hint(CSS::PropertyID::BorderBottomColor, color_value);
cascaded_properties->set_property_from_presentational_hint(CSS::PropertyID::BorderLeftColor, color_value);
}
}
});
}

View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Reference case for table bordercolor attribute behaving like border-color property</title>
<link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
<style>
table { margin: 5px }
</style>
<table>
<td>I should not have a border.</td>
</table>
<table>
<td>I should not have a border.</td>
</table>
<table>
<td>I should not have a border.</td>
</table>
<table>
<td>I should not have a border.</td>
</table>
<table style="border-color: lime; border-style: solid">
<td>I should have a border.</td>
</table>
<table style="border-color: lime; border-style: solid">
<td>I should have a border.</td>
</table>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Test for table bordercolor attribute behaving like border-color property</title>
<link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://html.spec.whatwg.org/multipage/rendering.html#tables-2">
<link rel="match" href="../../../../../../expected/wpt-import/html/rendering/non-replaced-elements/tables/table-bordercolor-001-ref.html">
<meta name="assert" content="bordercolor is treated as a presentation hint, equivalent to setting the border-color property">
<style>
table { margin: 5px }
</style>
<table bordercolor="red">
<td>I should not have a border.</td>
</table>
<table style="border-color: red">
<td>I should not have a border.</td>
</table>
<table bordercolor="red" style="border-width: 10px">
<td>I should not have a border.</td>
</table>
<table style="border-color: red; border-width: 10px">
<td>I should not have a border.</td>
</table>
<table bordercolor="lime" style="border-style: solid">
<td>I should have a border.</td>
</table>
<table style="border-color: lime; border-style: solid">
<td>I should have a border.</td>
</table>