diff --git a/Libraries/LibWeb/CSS/Enums.json b/Libraries/LibWeb/CSS/Enums.json index 1c66608a01b1c..c0990295f6f5f 100644 --- a/Libraries/LibWeb/CSS/Enums.json +++ b/Libraries/LibWeb/CSS/Enums.json @@ -503,6 +503,7 @@ "end", "left", "right", + "match-parent", "-libweb-center", "-libweb-left", "-libweb-right" diff --git a/Libraries/LibWeb/CSS/Keywords.json b/Libraries/LibWeb/CSS/Keywords.json index c9b30eca83312..d4c7e77b1e224 100644 --- a/Libraries/LibWeb/CSS/Keywords.json +++ b/Libraries/LibWeb/CSS/Keywords.json @@ -226,7 +226,7 @@ "jis04", "jis78", "jis83", - "jis90", + "jis90", "jump-both", "jump-end", "jump-none", @@ -257,6 +257,7 @@ "luminance", "mark", "marktext", + "match-parent", "math", "math-auto", "max-content", @@ -278,7 +279,7 @@ "nearest", "nesw-resize", "no-close-quote", - "no-common-ligatures", + "no-common-ligatures", "no-contextual", "no-discretionary-ligatures", "no-drop", diff --git a/Libraries/LibWeb/CSS/StyleComputer.cpp b/Libraries/LibWeb/CSS/StyleComputer.cpp index 9836dc78e175a..2d5f46481412e 100644 --- a/Libraries/LibWeb/CSS/StyleComputer.cpp +++ b/Libraries/LibWeb/CSS/StyleComputer.cpp @@ -2213,6 +2213,50 @@ void StyleComputer::resolve_effective_overflow_values(ComputedProperties& style) } } +static void compute_text_align(ComputedProperties& style, DOM::Element const& element, Optional pseudo_element) +{ + // https://drafts.csswg.org/css-text-4/#valdef-text-align-match-parent + // This value behaves the same as inherit (computes to its parent’s computed value) except that an inherited + // value of start or end is interpreted against the parent’s direction value and results in a computed value of + // either left or right. Computes to start when specified on the root element. + if (style.property(PropertyID::TextAlign).to_keyword() == Keyword::MatchParent) { + + // If it's a pseudo-element, then the "parent" is the originating element instead. + auto const* parent = [&]() -> DOM::Element const* { + if (pseudo_element.has_value()) + return &element; + return element.parent_element(); + }(); + + if (parent) { + auto const& parent_text_align = parent->computed_properties()->property(PropertyID::TextAlign); + auto const& parent_direction = parent->computed_properties()->direction().value_or(Direction::Ltr); + switch (parent_text_align.to_keyword()) { + case Keyword::Start: + if (parent_direction == Direction::Ltr) { + style.set_property(PropertyID::TextAlign, CSSKeywordValue::create(Keyword::Left)); + } else { + style.set_property(PropertyID::TextAlign, CSSKeywordValue::create(Keyword::Right)); + } + break; + + case Keyword::End: + if (parent_direction == Direction::Ltr) { + style.set_property(PropertyID::TextAlign, CSSKeywordValue::create(Keyword::Right)); + } else { + style.set_property(PropertyID::TextAlign, CSSKeywordValue::create(Keyword::Left)); + } + break; + + default: + style.set_property(PropertyID::TextAlign, parent_text_align); + } + } else { + style.set_property(PropertyID::TextAlign, CSSKeywordValue::create(Keyword::Start)); + } + } +} + enum class BoxTypeTransformation { None, Blockify, @@ -2544,8 +2588,9 @@ GC::Ref StyleComputer::compute_properties(DOM::Element& elem // 6. Run automatic box type transformations transform_box_type_if_needed(computed_style, element, pseudo_element); - // 7. Resolve effective overflow values + // 7. Apply any property-specific computed value logic resolve_effective_overflow_values(computed_style); + compute_text_align(computed_style, element, pseudo_element); // 8. Let the element adjust computed style element.adjust_computed_style(computed_style); diff --git a/Libraries/LibWeb/Layout/LineBuilder.cpp b/Libraries/LibWeb/Layout/LineBuilder.cpp index 5ec7c3d6ee1a1..d5d51138d9c8b 100644 --- a/Libraries/LibWeb/Layout/LineBuilder.cpp +++ b/Libraries/LibWeb/Layout/LineBuilder.cpp @@ -204,6 +204,9 @@ void LineBuilder::update_last_line() case CSS::TextAlign::LibwebRight: inline_offset += excess_inline_space; break; + case CSS::TextAlign::MatchParent: + // This should have been replaced before this point. + VERIFY_NOT_REACHED(); case CSS::TextAlign::Left: case CSS::TextAlign::LibwebLeft: case CSS::TextAlign::Justify: diff --git a/Tests/LibWeb/Ref/expected/css/css-text/text-align-match-parent-ref.html b/Tests/LibWeb/Ref/expected/css/css-text/text-align-match-parent-ref.html new file mode 100644 index 0000000000000..385aa4a8866a9 --- /dev/null +++ b/Tests/LibWeb/Ref/expected/css/css-text/text-align-match-parent-ref.html @@ -0,0 +1,34 @@ + + + + + +
+
Left
+
Left
+
+
+
Center
+
Center
+
+
+
Right
+
Right
+
+
+
Right
+
Right
+
+
+
Center
+
Center
+
+
+
Left
+
Left
+
+ diff --git a/Tests/LibWeb/Ref/input/css/css-text/text-align-match-parent.html b/Tests/LibWeb/Ref/input/css/css-text/text-align-match-parent.html new file mode 100644 index 0000000000000..d61fb9bcd2784 --- /dev/null +++ b/Tests/LibWeb/Ref/input/css/css-text/text-align-match-parent.html @@ -0,0 +1,38 @@ + + + + + + +
+
Left
+
Left
+
+
+
Center
+
Center
+
+
+
Right
+
Right
+
+
+
Right
+
Right
+
+
+
Center
+
Center
+
+
+
Left
+
Left
+
+ diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-text/text-align/text-align-match-parent-002.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-text/text-align/text-align-match-parent-002.txt new file mode 100644 index 0000000000000..361c5258bb43f --- /dev/null +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-text/text-align/text-align-match-parent-002.txt @@ -0,0 +1,6 @@ +Harness status: OK + +Found 1 tests + +1 Pass +Pass CSS Text Test: text-align - computed value for match-parent on the root element \ No newline at end of file diff --git a/Tests/LibWeb/Text/input/wpt-import/css/css-text/text-align/text-align-match-parent-002.html b/Tests/LibWeb/Text/input/wpt-import/css/css-text/text-align/text-align-match-parent-002.html new file mode 100644 index 0000000000000..95ce42bed9280 --- /dev/null +++ b/Tests/LibWeb/Text/input/wpt-import/css/css-text/text-align/text-align-match-parent-002.html @@ -0,0 +1,23 @@ + + +CSS Text Test: text-align - computed value for match-parent on the root element + + + + + +
+