LibWeb: Implement the ::marker pseudo-element

This matches the marker boxes of list-items.

6 files changed, 10 insertions, 3 deletions

diff --git a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
index 8dd64dd342..70168a0938 100644
--- a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
+++ b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
@@ -504,6 +504,8 @@ Result<Selector::SimpleSelector, Parser::ParsingResult> Parser::parse_simple_sel
                 simple_selector.pseudo_element = Selector::PseudoElement::FirstLetter;
             } else if (pseudo_name.equals_ignoring_case("first-line")) {
                 simple_selector.pseudo_element = Selector::PseudoElement::FirstLine;
+            } else if (pseudo_name.equals_ignoring_case("marker")) {
+                simple_selector.pseudo_element = Selector::PseudoElement::Marker;
             } else {
                 dbgln_if(CSS_PARSER_DEBUG, "Unrecognized pseudo-element: '::{}'", pseudo_name);
                 return ParsingResult::SyntaxError;
diff --git a/Userland/Libraries/LibWeb/CSS/Selector.cpp b/Userland/Libraries/LibWeb/CSS/Selector.cpp
index 7bae069541..7bd98df4b0 100644
--- a/Userland/Libraries/LibWeb/CSS/Selector.cpp
+++ b/Userland/Libraries/LibWeb/CSS/Selector.cpp
@@ -272,6 +272,8 @@ constexpr StringView pseudo_element_name(Selector::PseudoElement pseudo_element)
         return "first-line"sv;
     case Selector::PseudoElement::FirstLetter:
         return "first-letter"sv;
+    case Selector::PseudoElement::Marker:
+        return "marker"sv;
     case Selector::PseudoElement::None:
         break;
     }
diff --git a/Userland/Libraries/LibWeb/CSS/Selector.h b/Userland/Libraries/LibWeb/CSS/Selector.h
index 6310ad1ba6..9e03072199 100644
--- a/Userland/Libraries/LibWeb/CSS/Selector.h
+++ b/Userland/Libraries/LibWeb/CSS/Selector.h
@@ -26,6 +26,7 @@ public:
         After,
         FirstLine,
         FirstLetter,
+        Marker,
     };
 
     struct SimpleSelector {
diff --git a/Userland/Libraries/LibWeb/Dump.cpp b/Userland/Libraries/LibWeb/Dump.cpp
index 59499440af..320a02c157 100644
--- a/Userland/Libraries/LibWeb/Dump.cpp
+++ b/Userland/Libraries/LibWeb/Dump.cpp
@@ -453,6 +453,9 @@ void dump_selector(StringBuilder& builder, CSS::Selector const& selector)
                 case CSS::Selector::PseudoElement::FirstLetter:
                     pseudo_element_description = "first-letter";
                     break;
+                case CSS::Selector::PseudoElement::Marker:
+                    pseudo_element_description = "marker";
+                    break;
                 }
 
                 builder.appendff(" pseudo_element={}", pseudo_element_description);
diff --git a/Userland/Libraries/LibWeb/Layout/ListItemMarkerBox.cpp b/Userland/Libraries/LibWeb/Layout/ListItemMarkerBox.cpp
index 9525e90f4a..714cb2affa 100644
--- a/Userland/Libraries/LibWeb/Layout/ListItemMarkerBox.cpp
+++ b/Userland/Libraries/LibWeb/Layout/ListItemMarkerBox.cpp
@@ -66,8 +66,7 @@ void ListItemMarkerBox::paint(PaintContext& context, PaintPhase phase)
         return;
     }
 
-    // FIXME: It would be nicer to not have to go via the parent here to get our inherited style.
-    auto color = parent()->computed_values().color();
+    auto color = computed_values().color();
 
     int marker_width = (int)enclosing.height() / 2;
     Gfx::IntRect marker_rect { 0, 0, marker_width, marker_width };
diff --git a/Userland/Libraries/LibWeb/Layout/TreeBuilder.cpp b/Userland/Libraries/LibWeb/Layout/TreeBuilder.cpp
index 8c2be3113b..fe70eaa316 100644
--- a/Userland/Libraries/LibWeb/Layout/TreeBuilder.cpp
+++ b/Userland/Libraries/LibWeb/Layout/TreeBuilder.cpp
@@ -202,7 +202,7 @@ void TreeBuilder::create_layout_tree(DOM::Node& dom_node, TreeBuilder::Context&
 
     if (is<ListItemBox>(*layout_node)) {
         int child_index = layout_node->parent()->index_of_child<ListItemBox>(*layout_node).value();
-        auto marker_style = static_cast<DOM::Element const&>(dom_node).specified_css_values();
+        auto marker_style = style_computer.compute_style(static_cast<DOM::Element&>(dom_node), CSS::Selector::PseudoElement::Marker);
         auto list_item_marker = adopt_ref(*new ListItemMarkerBox(document, layout_node->computed_values().list_style_type(), child_index + 1, *marker_style));
         if (layout_node->first_child())
             list_item_marker->set_inline(layout_node->first_child()->is_inline());