diff --git a/Libraries/LibWeb/Layout/TreeBuilder.cpp b/Libraries/LibWeb/Layout/TreeBuilder.cpp index 5a78538f36c..331efbc065f 100644 --- a/Libraries/LibWeb/Layout/TreeBuilder.cpp +++ b/Libraries/LibWeb/Layout/TreeBuilder.cpp @@ -222,7 +222,7 @@ void TreeBuilder::create_pseudo_element_if_needed(DOM::Element& element, CSS::Ps marker_style); static_cast(*pseudo_element_node).set_marker(list_item_marker); element.set_pseudo_element_node({}, CSS::PseudoElement::Marker, list_item_marker); - pseudo_element_node->append_child(*list_item_marker); + pseudo_element_node->prepend_child(*list_item_marker); } auto generated_for = CSS::to_generated_pseudo_element(pseudo_element).release_value(); @@ -702,7 +702,7 @@ void TreeBuilder::update_layout_tree_after_children(DOM::Node& dom_node, GC::Ref auto list_item_marker = document.heap().allocate(document, layout_node->computed_values().list_style_type(), layout_node->computed_values().list_style_position(), element, marker_style); static_cast(*layout_node).set_marker(list_item_marker); element.set_pseudo_element_node({}, CSS::PseudoElement::Marker, list_item_marker); - layout_node->append_child(*list_item_marker); + layout_node->prepend_child(*list_item_marker); } if (is(dom_node)) { diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/list-markers-intruded-by-float.txt b/Tests/LibWeb/Layout/expected/block-and-inline/list-markers-intruded-by-float.txt index 4fb1dfe7b26..2f349f6c697 100644 --- a/Tests/LibWeb/Layout/expected/block-and-inline/list-markers-intruded-by-float.txt +++ b/Tests/LibWeb/Layout/expected/block-and-inline/list-markers-intruded-by-float.txt @@ -6,33 +6,33 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline ListItemBox
  • at (48,16) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 1, rect: [328,16 9.34375x17] baseline: 13.296875 "a" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (304,16) content-size 12x17 children: not-inline + TextNode <#text> ListItemBox
  • at (48,33) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 1, rect: [328,33 9.34375x17] baseline: 13.296875 "a" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (304,33) content-size 12x17 children: not-inline + TextNode <#text> ListItemBox
  • at (48,50) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 1, rect: [328,50 9.34375x17] baseline: 13.296875 "a" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (304,50) content-size 12x17 children: not-inline + TextNode <#text> ListItemBox
  • at (48,67) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 1, rect: [328,67 9.34375x17] baseline: 13.296875 "a" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (304,67) content-size 12x17 children: not-inline + TextNode <#text> ListItemBox
  • at (48,84) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 1, rect: [328,84 9.34375x17] baseline: 13.296875 "a" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (304,84) content-size 12x17 children: not-inline + TextNode <#text> ListItemBox
  • at (48,101) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 1, rect: [328,101 9.34375x17] baseline: 13.296875 "a" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (304,101) content-size 12x17 children: not-inline + TextNode <#text> ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer) [0,0 800x136] @@ -40,20 +40,20 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer
    .box) [8,16 220x120] PaintableWithLines (BlockContainer
      ) [8,16 784x102] PaintableWithLines (ListItemBox
    • ) [48,16 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [304,16 12x17] + TextPaintable (TextNode<#text>) PaintableWithLines (ListItemBox
    • ) [48,33 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [304,33 12x17] + TextPaintable (TextNode<#text>) PaintableWithLines (ListItemBox
    • ) [48,50 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [304,50 12x17] + TextPaintable (TextNode<#text>) PaintableWithLines (ListItemBox
    • ) [48,67 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [304,67 12x17] + TextPaintable (TextNode<#text>) PaintableWithLines (ListItemBox
    • ) [48,84 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [304,84 12x17] - PaintableWithLines (ListItemBox
    • ) [48,101 744x17] TextPaintable (TextNode<#text>) + PaintableWithLines (ListItemBox
    • ) [48,101 744x17] MarkerPaintable (ListItemMarkerBox(anonymous)) [304,101 12x17] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/expected/details-closed.txt b/Tests/LibWeb/Layout/expected/details-closed.txt index 337b6538d5a..cc8eb1a7229 100644 --- a/Tests/LibWeb/Layout/expected/details-closed.txt +++ b/Tests/LibWeb/Layout/expected/details-closed.txt @@ -5,8 +5,8 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline ListItemBox at (32,8) content-size 760x17 children: inline frag 0 from TextNode start: 0, length: 13, rect: [32,8 114.625x17] baseline: 13.296875 "I'm a summary" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (8,8) content-size 12x17 children: not-inline + TextNode <#text> BlockContainer at (8,25) content-size 784x0 children: not-inline BlockContainer <(anonymous)> at (8,25) content-size 784x0 children: inline TextNode <#text> @@ -16,7 +16,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer) [8,8 784x17] PaintableWithLines (BlockContainer
      ) [8,8 784x17] PaintableWithLines (ListItemBox) [32,8 760x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [8,8 12x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer) [8,25 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,25 784x0] diff --git a/Tests/LibWeb/Layout/expected/details-open.txt b/Tests/LibWeb/Layout/expected/details-open.txt index 831029caec9..d38fdc676cd 100644 --- a/Tests/LibWeb/Layout/expected/details-open.txt +++ b/Tests/LibWeb/Layout/expected/details-open.txt @@ -5,8 +5,8 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline ListItemBox at (32,8) content-size 760x17 children: inline frag 0 from TextNode start: 0, length: 13, rect: [32,8 114.625x17] baseline: 13.296875 "I'm a summary" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (8,8) content-size 12x17 children: not-inline + TextNode <#text> BlockContainer at (8,25) content-size 784x17 children: inline TextNode <#text> TextNode <#text> @@ -23,8 +23,8 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer) [8,8 784x34] PaintableWithLines (BlockContainer
      ) [8,8 784x34] PaintableWithLines (ListItemBox) [32,8 760x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [8,8 12x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer) [8,25 784x17] PaintableWithLines (InlineNode) TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/expected/details-summary-default-ua-style.txt b/Tests/LibWeb/Layout/expected/details-summary-default-ua-style.txt index ec464d6a665..60c84ce5ae4 100644 --- a/Tests/LibWeb/Layout/expected/details-summary-default-ua-style.txt +++ b/Tests/LibWeb/Layout/expected/details-summary-default-ua-style.txt @@ -5,8 +5,8 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline ListItemBox at (92,68) content-size 640x17 children: inline frag 0 from TextNode start: 0, length: 5, rect: [92,68 36.84375x17] baseline: 13.296875 "hello" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (68,68) content-size 12x17 children: not-inline + TextNode <#text> BlockContainer at (68,85) content-size 664x0 children: not-inline ViewportPaintable (Viewport<#document>) [0,0 800x600] @@ -14,6 +14,6 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer) [8,8 784x137] PaintableWithLines (BlockContainer
      ) [8,8 784x137] PaintableWithLines (ListItemBox) [92,68 640x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [68,68 12x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer) [68,85 664x0] diff --git a/Tests/LibWeb/Layout/expected/list-item-marker-pseudo-placement.txt b/Tests/LibWeb/Layout/expected/list-item-marker-pseudo-placement.txt new file mode 100644 index 00000000000..63247a23a36 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/list-item-marker-pseudo-placement.txt @@ -0,0 +1,32 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x50 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x34 children: not-inline + ListItemBox at (8,8) content-size 784x34 children: not-inline + ListItemMarkerBox <(anonymous)> at (-16,8) content-size 12x17 children: not-inline + BlockContainer <(anonymous)> at (8,8) content-size 784x17 children: inline + InlineNode <(anonymous)> + frag 0 from TextNode start: 0, length: 6, rect: [8,8 52.53125x17] baseline: 13.296875 + "before" + TextNode <#text> + BlockContainer
      at (8,25) content-size 784x0 children: not-inline + BlockContainer <(anonymous)> at (8,25) content-size 784x17 children: inline + InlineNode <(anonymous)> + frag 0 from TextNode start: 0, length: 5, rect: [8,25 40.1875x17] baseline: 13.296875 + "after" + TextNode <#text> + BlockContainer <(anonymous)> at (8,42) content-size 784x0 children: inline + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x50] + PaintableWithLines (BlockContainer) [8,8 784x34] + PaintableWithLines (ListItemBox) [8,8 784x34] + MarkerPaintable (ListItemMarkerBox(anonymous)) [-16,8 12x17] + PaintableWithLines (BlockContainer(anonymous)) [8,8 784x17] + PaintableWithLines (InlineNode(anonymous)) + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer
      ) [8,25 784x0] + PaintableWithLines (BlockContainer(anonymous)) [8,25 784x17] + PaintableWithLines (InlineNode(anonymous)) + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer(anonymous)) [8,42 784x0] diff --git a/Tests/LibWeb/Layout/expected/ordered-list.txt b/Tests/LibWeb/Layout/expected/ordered-list.txt index faeaaab9f7a..965acc20542 100644 --- a/Tests/LibWeb/Layout/expected/ordered-list.txt +++ b/Tests/LibWeb/Layout/expected/ordered-list.txt @@ -7,22 +7,22 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline ListItemBox
    • at (48,16) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 7, rect: [48,16 58.78125x17] baseline: 13.296875 "Item 20" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (13.25,16) content-size 22.75x17 children: not-inline + TextNode <#text> BlockContainer <(anonymous)> at (48,33) content-size 744x0 children: inline TextNode <#text> ListItemBox
    • at (48,33) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 7, rect: [48,33 55.53125x17] baseline: 13.296875 "Item 21" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (16.5,33) content-size 19.5x17 children: not-inline + TextNode <#text> BlockContainer <(anonymous)> at (48,50) content-size 744x0 children: inline TextNode <#text> ListItemBox
    • at (48,50) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 7, rect: [48,50 58x17] baseline: 13.296875 "Item 22" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (14.03125,50) content-size 21.96875x17 children: not-inline + TextNode <#text> BlockContainer <(anonymous)> at (48,67) content-size 744x0 children: inline TextNode <#text> BlockContainer <(anonymous)> at (8,83) content-size 784x0 children: inline @@ -33,29 +33,29 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline ListItemBox
    • at (48,83) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 6, rect: [48,83 46.71875x17] baseline: 13.296875 "Item 1" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (25.3125,83) content-size 10.6875x17 children: not-inline + TextNode <#text> BlockContainer <(anonymous)> at (48,100) content-size 744x0 children: inline TextNode <#text> ListItemBox
    • at (48,100) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 6, rect: [48,100 48.828125x17] baseline: 13.296875 "Item 5" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (23.203125,100) content-size 12.796875x17 children: not-inline + TextNode <#text> BlockContainer <(anonymous)> at (48,117) content-size 744x0 children: inline TextNode <#text> ListItemBox
    • at (48,117) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 6, rect: [48,117 49.109375x17] baseline: 13.296875 "Item 6" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (22.921875,117) content-size 13.078125x17 children: not-inline + TextNode <#text> BlockContainer <(anonymous)> at (48,134) content-size 744x0 children: inline TextNode <#text> ListItemBox
    • at (48,134) content-size 744x17 children: inline frag 0 from TextNode start: 0, length: 6, rect: [48,134 49.09375x17] baseline: 13.296875 "Item 7" - TextNode <#text> ListItemMarkerBox <(anonymous)> at (22.9375,134) content-size 13.0625x17 children: not-inline + TextNode <#text> BlockContainer <(anonymous)> at (48,151) content-size 744x0 children: inline TextNode <#text> BlockContainer <(anonymous)> at (8,167) content-size 784x0 children: inline @@ -67,34 +67,34 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer
        ) [8,16 784x51] PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0] PaintableWithLines (ListItemBox
      1. ) [48,16 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [13.25,16 22.75x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer(anonymous)) [48,33 744x0] PaintableWithLines (ListItemBox
      2. ) [48,33 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [16.5,33 19.5x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer(anonymous)) [48,50 744x0] PaintableWithLines (ListItemBox
      3. ) [48,50 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [14.03125,50 21.96875x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer(anonymous)) [48,67 744x0] PaintableWithLines (BlockContainer(anonymous)) [8,83 784x0] PaintableWithLines (BlockContainer
          ) [8,83 784x68] PaintableWithLines (BlockContainer(anonymous)) [48,83 744x0] PaintableWithLines (ListItemBox
        1. ) [48,83 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [25.3125,83 10.6875x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer(anonymous)) [48,100 744x0] PaintableWithLines (ListItemBox
        2. ) [48,100 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [23.203125,100 12.796875x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer(anonymous)) [48,117 744x0] PaintableWithLines (ListItemBox
        3. ) [48,117 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [22.921875,117 13.078125x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer(anonymous)) [48,134 744x0] PaintableWithLines (ListItemBox
        4. ) [48,134 744x17] - TextPaintable (TextNode<#text>) MarkerPaintable (ListItemMarkerBox(anonymous)) [22.9375,134 13.0625x17] + TextPaintable (TextNode<#text>) PaintableWithLines (BlockContainer(anonymous)) [48,151 744x0] PaintableWithLines (BlockContainer(anonymous)) [8,167 784x0] diff --git a/Tests/LibWeb/Layout/input/list-item-marker-pseudo-placement.html b/Tests/LibWeb/Layout/input/list-item-marker-pseudo-placement.html new file mode 100644 index 00000000000..2b671175637 --- /dev/null +++ b/Tests/LibWeb/Layout/input/list-item-marker-pseudo-placement.html @@ -0,0 +1,17 @@ + + +