diff --git a/Tests/LibWeb/Layout/expected/table/border-attribute-overridden-by-css.txt b/Tests/LibWeb/Layout/expected/table/border-attribute-overridden-by-css.txt new file mode 100644 index 00000000000..7173de0da9f --- /dev/null +++ b/Tests/LibWeb/Layout/expected/table/border-attribute-overridden-by-css.txt @@ -0,0 +1,22 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x45.46875 children: not-inline + TableWrapper <(anonymous)> at (8,8) content-size 42.265625x45.46875 [BFC] children: not-inline + Box at (18,18) content-size 22.265625x25.46875 table-box [TFC] children: not-inline + Box at (18,18) content-size 18.265625x21.46875 table-row-group children: not-inline + Box at (20,20) content-size 18.265625x21.46875 table-row children: not-inline + BlockContainer
at (22,22) content-size 14.265625x17.46875 table-cell [BFC] children: inline + line 0 width: 14.265625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 1, rect: [22,22 14.265625x17.46875] + "A" + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x600] + PaintableWithLines (BlockContainer) [8,8 784x45.46875] + PaintableWithLines (TableWrapper(anonymous)) [8,8 42.265625x45.46875] + PaintableBox (Box) [8,8 42.265625x45.46875] + PaintableBox (Box) [18,18 18.265625x21.46875] overflow: [18,18 20.265625x23.46875] + PaintableBox (Box) [20,20 18.265625x21.46875] + PaintableWithLines (BlockContainer
) [20,20 18.265625x21.46875] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/expected/table/border-attribute.txt b/Tests/LibWeb/Layout/expected/table/border-attribute.txt new file mode 100644 index 00000000000..4eb6b2371c9 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/table/border-attribute.txt @@ -0,0 +1,22 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x35.46875 children: not-inline + TableWrapper <(anonymous)> at (8,8) content-size 32.265625x35.46875 [BFC] children: not-inline + Box at (13,13) content-size 22.265625x25.46875 table-box [TFC] children: not-inline + Box at (13,13) content-size 18.265625x21.46875 table-row-group children: not-inline + Box at (15,15) content-size 18.265625x21.46875 table-row children: not-inline + BlockContainer
at (17,17) content-size 14.265625x17.46875 table-cell [BFC] children: inline + line 0 width: 14.265625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 1, rect: [17,17 14.265625x17.46875] + "A" + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x600] + PaintableWithLines (BlockContainer) [8,8 784x35.46875] + PaintableWithLines (TableWrapper(anonymous)) [8,8 32.265625x35.46875] + PaintableBox (Box) [8,8 32.265625x35.46875] + PaintableBox (Box) [13,13 18.265625x21.46875] overflow: [13,13 20.265625x23.46875] + PaintableBox (Box) [15,15 18.265625x21.46875] + PaintableWithLines (BlockContainer
) [15,15 18.265625x21.46875] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/input/table/border-attribute-overridden-by-css.html b/Tests/LibWeb/Layout/input/table/border-attribute-overridden-by-css.html new file mode 100644 index 00000000000..20241ff462d --- /dev/null +++ b/Tests/LibWeb/Layout/input/table/border-attribute-overridden-by-css.html @@ -0,0 +1,6 @@ + +
A
\ No newline at end of file diff --git a/Tests/LibWeb/Layout/input/table/border-attribute.html b/Tests/LibWeb/Layout/input/table/border-attribute.html new file mode 100644 index 00000000000..314b3e74c28 --- /dev/null +++ b/Tests/LibWeb/Layout/input/table/border-attribute.html @@ -0,0 +1 @@ +
A
\ No newline at end of file diff --git a/Tests/LibWeb/Layout/input/table/rowspan.html b/Tests/LibWeb/Layout/input/table/rowspan.html index d738088befa..069414cf367 100644 --- a/Tests/LibWeb/Layout/input/table/rowspan.html +++ b/Tests/LibWeb/Layout/input/table/rowspan.html @@ -6,7 +6,7 @@ - +
diff --git a/Userland/Libraries/LibWeb/HTML/HTMLTableCellElement.cpp b/Userland/Libraries/LibWeb/HTML/HTMLTableCellElement.cpp index 6c448c96640..15f946d1e81 100644 --- a/Userland/Libraries/LibWeb/HTML/HTMLTableCellElement.cpp +++ b/Userland/Libraries/LibWeb/HTML/HTMLTableCellElement.cpp @@ -10,8 +10,10 @@ #include #include #include +#include #include #include +#include #include namespace Web::HTML { @@ -29,6 +31,16 @@ void HTMLTableCellElement::initialize(JS::Realm& realm) set_prototype(&Bindings::ensure_web_prototype(realm, "HTMLTableCellElement")); } +static const HTML::HTMLTableElement* table_containing_cell(const DOM::Node* node) +{ + if (!is(node)) + return nullptr; + auto parent_node = node->parent(); + while (!is(parent_node)) + parent_node = parent_node->parent(); + return static_cast(parent_node); +} + void HTMLTableCellElement::apply_presentational_hints(CSS::StyleProperties& style) const { for_each_attribute([&](auto& name, auto& value) { @@ -67,6 +79,19 @@ void HTMLTableCellElement::apply_presentational_hints(CSS::StyleProperties& styl return; } }); + auto table_element = table_containing_cell(this); + auto border = table_element->border(); + if (!border) + return; + auto apply_border_style = [&](CSS::PropertyID style_property, CSS::PropertyID width_property, CSS::PropertyID color_property) { + style.set_property(style_property, CSS::IdentifierStyleValue::create(CSS::ValueID::Inset)); + style.set_property(width_property, CSS::LengthStyleValue::create(CSS::Length::make_px(1))); + style.set_property(color_property, table_element->computed_css_values()->property(color_property)); + }; + apply_border_style(CSS::PropertyID::BorderLeftStyle, CSS::PropertyID::BorderLeftWidth, CSS::PropertyID::BorderLeftColor); + apply_border_style(CSS::PropertyID::BorderTopStyle, CSS::PropertyID::BorderTopWidth, CSS::PropertyID::BorderTopColor); + apply_border_style(CSS::PropertyID::BorderRightStyle, CSS::PropertyID::BorderRightWidth, CSS::PropertyID::BorderRightColor); + apply_border_style(CSS::PropertyID::BorderBottomStyle, CSS::PropertyID::BorderBottomWidth, CSS::PropertyID::BorderBottomColor); } unsigned int HTMLTableCellElement::col_span() const diff --git a/Userland/Libraries/LibWeb/HTML/HTMLTableElement.cpp b/Userland/Libraries/LibWeb/HTML/HTMLTableElement.cpp index 2db842edb83..d2d71a30d53 100644 --- a/Userland/Libraries/LibWeb/HTML/HTMLTableElement.cpp +++ b/Userland/Libraries/LibWeb/HTML/HTMLTableElement.cpp @@ -9,6 +9,8 @@ #include #include #include +#include +#include #include #include #include @@ -39,6 +41,11 @@ void HTMLTableElement::visit_edges(Cell::Visitor& visitor) visitor.visit(m_t_bodies); } +static unsigned parse_border(DeprecatedString const& value) +{ + return value.to_uint().value_or(0); +} + void HTMLTableElement::apply_presentational_hints(CSS::StyleProperties& style) const { for_each_attribute([&](auto& name, auto& value) { @@ -64,6 +71,20 @@ void HTMLTableElement::apply_presentational_hints(CSS::StyleProperties& style) c style.set_property(CSS::PropertyID::BorderSpacing, parsed_value.release_nonnull()); return; } + if (name == HTML::AttributeNames::border) { + auto border = parse_border(value); + if (!border) + return; + auto apply_border_style = [&](CSS::PropertyID style_property, CSS::PropertyID width_property) { + auto legacy_line_style = CSS::IdentifierStyleValue::create(CSS::ValueID::Outset); + style.set_property(style_property, legacy_line_style); + style.set_property(width_property, CSS::LengthStyleValue::create(CSS::Length::make_px(border))); + }; + apply_border_style(CSS::PropertyID::BorderLeftStyle, CSS::PropertyID::BorderLeftWidth); + apply_border_style(CSS::PropertyID::BorderTopStyle, CSS::PropertyID::BorderTopWidth); + apply_border_style(CSS::PropertyID::BorderRightStyle, CSS::PropertyID::BorderRightWidth); + apply_border_style(CSS::PropertyID::BorderBottomStyle, CSS::PropertyID::BorderBottomWidth); + } }); } @@ -386,4 +407,9 @@ WebIDL::ExceptionOr HTMLTableElement::delete_row(long index) return {}; } +unsigned int HTMLTableElement::border() const +{ + return parse_border(attribute(HTML::AttributeNames::border)); +} + } diff --git a/Userland/Libraries/LibWeb/HTML/HTMLTableElement.h b/Userland/Libraries/LibWeb/HTML/HTMLTableElement.h index eae2e24cf24..e13736ea5af 100644 --- a/Userland/Libraries/LibWeb/HTML/HTMLTableElement.h +++ b/Userland/Libraries/LibWeb/HTML/HTMLTableElement.h @@ -45,6 +45,8 @@ public: // https://www.w3.org/TR/html-aria/#el-table virtual Optional default_role() const override { return ARIA::Role::table; } + unsigned border() const; + private: HTMLTableElement(DOM::Document&, DOM::QualifiedName);
Header 1 Header 2