RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-05-31 15:48:12 +00:00
Code Issues Activity Actions

LibWeb: Support cellpadding attribute on table elements

Browse source
This commit is contained in:
implicitfield 2023-11-19 22:19:32 +04:00 • committed by Andreas Kling
parent 3d1fbcb26b
commit 00c1da8cbc
5 changed files with 75 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

38
Tests/LibWeb/Layout/expected/table/table-cellpadding.txt Normal file
View file

@ -0,0 +1,38 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x220 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x204 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 498.1875x204 [BFC] children: not-inline
Box <table> at (9,9) content-size 496.1875x202 table-box [TFC] children: not-inline
Box <tbody> at (9,9) content-size 488.1875x198 table-row-group children: not-inline
Box <tr> at (11,11) content-size 488.1875x198 table-row children: not-inline
BlockContainer <td> at (71,71) content-size 26.640625x17.46875 table-cell [BFC] children: inline
line 0 width: 26.640625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 3, rect: [71,71 26.640625x17.46875]
"top"
TextNode <#text>
BlockContainer <td> at (219.640625,101.265625) content-size 45.4375x17.46875 table-cell [BFC] children: inline
line 0 width: 45.4375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 6, rect: [219.640625,101.265625 45.4375x17.46875]
"middle"
TextNode <#text>
BlockContainer <td> at (387.078125,131.53125) content-size 56.109375x17.46875 table-cell [BFC] children: inline
line 0 width: 56.109375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 6, rect: [387.078125,131.53125 56.109375x17.46875]
"bottom"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x220]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x204]
PaintableWithLines (TableWrapper(anonymous)) [8,8 498.1875x204]
PaintableBox (Box<TABLE>) [8,8 498.1875x204]
PaintableBox (Box<TBODY>) [9,9 488.1875x198] overflow: [9,9 494.1875x200]
PaintableBox (Box<TR>) [11,11 488.1875x198] overflow: [11,11 492.1875x198]
PaintableWithLines (BlockContainer<TD>) [11,11 146.640625x198]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<TD>) [159.640625,11 165.4375x198]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<TD>) [327.078125,11 176.109375x198]
TextPaintable (TextNode<#text>)

6
Tests/LibWeb/Layout/input/table/table-cellpadding.html Normal file
View file

@ -0,0 +1,6 @@
<!doctype html><style>
table {
height: 200px;
border: 1px solid black;
}
</style><table cellpadding="60"><td valign=top>top</td><td valign=middle>middle</td><td valign=bottom>bottom</td>

9
Userland/Libraries/LibWeb/HTML/HTMLTableCellElement.cpp
View file

@ -85,7 +85,16 @@ void HTMLTableCellElement::apply_presentational_hints(CSS::StyleProperties& styl
}
});
auto const& table_element = table_containing_cell(*this);
if (auto padding = table_element.padding()) {
style.set_property(CSS::PropertyID::PaddingTop, CSS::LengthStyleValue::create(CSS::Length::make_px(padding)));
style.set_property(CSS::PropertyID::PaddingBottom, CSS::LengthStyleValue::create(CSS::Length::make_px(padding)));
style.set_property(CSS::PropertyID::PaddingLeft, CSS::LengthStyleValue::create(CSS::Length::make_px(padding)));
style.set_property(CSS::PropertyID::PaddingRight, CSS::LengthStyleValue::create(CSS::Length::make_px(padding)));
}
auto border = table_element.border();
if (!border)
return;
auto apply_border_style = [&](CSS::PropertyID style_property, CSS::PropertyID width_property, CSS::PropertyID color_property) {

19
Userland/Libraries/LibWeb/HTML/HTMLTableElement.cpp
View file

@ -16,6 +16,7 @@
#include <LibWeb/HTML/HTMLTableColElement.h>
#include <LibWeb/HTML/HTMLTableElement.h>
#include <LibWeb/HTML/HTMLTableRowElement.h>
#include <LibWeb/HTML/Numbers.h>
#include <LibWeb/HTML/Parser/HTMLParser.h>
#include <LibWeb/Namespace.h>
@ -100,6 +101,19 @@ void HTMLTableElement::apply_presentational_hints(CSS::StyleProperties& style) c
});
}
void HTMLTableElement::attribute_changed(FlyString const& name, Optional<String> const& value)
{
Base::attribute_changed(name, value);
if (name == HTML::AttributeNames::cellpadding) {
if (value.has_value())
m_padding = max(0, parse_integer(value.value()).value_or(0));
else
m_padding = 1;
return;
}
}
// https://html.spec.whatwg.org/multipage/tables.html#dom-table-caption
JS::GCPtr<HTMLTableCaptionElement> HTMLTableElement::caption()
{
@ -424,4 +438,9 @@ unsigned int HTMLTableElement::border() const
return parse_border(deprecated_attribute(HTML::AttributeNames::border));
}
unsigned int HTMLTableElement::padding() const
{
return m_padding;
}
}

3
Userland/Libraries/LibWeb/HTML/HTMLTableElement.h
View file

@ -47,6 +47,7 @@ public:
virtual Optional<ARIA::Role> default_role() const override { return ARIA::Role::table; }
unsigned border() const;
unsigned padding() const;
private:
HTMLTableElement(DOM::Document&, DOM::QualifiedName);
@ -57,9 +58,11 @@ private:
virtual void visit_edges(Cell::Visitor&) override;
virtual void apply_presentational_hints(CSS::StyleProperties&) const override;
virtual void attribute_changed(FlyString const& name, Optional<String> const& value) override;
JS::GCPtr<DOM::HTMLCollection> mutable m_rows;
JS::GCPtr<DOM::HTMLCollection> mutable m_t_bodies;
unsigned m_padding { 1 };
};
}