LibHTML: Add LayoutNode classes for "display: list-item" and its marker

This patch removes the hard-coded hack for "display: list-item" from
LayoutBlock and adds LayoutListItem and LayoutListItemMarker.

Elements with "display: list-item" now generate a LayoutListItem, which
may then also generate a LayoutListItemMarker if appropriate. :^)

Libraries/LibHTML/DOM/Element.cpp

@@ -2,6 +2,7 @@
 #include <LibHTML/DOM/Element.h>
 #include <LibHTML/Layout/LayoutBlock.h>
 #include <LibHTML/Layout/LayoutInline.h>
+#include <LibHTML/Layout/LayoutListItem.h>
 
 Element::Element(Document& document, const String& tag_name)
     : ParentNode(document, NodeType::ELEMENT_NODE)
@@ -78,10 +79,12 @@ RefPtr<LayoutNode> Element::create_layout_node(const StyleResolver& resolver, co
 
     if (display == "none")
         return nullptr;
-    if (display == "block" || display == "list-item")
+    if (display == "block")
         return adopt(*new LayoutBlock(this, move(style)));
     if (display == "inline")
         return adopt(*new LayoutInline(*this, move(style)));
+    if (display == "list-item")
+        return adopt(*new LayoutListItem(*this, move(style)));
 
     ASSERT_NOT_REACHED();
 }

Libraries/LibHTML/Layout/LayoutBlock.cpp

@@ -199,18 +199,6 @@ void LayoutBlock::render(RenderingContext& context)
 
     LayoutNode::render(context);
 
-    // FIXME: position this properly
-    if (style().string_or_fallback(CSS::PropertyID::Display, "block") == "list-item") {
-        Rect bullet_rect {
-            rect().x() - 8,
-            rect().y() + 4,
-            3,
-            3
-        };
-
-        context.painter().fill_rect(bullet_rect, style().color_or_fallback(CSS::PropertyID::Color, document(), Color::Black));
-    }
-
     if (children_are_inline()) {
         for (auto& line_box : m_line_boxes) {
             for (auto& fragment : line_box.fragments()) {

Libraries/LibHTML/Layout/LayoutListItem.cpp

@@ -0,0 +1,24 @@
+#include <LibHTML/Layout/LayoutListItem.h>
+#include <LibHTML/Layout/LayoutListItemMarker.h>
+
+LayoutListItem::LayoutListItem(const Element& element, NonnullRefPtr<StyleProperties> style)
+    : LayoutBlock(&element, move(style))
+{
+}
+
+LayoutListItem::~LayoutListItem()
+{
+}
+
+void LayoutListItem::layout()
+{
+    LayoutBlock::layout();
+
+    if (!m_marker) {
+        m_marker = adopt(*new LayoutListItemMarker);
+        prepend_child(*m_marker);
+    }
+
+    Rect marker_rect { rect().x() - 8, rect().y(), 4, rect().height() };
+    m_marker->set_rect(marker_rect);
+}

Libraries/LibHTML/Layout/LayoutListItem.h

@@ -0,0 +1,19 @@
+#pragma once
+
+#include <LibHTML/DOM/Element.h>
+#include <LibHTML/Layout/LayoutBlock.h>
+
+class LayoutListItemMarker;
+
+class LayoutListItem final : public LayoutBlock {
+public:
+    LayoutListItem(const Element&, NonnullRefPtr<StyleProperties>);
+    virtual ~LayoutListItem() override;
+
+    virtual void layout() override;
+
+private:
+    virtual const char* class_name() const override { return "LayoutListItem"; }
+
+    RefPtr<LayoutListItemMarker> m_marker;
+};

Libraries/LibHTML/Layout/LayoutListItemMarker.cpp

@@ -0,0 +1,18 @@
+#include <LibGUI/GPainter.h>
+#include <LibHTML/Layout/LayoutListItemMarker.h>
+
+LayoutListItemMarker::LayoutListItemMarker()
+    : LayoutNode(nullptr)
+{
+}
+
+LayoutListItemMarker::~LayoutListItemMarker()
+{
+}
+
+void LayoutListItemMarker::render(RenderingContext& context)
+{
+    Rect bullet_rect { 0, 0, 4, 4 };
+    bullet_rect.center_within(rect());
+    context.painter().fill_rect(bullet_rect, style().color_or_fallback(CSS::PropertyID::Color, document(), Color::Black));
+}

Libraries/LibHTML/Layout/LayoutListItemMarker.h

@@ -0,0 +1,14 @@
+#pragma once
+
+#include <LibHTML/Layout/LayoutNode.h>
+
+class LayoutListItemMarker final : public LayoutNode {
+public:
+    LayoutListItemMarker();
+    virtual ~LayoutListItemMarker() override;
+
+    virtual void render(RenderingContext&) override;
+
+private:
+    virtual const char* class_name() const override { return "LayoutListItemMarker"; }
+};

Libraries/LibHTML/Makefile.shared

@@ -36,6 +36,8 @@ LIBHTML_OBJS = \
     Layout/LayoutDocument.o \
     Layout/LayoutReplaced.o \
     Layout/LayoutImage.o \
+    Layout/LayoutListItem.o \
+    Layout/LayoutListItemMarker.o \
     Layout/BoxModelMetrics.o \
     Layout/LineBox.o \
     Layout/LineBoxFragment.o \