From ccea69ad407c95639ae98511b64784782204a3ba Mon Sep 17 00:00:00 2001 From: implicitfield <114500360+implicitfield@users.noreply.github.com> Date: Sun, 19 Nov 2023 13:51:37 +0400 Subject: [PATCH] LibWeb: Add special handling for text-align when applied to tables This matches what other engines do, and stops table content from being misaligned. --- .../expected/table/internal-alignment.txt | 26 +++++++++++++++++++ .../input/table/internal-alignment.html | 7 +++++ Userland/Libraries/LibWeb/DOM/Element.cpp | 10 +++++++ 3 files changed, 43 insertions(+) create mode 100644 Tests/LibWeb/Layout/expected/table/internal-alignment.txt create mode 100644 Tests/LibWeb/Layout/input/table/internal-alignment.html diff --git a/Tests/LibWeb/Layout/expected/table/internal-alignment.txt b/Tests/LibWeb/Layout/expected/table/internal-alignment.txt new file mode 100644 index 0000000000..ec1c0adff4 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/table/internal-alignment.txt @@ -0,0 +1,26 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x220 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x204 children: not-inline + BlockContainer
at (8,8) content-size 784x204 children: not-inline + TableWrapper <(anonymous)> at (300,8) content-size 200x204 [BFC] children: not-inline + Box at (301,9) content-size 198x202 table-box [TFC] children: not-inline + Box at (301,9) content-size 194x198 table-row-group children: not-inline + Box at (303,11) content-size 194x198 table-row children: not-inline + BlockContainer
at (304,85.265625) content-size 192x49.46875 table-cell [BFC] children: not-inline + BlockContainer

at (304,101.265625) content-size 192x17.46875 children: inline + line 0 width: 26.25, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 4, rect: [304,101.265625 26.25x17.46875] + "left" + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x220] + PaintableWithLines (BlockContainer) [8,8 784x204] + PaintableWithLines (BlockContainer

) [8,8 784x204] + PaintableWithLines (TableWrapper(anonymous)) [300,8 200x204] + PaintableBox (Box) [300,8 200x204] + PaintableBox (Box) [301,9 194x198] overflow: [301,9 196x200] + PaintableBox (Box) [303,11 194x198] + PaintableWithLines (BlockContainer
) [303,11 194x198] + PaintableWithLines (BlockContainer

) [304,101.265625 192x17.46875] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/input/table/internal-alignment.html b/Tests/LibWeb/Layout/input/table/internal-alignment.html new file mode 100644 index 0000000000..7b74ed32cc --- /dev/null +++ b/Tests/LibWeb/Layout/input/table/internal-alignment.html @@ -0,0 +1,7 @@ +

left diff --git a/Userland/Libraries/LibWeb/DOM/Element.cpp b/Userland/Libraries/LibWeb/DOM/Element.cpp index 8e85684a3b..e77ee1be16 100644 --- a/Userland/Libraries/LibWeb/DOM/Element.cpp +++ b/Userland/Libraries/LibWeb/DOM/Element.cpp @@ -17,6 +17,7 @@ #include #include #include +#include #include #include #include @@ -45,6 +46,7 @@ #include #include #include +#include #include #include #include @@ -552,6 +554,14 @@ Element::RequiredInvalidationAfterStyleChange Element::recompute_style() // FIXME propagate errors auto new_computed_css_values = MUST(document().style_computer().compute_style(*this)); + // Tables must not inherit -libweb-* values for text-align. + // FIXME: Find the spec for this. + if (is(*this)) { + auto text_align = new_computed_css_values->text_align(); + if (text_align.has_value() && (text_align.value() == CSS::TextAlign::LibwebLeft || text_align.value() == CSS::TextAlign::LibwebCenter || text_align.value() == CSS::TextAlign::LibwebRight)) + new_computed_css_values->set_property(CSS::PropertyID::TextAlign, CSS::IdentifierStyleValue::create(CSS::ValueID::Start)); + } + RequiredInvalidationAfterStyleChange invalidation; if (m_computed_css_values) invalidation = compute_required_invalidation(*m_computed_css_values, *new_computed_css_values);