mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-08-07 08:39:22 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Improve graphical list item marker positioning

Browse source 
While 788d5368a7 took care of better text
marker positioning, this improves graphical marker positioning instead.

By looking at how Firefox and Chrome render markers, it's clear that
there are three parts to positioning a graphical marker:

  * The containing space that the marker resides in;
  * The marker dimensions;
  * The distance between the marker and the start of the list item.

The space that the marker can be contained in, is the area to the left
of the list item with a height of the marker's line-height. The marker
dimensions are relative to the marker's font's pixel size: most of them
are a square at 35% of the font size, but the disclosure markers are
sized at 50% instead. Finally, the marker distance is always gauged at
50% of the font size.

So for example, a list item with `list-style-type: disc` and `font-size:
20px`, has 10px between its start and the right side of the marker, and
the marker's dimensions are 7x7.

The percentages I've chosen closely resemble how Firefox lays out its
list item markers.
This commit is contained in:
Jelle Raaijmakers 2025-07-16 21:35:09 +02:00 • committed by Sam Atkins
commit 115e5f42af
Notes: github-actions[bot] 2025-07-17 08:36:21 +00:00
21 changed files with 187 additions and 171 deletions
Download patch file Download diff file Expand all files Collapse all files

53
Libraries/LibWeb/Layout/BlockFormattingContext.cpp
View file

@ -831,9 +831,8 @@ void BlockFormattingContext::layout_block_level_box(Box const& box, BlockContain
compute_inset(box, content_box_rect(block_container_state).size()); compute_inset(box, content_box_rect(block_container_state).size());
// Now that our children are formatted we place the ListItemBox with the left space we remembered. // Now that our children are formatted we place the ListItemBox with the left space we remembered.
if (is<ListItemBox>(box)) { if (is<ListItemBox>(box))
layout_list_item_marker(static_cast<ListItemBox const&>(box), left_space_before_children_formatted); layout_list_item_marker(static_cast<ListItemBox const&>(box), left_space_before_children_formatted);
}
bottom_of_lowest_margin_box = max(bottom_of_lowest_margin_box, box_state.offset.y() + box_state.content_height() + box_state.margin_box_bottom()); bottom_of_lowest_margin_box = max(bottom_of_lowest_margin_box, box_state.offset.y() + box_state.content_height() + box_state.margin_box_bottom());
@ -1192,24 +1191,26 @@ void BlockFormattingContext::ensure_sizes_correct_for_left_offset_calculation(Li
auto& marker = *list_item_box.marker(); auto& marker = *list_item_box.marker();
auto& marker_state = m_state.get_mutable(marker); auto& marker_state = m_state.get_mutable(marker);
CSSPixels image_width = 0; // If an image is used, the marker's dimensions are the same as the image.
CSSPixels image_height = 0;
if (auto const* list_style_image = marker.list_style_image()) { if (auto const* list_style_image = marker.list_style_image()) {
image_width = list_style_image->natural_width().value_or(0); marker_state.set_content_width(list_style_image->natural_width().value_or(0));
image_height = list_style_image->natural_height().value_or(0); marker_state.set_content_height(list_style_image->natural_height().value_or(0));
return;
} }
CSSPixels marker_size = marker.relative_size();
marker_state.set_content_height(marker_size);
// Text markers use text metrics to determine their width; other markers use square dimensions.
auto const& marker_font = marker.first_available_font();
auto marker_text = marker.text(); auto marker_text = marker.text();
if (!marker_text.has_value()) { if (marker_text.has_value()) {
auto default_marker_width = max(4, marker.first_available_font().pixel_size() - 4);
marker_state.set_content_width(image_width + default_marker_width);
} else {
// FIXME: Use per-code-point fonts to measure text. // FIXME: Use per-code-point fonts to measure text.
auto text_width = marker.first_available_font().width(marker_text.value().code_points()); auto text_width = marker_font.width(marker_text.value().code_points());
marker_state.set_content_width(image_width + CSSPixels::nearest_value_for(text_width)); marker_state.set_content_width(CSSPixels::nearest_value_for(text_width));
} else {
marker_state.set_content_width(marker_size);
} }
marker_state.set_content_height(max(image_height, CSSPixels { marker.first_available_font().pixel_size() }));
} }
void BlockFormattingContext::layout_list_item_marker(ListItemBox const& list_item_box, CSSPixels const& left_space_before_list_item_elements_formatted) void BlockFormattingContext::layout_list_item_marker(ListItemBox const& list_item_box, CSSPixels const& left_space_before_list_item_elements_formatted)
@ -1222,20 +1223,26 @@ void BlockFormattingContext::layout_list_item_marker(ListItemBox const& list_ite
auto& list_item_state = m_state.get_mutable(list_item_box); auto& list_item_state = m_state.get_mutable(list_item_box);
auto marker_text = marker.text(); auto marker_text = marker.text();
auto default_marker_width = marker_text.has_value() ? 0 : max(4, marker.first_available_font().pixel_size() - 4);
auto final_marker_width = marker_state.content_width() + default_marker_width; // Text markers fit snug against the list item; non-text position themselves at 50% of the font size.
CSSPixels marker_distance = 0;
if (!marker_text.has_value())
marker_distance = CSSPixels::nearest_value_for(.5f * marker.first_available_font().pixel_size());
auto marker_height = marker_state.content_height();
auto marker_width = marker_state.content_width();
if (marker.list_style_position() == CSS::ListStylePosition::Inside) { if (marker.list_style_position() == CSS::ListStylePosition::Inside) {
list_item_state.set_content_x(list_item_state.offset.x() + final_marker_width); list_item_state.set_content_x(list_item_state.offset.x() + marker_width + marker_distance);
list_item_state.set_content_width(list_item_state.content_width() - final_marker_width); list_item_state.set_content_width(list_item_state.content_width() - marker_width);
} }
auto offset_y = max(CSSPixels(0), (marker.computed_values().line_height() - marker_state.content_height()) / 2); auto offset_x = round(left_space_before_list_item_elements_formatted - marker_distance - marker_width);
auto offset_y = round(max(CSSPixels(0), (marker.computed_values().line_height() - marker_height) / 2));
marker_state.set_content_offset({ offset_x, offset_y });
marker_state.set_content_offset({ left_space_before_list_item_elements_formatted - final_marker_width, round(offset_y) }); if (marker_height > list_item_state.content_height())
list_item_state.set_content_height(marker_height);
if (marker_state.content_height() > list_item_state.content_height())
list_item_state.set_content_height(marker_state.content_height());
} }
BlockFormattingContext::SpaceUsedAndContainingMarginForFloats BlockFormattingContext::space_used_and_containing_margin_for_floats(CSSPixels y) const BlockFormattingContext::SpaceUsedAndContainingMarginForFloats BlockFormattingContext::space_used_and_containing_margin_for_floats(CSSPixels y) const

17
Libraries/LibWeb/Layout/ListItemMarkerBox.cpp
View file

@ -73,6 +73,23 @@ GC::Ptr<Painting::Paintable> ListItemMarkerBox::create_paintable() const
return Painting::MarkerPaintable::create(*this); return Painting::MarkerPaintable::create(*this);
} }
CSSPixels ListItemMarkerBox::relative_size() const
{
auto font_size = first_available_font().pixel_size();
auto marker_text = text();
if (marker_text.has_value())
return CSSPixels::nearest_value_for(font_size);
// Scale the marker box relative to the used font's pixel size.
switch (m_list_style_type.get<CSS::CounterStyleNameKeyword>()) {
case CSS::CounterStyleNameKeyword::DisclosureClosed:
case CSS::CounterStyleNameKeyword::DisclosureOpen:
return CSSPixels::nearest_value_for(ceilf(font_size * .5f));
default:
return CSSPixels::nearest_value_for(ceilf(font_size * .35f));
}
}
void ListItemMarkerBox::visit_edges(Cell::Visitor& visitor) void ListItemMarkerBox::visit_edges(Cell::Visitor& visitor)
{ {
Base::visit_edges(visitor); Base::visit_edges(visitor);

2
Libraries/LibWeb/Layout/ListItemMarkerBox.h
View file

@ -27,6 +27,8 @@ public:
CSS::ListStyleType const& list_style_type() const { return m_list_style_type; } CSS::ListStyleType const& list_style_type() const { return m_list_style_type; }
CSS::ListStylePosition list_style_position() const { return m_list_style_position; } CSS::ListStylePosition list_style_position() const { return m_list_style_position; }
CSSPixels relative_size() const;
private: private:
virtual void visit_edges(Cell::Visitor&) override; virtual void visit_edges(Cell::Visitor&) override;

50
Libraries/LibWeb/Painting/MarkerPaintable.cpp
View file

@ -40,55 +40,43 @@ void MarkerPaintable::paint(PaintContext& context, PaintPhase phase) const
if (phase != PaintPhase::Foreground) if (phase != PaintPhase::Foreground)
return; return;
CSSPixelRect enclosing = absolute_rect().to_rounded<CSSPixels>(); auto marker_rect = absolute_rect().to_rounded<CSSPixels>();
auto device_enclosing = context.enclosing_device_rect(enclosing); auto device_rect = context.enclosing_device_rect(marker_rect);
CSSPixels marker_width = enclosing.height() / 2;
if (auto const* list_style_image = layout_box().list_style_image()) { if (auto const* list_style_image = layout_box().list_style_image()) {
CSSPixelRect image_rect { list_style_image->resolve_for_size(layout_box(), marker_rect.size());
0, 0, list_style_image->paint(context, device_rect, computed_values().image_rendering());
list_style_image->natural_width().value_or(marker_width),
list_style_image->natural_height().value_or(marker_width)
};
image_rect.center_within(enclosing);
auto device_image_rect = context.enclosing_device_rect(image_rect);
list_style_image->resolve_for_size(layout_box(), image_rect.size());
list_style_image->paint(context, device_image_rect, computed_values().image_rendering());
return; return;
} }
CSSPixelRect marker_rect { 0, 0, marker_width, marker_width }; float left = device_rect.x().value();
marker_rect.center_within(enclosing); float right = left + device_rect.width().value();
auto device_marker_rect = context.enclosing_device_rect(marker_rect); float top = device_rect.y().value();
float bottom = top + device_rect.height().value();
float left = device_marker_rect.x().value();
float right = left + device_marker_rect.width().value();
float top = device_marker_rect.y().value();
float bottom = top + device_marker_rect.height().value();
auto color = computed_values().color(); auto color = computed_values().color();
if (auto text = layout_box().text(); text.has_value()) { if (auto text = layout_box().text(); text.has_value()) {
// FIXME: This should use proper text layout logic! // FIXME: This should use proper text layout logic!
// This does not line up with the text in the <li> element which looks very sad :( // This does not line up with the text in the <li> element which looks very sad :(
context.display_list_recorder().draw_text(device_enclosing.to_type<int>(), *text, layout_box().font(context), Gfx::TextAlignment::Center, color); context.display_list_recorder().draw_text(device_rect.to_type<int>(), *text, layout_box().font(context), Gfx::TextAlignment::Center, color);
} else if (auto const* counter_style = layout_box().list_style_type().get_pointer<CSS::CounterStyleNameKeyword>()) { } else if (auto const* counter_style = layout_box().list_style_type().get_pointer<CSS::CounterStyleNameKeyword>()) {
switch (*counter_style) { switch (*counter_style) {
case CSS::CounterStyleNameKeyword::Square: case CSS::CounterStyleNameKeyword::Square:
context.display_list_recorder().fill_rect(device_marker_rect.to_type<int>(), color); context.display_list_recorder().fill_rect(device_rect.to_type<int>(), color);
break; break;
case CSS::CounterStyleNameKeyword::Circle: case CSS::CounterStyleNameKeyword::Circle:
context.display_list_recorder().draw_ellipse(device_marker_rect.to_type<int>(), color, 1); context.display_list_recorder().draw_ellipse(device_rect.to_type<int>(), color, 1);
break; break;
case CSS::CounterStyleNameKeyword::Disc: case CSS::CounterStyleNameKeyword::Disc:
context.display_list_recorder().fill_ellipse(device_marker_rect.to_type<int>(), color); context.display_list_recorder().fill_ellipse(device_rect.to_type<int>(), color);
break; break;
case CSS::CounterStyleNameKeyword::DisclosureClosed: { case CSS::CounterStyleNameKeyword::DisclosureClosed: {
// https://drafts.csswg.org/css-counter-styles-3/#disclosure-closed // https://drafts.csswg.org/css-counter-styles-3/#disclosure-closed
// For the disclosure-open and disclosure-closed counter styles, the marker must be an image or character suitable for indicating the open and closed states of a disclosure widget, such as HTML’s details element. // For the disclosure-open and disclosure-closed counter styles, the marker must be an image or character
// FIXME: If the image is directional, it must respond to the writing mode of the element, similar to the bidi-sensitive images feature of the Images 4 module. // suitable for indicating the open and closed states of a disclosure widget, such as HTML’s details element.
// FIXME: If the image is directional, it must respond to the writing mode of the element, similar to the
// bidi-sensitive images feature of the Images 4 module.
// Draw an equilateral triangle pointing right. // Draw an equilateral triangle pointing right.
auto path = Gfx::Path(); auto path = Gfx::Path();
@ -101,8 +89,10 @@ void MarkerPaintable::paint(PaintContext& context, PaintPhase phase) const
} }
case CSS::CounterStyleNameKeyword::DisclosureOpen: { case CSS::CounterStyleNameKeyword::DisclosureOpen: {
// https://drafts.csswg.org/css-counter-styles-3/#disclosure-open // https://drafts.csswg.org/css-counter-styles-3/#disclosure-open
// For the disclosure-open and disclosure-closed counter styles, the marker must be an image or character suitable for indicating the open and closed states of a disclosure widget, such as HTML’s details element. // For the disclosure-open and disclosure-closed counter styles, the marker must be an image or character
// FIXME: If the image is directional, it must respond to the writing mode of the element, similar to the bidi-sensitive images feature of the Images 4 module. // suitable for indicating the open and closed states of a disclosure widget, such as HTML’s details element.
// FIXME: If the image is directional, it must respond to the writing mode of the element, similar to the
// bidi-sensitive images feature of the Images 4 module.
// Draw an equilateral triangle pointing down. // Draw an equilateral triangle pointing down.
auto path = Gfx::Path(); auto path = Gfx::Path();

24
Tests/LibWeb/Layout/expected/block-and-inline/list-markers-intruded-by-float.txt
View file

@ -6,32 +6,32 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,16) content-size 744x18 children: inline ListItemBox <li> at (48,16) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 1, rect: [328,16 9.34375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 1, rect: [328,16 9.34375x18] baseline: 13.796875
"a" "a"
ListItemMarkerBox <(anonymous)> at (304,17) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (314,22) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,34) content-size 744x18 children: inline ListItemBox <li> at (48,34) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 1, rect: [328,34 9.34375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 1, rect: [328,34 9.34375x18] baseline: 13.796875
"a" "a"
ListItemMarkerBox <(anonymous)> at (304,35) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (314,40) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,52) content-size 744x18 children: inline ListItemBox <li> at (48,52) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 1, rect: [328,52 9.34375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 1, rect: [328,52 9.34375x18] baseline: 13.796875
"a" "a"
ListItemMarkerBox <(anonymous)> at (304,53) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (314,58) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,70) content-size 744x18 children: inline ListItemBox <li> at (48,70) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 1, rect: [328,70 9.34375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 1, rect: [328,70 9.34375x18] baseline: 13.796875
"a" "a"
ListItemMarkerBox <(anonymous)> at (304,71) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (314,76) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,88) content-size 744x18 children: inline ListItemBox <li> at (48,88) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 1, rect: [328,88 9.34375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 1, rect: [328,88 9.34375x18] baseline: 13.796875
"a" "a"
ListItemMarkerBox <(anonymous)> at (304,89) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (314,94) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,106) content-size 744x18 children: inline ListItemBox <li> at (48,106) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 1, rect: [328,106 9.34375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 1, rect: [328,106 9.34375x18] baseline: 13.796875
"a" "a"
ListItemMarkerBox <(anonymous)> at (304,107) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (314,112) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600] ViewportPaintable (Viewport<#document>) [0,0 800x600]
@ -40,22 +40,22 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<DIV>.box) [8,16 220x120] PaintableWithLines (BlockContainer<DIV>.box) [8,16 220x120]
PaintableWithLines (BlockContainer<UL>) [8,16 784x108] PaintableWithLines (BlockContainer<UL>) [8,16 784x108]
PaintableWithLines (ListItemBox<LI>) [48,16 744x18] PaintableWithLines (ListItemBox<LI>) [48,16 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [304,17 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [314,22 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<LI>) [48,34 744x18] PaintableWithLines (ListItemBox<LI>) [48,34 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [304,35 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [314,40 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<LI>) [48,52 744x18] PaintableWithLines (ListItemBox<LI>) [48,52 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [304,53 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [314,58 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<LI>) [48,70 744x18] PaintableWithLines (ListItemBox<LI>) [48,70 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [304,71 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [314,76 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<LI>) [48,88 744x18] PaintableWithLines (ListItemBox<LI>) [48,88 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [304,89 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [314,94 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<LI>) [48,106 744x18] PaintableWithLines (ListItemBox<LI>) [48,106 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [304,107 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [314,112 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto) SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)

4
Tests/LibWeb/Layout/expected/css-pseudo-element-display-list-item.txt
View file

@ -9,7 +9,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <(anonymous)> at (24,26) content-size 768x18 children: inline ListItemBox <(anonymous)> at (24,26) content-size 768x18 children: inline
frag 0 from TextNode start: 0, length: 11, rect: [24,26 88.703125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 11, rect: [24,26 88.703125x18] baseline: 13.796875
"Filler Text" "Filler Text"
ListItemMarkerBox <(anonymous)> at (0,27) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (10,32) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,44) content-size 784x0 children: inline BlockContainer <(anonymous)> at (8,44) content-size 784x0 children: inline
TextNode <#text> TextNode <#text>
@ -21,7 +21,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x18] PaintableWithLines (BlockContainer(anonymous)) [8,8 784x18]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox(anonymous)) [24,26 768x18] PaintableWithLines (ListItemBox(anonymous)) [24,26 768x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [0,27 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [10,32 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0]

14
Tests/LibWeb/Layout/expected/details-closed.txt
View file

@ -2,10 +2,10 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x34 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x34 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x18 children: not-inline BlockContainer <body> at (8,8) content-size 784x18 children: not-inline
BlockContainer <details> at (8,8) content-size 784x18 children: not-inline BlockContainer <details> at (8,8) content-size 784x18 children: not-inline
ListItemBox <summary> at (32,8) content-size 760x18 children: inline ListItemBox <summary> at (24,8) content-size 776x18 children: inline
frag 0 from TextNode start: 0, length: 13, rect: [32,8 114.625x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 13, rect: [24,8 114.625x18] baseline: 13.796875
"I'm a summary" "I'm a summary"
ListItemMarkerBox <(anonymous)> at (8,9) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (8,13) content-size 8x8 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <slot> at (8,26) content-size 784x0 children: not-inline BlockContainer <slot> at (8,26) content-size 784x0 children: not-inline
BlockContainer <(anonymous)> at (8,26) content-size 784x0 children: inline BlockContainer <(anonymous)> at (8,26) content-size 784x0 children: inline
@ -13,10 +13,10 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600] ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x34] PaintableWithLines (BlockContainer<HTML>) [0,0 800x34]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x18] PaintableWithLines (BlockContainer<BODY>) [8,8 784x18] overflow: [8,8 792x18]
PaintableWithLines (BlockContainer<DETAILS>) [8,8 784x18] PaintableWithLines (BlockContainer<DETAILS>) [8,8 784x18] overflow: [8,8 792x18]
PaintableWithLines (ListItemBox<SUMMARY>) [32,8 760x18] PaintableWithLines (ListItemBox<SUMMARY>) [24,8 776x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [8,9 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [8,13 8x8]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<SLOT>) [8,26 784x0] PaintableWithLines (BlockContainer<SLOT>) [8,26 784x0]
PaintableWithLines (BlockContainer(anonymous)) [8,26 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,26 784x0]

14
Tests/LibWeb/Layout/expected/details-open.txt
View file

@ -2,10 +2,10 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x52 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x52 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x36 children: not-inline BlockContainer <body> at (8,8) content-size 784x36 children: not-inline
BlockContainer <details> at (8,8) content-size 784x36 children: not-inline BlockContainer <details> at (8,8) content-size 784x36 children: not-inline
ListItemBox <summary> at (32,8) content-size 760x18 children: inline ListItemBox <summary> at (24,8) content-size 776x18 children: inline
frag 0 from TextNode start: 0, length: 13, rect: [32,8 114.625x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 13, rect: [24,8 114.625x18] baseline: 13.796875
"I'm a summary" "I'm a summary"
ListItemMarkerBox <(anonymous)> at (8,9) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (8,13) content-size 8x8 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <slot> at (8,26) content-size 784x18 children: inline BlockContainer <slot> at (8,26) content-size 784x18 children: inline
TextNode <#text> TextNode <#text>
@ -20,10 +20,10 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600] ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x52] PaintableWithLines (BlockContainer<HTML>) [0,0 800x52]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x36] PaintableWithLines (BlockContainer<BODY>) [8,8 784x36] overflow: [8,8 792x36]
PaintableWithLines (BlockContainer<DETAILS>) [8,8 784x36] PaintableWithLines (BlockContainer<DETAILS>) [8,8 784x36] overflow: [8,8 792x36]
PaintableWithLines (ListItemBox<SUMMARY>) [32,8 760x18] PaintableWithLines (ListItemBox<SUMMARY>) [24,8 776x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [8,9 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [8,13 8x8]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<SLOT>) [8,26 784x18] PaintableWithLines (BlockContainer<SLOT>) [8,26 784x18]
PaintableWithLines (InlineNode<SPAN>) [8,26 82.3125x18] PaintableWithLines (InlineNode<SPAN>) [8,26 82.3125x18]

10
Tests/LibWeb/Layout/expected/details-summary-default-ua-style.txt
View file

@ -2,10 +2,10 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x154 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x154 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x138 children: not-inline BlockContainer <body> at (8,8) content-size 784x138 children: not-inline
BlockContainer <details> at (68,68) content-size 664x18 children: not-inline BlockContainer <details> at (68,68) content-size 664x18 children: not-inline
ListItemBox <summary> at (92,68) content-size 640x18 children: inline ListItemBox <summary> at (84,68) content-size 656x18 children: inline
frag 0 from TextNode start: 0, length: 5, rect: [92,68 36.84375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 5, rect: [84,68 36.84375x18] baseline: 13.796875
"hello" "hello"
ListItemMarkerBox <(anonymous)> at (68,69) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (68,73) content-size 8x8 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <slot> at (68,86) content-size 664x0 children: not-inline BlockContainer <slot> at (68,86) content-size 664x0 children: not-inline
@ -13,8 +13,8 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x154] PaintableWithLines (BlockContainer<HTML>) [0,0 800x154]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x138] PaintableWithLines (BlockContainer<BODY>) [8,8 784x138]
PaintableWithLines (BlockContainer<DETAILS>) [8,8 784x138] PaintableWithLines (BlockContainer<DETAILS>) [8,8 784x138]
PaintableWithLines (ListItemBox<SUMMARY>) [92,68 640x18] PaintableWithLines (ListItemBox<SUMMARY>) [84,68 656x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [68,69 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [68,73 8x8]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<SLOT>) [68,86 664x0] PaintableWithLines (BlockContainer<SLOT>) [68,86 664x0]

18
Tests/LibWeb/Layout/expected/inside-list-item-content-offset.txt
View file

@ -1,17 +1,17 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x416 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x406 [BFC] children: not-inline
BlockContainer <body> at (8,200) content-size 784x16 children: not-inline BlockContainer <body> at (8,200) content-size 784x6 children: not-inline
ListItemBox <span> at (232,200) content-size 360x16 children: not-inline ListItemBox <span> at (222,200) content-size 378x6 children: not-inline
ListItemMarkerBox <(anonymous)> at (208,201) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (208,206) content-size 6x6 children: not-inline
BlockContainer <(anonymous)> at (8,400) content-size 784x0 children: inline BlockContainer <(anonymous)> at (8,400) content-size 784x0 children: inline
TextNode <#text> TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600] ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x416] PaintableWithLines (BlockContainer<HTML>) [0,0 800x406]
PaintableWithLines (BlockContainer<BODY>) [8,200 784x16] overflow: [8,200 784x17] PaintableWithLines (BlockContainer<BODY>) [8,200 784x6] overflow: [8,200 784x12]
PaintableWithLines (ListItemBox<SPAN>) [232,200 360x16] overflow: [232,200 360x17] PaintableWithLines (ListItemBox<SPAN>) [222,200 378x6] overflow: [222,200 378x12]
MarkerPaintable (ListItemMarkerBox(anonymous)) [208,201 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [208,206 6x6]
PaintableWithLines (BlockContainer(anonymous)) [8,400 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,400 784x0]
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto) SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x416] [children: 0] (z-index: auto) SC for BlockContainer<HTML> [0,0 800x406] [children: 0] (z-index: auto)

4
Tests/LibWeb/Layout/expected/list-item-marker-pseudo-placement.txt
View file

@ -2,7 +2,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x52 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x52 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x36 children: not-inline BlockContainer <body> at (8,8) content-size 784x36 children: not-inline
ListItemBox <span> at (8,8) content-size 784x36 children: not-inline ListItemBox <span> at (8,8) content-size 784x36 children: not-inline
ListItemMarkerBox <(anonymous)> at (-16,9) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (-6,14) content-size 6x6 children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 784x18 children: inline BlockContainer <(anonymous)> at (8,8) content-size 784x18 children: inline
InlineNode <(anonymous)> InlineNode <(anonymous)>
frag 0 from TextNode start: 0, length: 6, rect: [8,8 52.53125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 6, rect: [8,8 52.53125x18] baseline: 13.796875
@ -21,7 +21,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x52] PaintableWithLines (BlockContainer<HTML>) [0,0 800x52]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x36] PaintableWithLines (BlockContainer<BODY>) [8,8 784x36]
PaintableWithLines (ListItemBox<SPAN>) [8,8 784x36] PaintableWithLines (ListItemBox<SPAN>) [8,8 784x36]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-16,9 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [-6,14 6x6]
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x18] PaintableWithLines (BlockContainer(anonymous)) [8,8 784x18]
PaintableWithLines (InlineNode(anonymous)) [8,8 52.53125x18] PaintableWithLines (InlineNode(anonymous)) [8,8 52.53125x18]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)

8
Tests/LibWeb/Layout/expected/list-render-list-owner-is-document.txt
View file

@ -8,14 +8,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (8,8) content-size 784x18 children: inline ListItemBox <li> at (8,8) content-size 784x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,8 29.8125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [8,8 29.8125x18] baseline: 13.796875
"One" "One"
ListItemMarkerBox <(anonymous)> at (-10.6875,9) content-size 18.6875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (-11,9) content-size 18.6875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,26) content-size 784x0 children: inline BlockContainer <(anonymous)> at (8,26) content-size 784x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (8,26) content-size 784x18 children: inline ListItemBox <li> at (8,26) content-size 784x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,26 33.875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [8,26 33.875x18] baseline: 13.796875
"Two" "Two"
ListItemMarkerBox <(anonymous)> at (-13.15625,27) content-size 21.15625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (-13,27) content-size 21.15625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,44) content-size 784x0 children: inline BlockContainer <(anonymous)> at (8,44) content-size 784x0 children: inline
TextNode <#text> TextNode <#text>
@ -26,11 +26,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x36] PaintableWithLines (BlockContainer<BODY>) [8,8 784x36]
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
PaintableWithLines (ListItemBox<LI>) [8,8 784x18] PaintableWithLines (ListItemBox<LI>) [8,8 784x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-10.6875,9 18.6875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [-11,9 18.6875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,26 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,26 784x0]
PaintableWithLines (ListItemBox<LI>) [8,26 784x18] PaintableWithLines (ListItemBox<LI>) [8,26 784x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-13.15625,27 21.15625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [-13,27 21.15625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0]

8
Tests/LibWeb/Layout/expected/list-render-list-owner-not-ol.txt
View file

@ -9,14 +9,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (8,8) content-size 784x18 children: inline ListItemBox <li> at (8,8) content-size 784x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,8 29.8125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [8,8 29.8125x18] baseline: 13.796875
"One" "One"
ListItemMarkerBox <(anonymous)> at (-10.6875,9) content-size 18.6875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (-11,9) content-size 18.6875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,26) content-size 784x0 children: inline BlockContainer <(anonymous)> at (8,26) content-size 784x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (8,26) content-size 784x18 children: inline ListItemBox <li> at (8,26) content-size 784x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,26 33.875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [8,26 33.875x18] baseline: 13.796875
"Two" "Two"
ListItemMarkerBox <(anonymous)> at (-13.15625,27) content-size 21.15625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (-13,27) content-size 21.15625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,44) content-size 784x0 children: inline BlockContainer <(anonymous)> at (8,44) content-size 784x0 children: inline
TextNode <#text> TextNode <#text>
@ -30,11 +30,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<DIV>#list-item-owner) [8,8 784x36] PaintableWithLines (BlockContainer<DIV>#list-item-owner) [8,8 784x36]
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
PaintableWithLines (ListItemBox<LI>) [8,8 784x18] PaintableWithLines (ListItemBox<LI>) [8,8 784x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-10.6875,9 18.6875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [-11,9 18.6875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,26 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,26 784x0]
PaintableWithLines (ListItemBox<LI>) [8,26 784x18] PaintableWithLines (ListItemBox<LI>) [8,26 784x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-13.15625,27 21.15625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [-13,27 21.15625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0]
PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0]

8
Tests/LibWeb/Layout/expected/list-render-no-list.txt
View file

@ -6,12 +6,12 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (8,8) content-size 784x18 children: inline ListItemBox <li> at (8,8) content-size 784x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,8 29.8125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [8,8 29.8125x18] baseline: 13.796875
"One" "One"
ListItemMarkerBox <(anonymous)> at (-16,9) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (-6,14) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (8,26) content-size 784x18 children: inline ListItemBox <li> at (8,26) content-size 784x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,26 33.875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [8,26 33.875x18] baseline: 13.796875
"Two" "Two"
ListItemMarkerBox <(anonymous)> at (-16,27) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (-6,32) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600] ViewportPaintable (Viewport<#document>) [0,0 800x600]
@ -19,10 +19,10 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x36] PaintableWithLines (BlockContainer<BODY>) [8,8 784x36]
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
PaintableWithLines (ListItemBox<LI>) [8,8 784x18] PaintableWithLines (ListItemBox<LI>) [8,8 784x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-16,9 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [-6,14 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<LI>) [8,26 784x18] PaintableWithLines (ListItemBox<LI>) [8,26 784x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-16,27 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [-6,32 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto) SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)

32
Tests/LibWeb/Layout/expected/ol-render-deep-hybrid-list-item-list.txt
View file

@ -7,14 +7,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,16) content-size 744x18 children: inline ListItemBox <li> at (48,16) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [48,16 29.8125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [48,16 29.8125x18] baseline: 13.796875
"One" "One"
ListItemMarkerBox <(anonymous)> at (29.3125,17) content-size 18.6875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (29,17) content-size 18.6875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,34) content-size 744x18 children: inline ListItemBox <li> at (48,34) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 10, rect: [48,34 90.796875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 10, rect: [48,34 90.796875x18] baseline: 13.796875
"Twenty-two" "Twenty-two"
ListItemMarkerBox <(anonymous)> at (18.03125,35) content-size 29.96875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,35) content-size 29.96875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -42,7 +42,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <div> at (48,124) content-size 744x18 children: inline ListItemBox <div> at (48,124) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 12, rect: [48,124 104.78125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 12, rect: [48,124 104.78125x18] baseline: 13.796875
"Twenty-three" "Twenty-three"
ListItemMarkerBox <(anonymous)> at (17.75,125) content-size 30.25x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,125) content-size 30.25x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,142) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,142) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -70,7 +70,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,226) content-size 744x18 children: inline ListItemBox <li> at (48,226) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 11, rect: [48,226 97.75x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 11, rect: [48,226 97.75x18] baseline: 13.796875
"Twenty-four" "Twenty-four"
ListItemMarkerBox <(anonymous)> at (19.09375,227) content-size 28.90625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (19,227) content-size 28.90625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,244) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,244) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -87,7 +87,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <p> at (48,296) content-size 744x18 children: inline ListItemBox <p> at (48,296) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 11, rect: [48,296 90.28125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 11, rect: [48,296 90.28125x18] baseline: 13.796875
"Twenty-five" "Twenty-five"
ListItemMarkerBox <(anonymous)> at (18.390625,297) content-size 29.609375x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,297) content-size 29.609375x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,330) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,330) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -96,21 +96,21 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,330) content-size 744x18 children: inline ListItemBox <li> at (48,330) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 10, rect: [48,330 85.96875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 10, rect: [48,330 85.96875x18] baseline: 13.796875
"Twenty-six" "Twenty-six"
ListItemMarkerBox <(anonymous)> at (18.109375,331) content-size 29.890625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,331) content-size 29.890625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,348) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,348) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <span> at (48,348) content-size 744x18 children: inline ListItemBox <span> at (48,348) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 12, rect: [48,348 106.953125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 12, rect: [48,348 106.953125x18] baseline: 13.796875
"Twenty-seven" "Twenty-seven"
ListItemMarkerBox <(anonymous)> at (18.125,349) content-size 29.875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,349) content-size 29.875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,366) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,366) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,366) content-size 744x18 children: inline ListItemBox <li> at (48,366) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 12, rect: [48,366 99.359375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 12, rect: [48,366 99.359375x18] baseline: 13.796875
"Twenty-eight" "Twenty-eight"
ListItemMarkerBox <(anonymous)> at (17.359375,367) content-size 30.640625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (17,367) content-size 30.640625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,384) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,384) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -123,11 +123,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<OL>) [8,16 784x368] PaintableWithLines (BlockContainer<OL>) [8,16 784x368]
PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0]
PaintableWithLines (ListItemBox<LI>) [48,16 744x18] PaintableWithLines (ListItemBox<LI>) [48,16 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [29.3125,17 18.6875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [29,17 18.6875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0]
PaintableWithLines (ListItemBox<LI>) [48,34 744x18] PaintableWithLines (ListItemBox<LI>) [48,34 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.03125,35 29.96875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,35 29.96875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0]
PaintableWithLines (BlockContainer<DIV>) [48,52 744x18] PaintableWithLines (BlockContainer<DIV>) [48,52 744x18]
@ -143,7 +143,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer(anonymous)) [48,106 744x18] PaintableWithLines (BlockContainer(anonymous)) [48,106 744x18]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<DIV>) [48,124 744x18] PaintableWithLines (ListItemBox<DIV>) [48,124 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [17.75,125 30.25x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,125 30.25x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,142 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,142 744x0]
PaintableWithLines (BlockContainer(anonymous)) [48,142 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,142 744x0]
@ -158,7 +158,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (InlineNode<SPAN>) [70.65625,192 12.609375x18] PaintableWithLines (InlineNode<SPAN>) [70.65625,192 12.609375x18]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<LI>) [48,226 744x18] PaintableWithLines (ListItemBox<LI>) [48,226 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [19.09375,227 28.90625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [19,227 28.90625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,244 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,244 744x0]
PaintableWithLines (BlockContainer<DIV>) [48,244 744x70] PaintableWithLines (BlockContainer<DIV>) [48,244 744x70]
@ -168,20 +168,20 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer(anonymous)) [48,262 744x18] PaintableWithLines (BlockContainer(anonymous)) [48,262 744x18]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (ListItemBox<P>) [48,296 744x18] PaintableWithLines (ListItemBox<P>) [48,296 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.390625,297 29.609375x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,297 29.609375x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,330 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,330 744x0]
PaintableWithLines (BlockContainer(anonymous)) [48,330 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,330 744x0]
PaintableWithLines (ListItemBox<LI>) [48,330 744x18] PaintableWithLines (ListItemBox<LI>) [48,330 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.109375,331 29.890625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,331 29.890625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,348 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,348 744x0]
PaintableWithLines (ListItemBox<SPAN>) [48,348 744x18] PaintableWithLines (ListItemBox<SPAN>) [48,348 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.125,349 29.875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,349 29.875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,366 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,366 744x0]
PaintableWithLines (ListItemBox<LI>) [48,366 744x18] PaintableWithLines (ListItemBox<LI>) [48,366 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [17.359375,367 30.640625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [17,367 30.640625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,384 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,384 744x0]
PaintableWithLines (BlockContainer(anonymous)) [8,400 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,400 784x0]

16
Tests/LibWeb/Layout/expected/ol-render-item-values.txt
View file

@ -9,14 +9,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,16) content-size 744x18 children: inline ListItemBox <li> at (48,16) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 5, rect: [48,16 47.21875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 5, rect: [48,16 47.21875x18] baseline: 13.796875
"Seven" "Seven"
ListItemMarkerBox <(anonymous)> at (26.9375,17) content-size 21.0625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (27,17) content-size 21.0625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,34) content-size 744x18 children: inline ListItemBox <li> at (48,34) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 28, rect: [48,34 242.4375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 28, rect: [48,34 242.4375x18] baseline: 13.796875
"Minus one hundred and twelve" "Minus one hundred and twelve"
ListItemMarkerBox <(anonymous)> at (7.671875,35) content-size 40.328125x16 children: not-inline ListItemMarkerBox <(anonymous)> at (8,35) content-size 40.328125x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -24,14 +24,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,52) content-size 744x18 children: inline ListItemBox <li> at (48,52) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 23, rect: [48,52 206.5x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 23, rect: [48,52 206.5x18] baseline: 13.796875
"Two to the power of ten" "Two to the power of ten"
ListItemMarkerBox <(anonymous)> at (3.15625,53) content-size 44.84375x16 children: not-inline ListItemMarkerBox <(anonymous)> at (3,53) content-size 44.84375x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,70) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,70) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,70) content-size 744x18 children: inline ListItemBox <li> at (48,70) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 6, rect: [48,70 51.34375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 6, rect: [48,70 51.34375x18] baseline: 13.796875
"Eleven" "Eleven"
ListItemMarkerBox <(anonymous)> at (22.96875,71) content-size 25.03125x16 children: not-inline ListItemMarkerBox <(anonymous)> at (23,71) content-size 25.03125x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,88) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,88) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -45,19 +45,19 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<OL>) [8,16 784x72] PaintableWithLines (BlockContainer<OL>) [8,16 784x72]
PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0]
PaintableWithLines (ListItemBox<LI>) [48,16 744x18] PaintableWithLines (ListItemBox<LI>) [48,16 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [26.9375,17 21.0625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [27,17 21.0625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0]
PaintableWithLines (ListItemBox<LI>) [48,34 744x18] PaintableWithLines (ListItemBox<LI>) [48,34 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [7.671875,35 40.328125x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [8,35 40.328125x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0]
PaintableWithLines (ListItemBox<LI>) [48,52 744x18] PaintableWithLines (ListItemBox<LI>) [48,52 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [3.15625,53 44.84375x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [3,53 44.84375x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,70 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,70 744x0]
PaintableWithLines (ListItemBox<LI>) [48,70 744x18] PaintableWithLines (ListItemBox<LI>) [48,70 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [22.96875,71 25.03125x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [23,71 25.03125x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,88 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,88 744x0]
PaintableWithLines (BlockContainer(anonymous)) [8,104 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,104 784x0]

32
Tests/LibWeb/Layout/expected/ol-render-style-list-item.txt
View file

@ -7,56 +7,56 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,16) content-size 744x18 children: inline ListItemBox <li> at (48,16) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [48,16 29.8125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [48,16 29.8125x18] baseline: 13.796875
"One" "One"
ListItemMarkerBox <(anonymous)> at (29.3125,17) content-size 18.6875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (29,17) content-size 18.6875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,34) content-size 744x18 children: inline ListItemBox <li> at (48,34) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 10, rect: [48,34 90.796875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 10, rect: [48,34 90.796875x18] baseline: 13.796875
"Twenty-two" "Twenty-two"
ListItemMarkerBox <(anonymous)> at (18.03125,35) content-size 29.96875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,35) content-size 29.96875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <div> at (48,52) content-size 744x18 children: inline ListItemBox <div> at (48,52) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 12, rect: [48,52 104.78125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 12, rect: [48,52 104.78125x18] baseline: 13.796875
"Twenty-three" "Twenty-three"
ListItemMarkerBox <(anonymous)> at (17.75,53) content-size 30.25x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,53) content-size 30.25x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,70) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,70) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,70) content-size 744x18 children: inline ListItemBox <li> at (48,70) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 11, rect: [48,70 97.75x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 11, rect: [48,70 97.75x18] baseline: 13.796875
"Twenty-four" "Twenty-four"
ListItemMarkerBox <(anonymous)> at (19.09375,71) content-size 28.90625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (19,71) content-size 28.90625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,88) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,88) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <p> at (48,104) content-size 744x18 children: inline ListItemBox <p> at (48,104) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 11, rect: [48,104 90.28125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 11, rect: [48,104 90.28125x18] baseline: 13.796875
"Twenty-five" "Twenty-five"
ListItemMarkerBox <(anonymous)> at (18.390625,105) content-size 29.609375x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,105) content-size 29.609375x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,138) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,138) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,138) content-size 744x18 children: inline ListItemBox <li> at (48,138) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 10, rect: [48,138 85.96875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 10, rect: [48,138 85.96875x18] baseline: 13.796875
"Twenty-six" "Twenty-six"
ListItemMarkerBox <(anonymous)> at (18.109375,139) content-size 29.890625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,139) content-size 29.890625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,156) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,156) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <span> at (48,156) content-size 744x18 children: inline ListItemBox <span> at (48,156) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 12, rect: [48,156 106.953125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 12, rect: [48,156 106.953125x18] baseline: 13.796875
"Twenty-seven" "Twenty-seven"
ListItemMarkerBox <(anonymous)> at (18.125,157) content-size 29.875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,157) content-size 29.875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,174) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,174) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,174) content-size 744x18 children: inline ListItemBox <li> at (48,174) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 12, rect: [48,174 99.359375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 12, rect: [48,174 99.359375x18] baseline: 13.796875
"Twenty-eight" "Twenty-eight"
ListItemMarkerBox <(anonymous)> at (17.359375,175) content-size 30.640625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (17,175) content-size 30.640625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,192) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,192) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -69,35 +69,35 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<OL>) [8,16 784x176] PaintableWithLines (BlockContainer<OL>) [8,16 784x176]
PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0]
PaintableWithLines (ListItemBox<LI>) [48,16 744x18] PaintableWithLines (ListItemBox<LI>) [48,16 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [29.3125,17 18.6875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [29,17 18.6875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0]
PaintableWithLines (ListItemBox<LI>) [48,34 744x18] PaintableWithLines (ListItemBox<LI>) [48,34 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.03125,35 29.96875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,35 29.96875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0]
PaintableWithLines (ListItemBox<DIV>) [48,52 744x18] PaintableWithLines (ListItemBox<DIV>) [48,52 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [17.75,53 30.25x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,53 30.25x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,70 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,70 744x0]
PaintableWithLines (ListItemBox<LI>) [48,70 744x18] PaintableWithLines (ListItemBox<LI>) [48,70 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [19.09375,71 28.90625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [19,71 28.90625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,88 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,88 744x0]
PaintableWithLines (ListItemBox<P>) [48,104 744x18] PaintableWithLines (ListItemBox<P>) [48,104 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.390625,105 29.609375x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,105 29.609375x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,138 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,138 744x0]
PaintableWithLines (ListItemBox<LI>) [48,138 744x18] PaintableWithLines (ListItemBox<LI>) [48,138 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.109375,139 29.890625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,139 29.890625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,156 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,156 744x0]
PaintableWithLines (ListItemBox<SPAN>) [48,156 744x18] PaintableWithLines (ListItemBox<SPAN>) [48,156 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.125,157 29.875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,157 29.875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,174 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,174 744x0]
PaintableWithLines (ListItemBox<LI>) [48,174 744x18] PaintableWithLines (ListItemBox<LI>) [48,174 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [17.359375,175 30.640625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [17,175 30.640625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,192 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,192 744x0]
PaintableWithLines (BlockContainer(anonymous)) [8,208 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,208 784x0]

28
Tests/LibWeb/Layout/expected/ordered-list.txt
View file

@ -7,21 +7,21 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,16) content-size 744x18 children: inline ListItemBox <li> at (48,16) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 7, rect: [48,16 58.78125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 7, rect: [48,16 58.78125x18] baseline: 13.796875
"Item 20" "Item 20"
ListItemMarkerBox <(anonymous)> at (17.25,17) content-size 30.75x16 children: not-inline ListItemMarkerBox <(anonymous)> at (17,17) content-size 30.75x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,34) content-size 744x18 children: inline ListItemBox <li> at (48,34) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 7, rect: [48,34 55.53125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 7, rect: [48,34 55.53125x18] baseline: 13.796875
"Item 21" "Item 21"
ListItemMarkerBox <(anonymous)> at (20.5,35) content-size 27.5x16 children: not-inline ListItemMarkerBox <(anonymous)> at (20,35) content-size 27.5x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,52) content-size 744x18 children: inline ListItemBox <li> at (48,52) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 7, rect: [48,52 58x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 7, rect: [48,52 58x18] baseline: 13.796875
"Item 22" "Item 22"
ListItemMarkerBox <(anonymous)> at (18.03125,53) content-size 29.96875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (18,53) content-size 29.96875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,70) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,70) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -33,28 +33,28 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,86) content-size 744x18 children: inline ListItemBox <li> at (48,86) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 6, rect: [48,86 46.71875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 6, rect: [48,86 46.71875x18] baseline: 13.796875
"Item 1" "Item 1"
ListItemMarkerBox <(anonymous)> at (29.3125,87) content-size 18.6875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (29,87) content-size 18.6875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,104) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,104) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,104) content-size 744x18 children: inline ListItemBox <li> at (48,104) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 6, rect: [48,104 48.828125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 6, rect: [48,104 48.828125x18] baseline: 13.796875
"Item 5" "Item 5"
ListItemMarkerBox <(anonymous)> at (27.203125,105) content-size 20.796875x16 children: not-inline ListItemMarkerBox <(anonymous)> at (27,105) content-size 20.796875x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,122) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,122) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,122) content-size 744x18 children: inline ListItemBox <li> at (48,122) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 6, rect: [48,122 49.109375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 6, rect: [48,122 49.109375x18] baseline: 13.796875
"Item 6" "Item 6"
ListItemMarkerBox <(anonymous)> at (26.921875,123) content-size 21.078125x16 children: not-inline ListItemMarkerBox <(anonymous)> at (27,123) content-size 21.078125x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,140) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,140) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,140) content-size 744x18 children: inline ListItemBox <li> at (48,140) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 6, rect: [48,140 49.09375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 6, rect: [48,140 49.09375x18] baseline: 13.796875
"Item 7" "Item 7"
ListItemMarkerBox <(anonymous)> at (26.9375,141) content-size 21.0625x16 children: not-inline ListItemMarkerBox <(anonymous)> at (27,141) content-size 21.0625x16 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,158) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,158) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -67,34 +67,34 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<OL>) [8,16 784x54] PaintableWithLines (BlockContainer<OL>) [8,16 784x54]
PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0]
PaintableWithLines (ListItemBox<LI>) [48,16 744x18] PaintableWithLines (ListItemBox<LI>) [48,16 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [17.25,17 30.75x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [17,17 30.75x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0]
PaintableWithLines (ListItemBox<LI>) [48,34 744x18] PaintableWithLines (ListItemBox<LI>) [48,34 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [20.5,35 27.5x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [20,35 27.5x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0]
PaintableWithLines (ListItemBox<LI>) [48,52 744x18] PaintableWithLines (ListItemBox<LI>) [48,52 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [18.03125,53 29.96875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [18,53 29.96875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,70 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,70 744x0]
PaintableWithLines (BlockContainer(anonymous)) [8,86 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,86 784x0]
PaintableWithLines (BlockContainer<OL>) [8,86 784x72] PaintableWithLines (BlockContainer<OL>) [8,86 784x72]
PaintableWithLines (BlockContainer(anonymous)) [48,86 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,86 744x0]
PaintableWithLines (ListItemBox<LI>) [48,86 744x18] PaintableWithLines (ListItemBox<LI>) [48,86 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [29.3125,87 18.6875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [29,87 18.6875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,104 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,104 744x0]
PaintableWithLines (ListItemBox<LI>) [48,104 744x18] PaintableWithLines (ListItemBox<LI>) [48,104 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [27.203125,105 20.796875x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [27,105 20.796875x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,122 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,122 744x0]
PaintableWithLines (ListItemBox<LI>) [48,122 744x18] PaintableWithLines (ListItemBox<LI>) [48,122 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [26.921875,123 21.078125x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [27,123 21.078125x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,140 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,140 744x0]
PaintableWithLines (ListItemBox<LI>) [48,140 744x18] PaintableWithLines (ListItemBox<LI>) [48,140 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [26.9375,141 21.0625x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [27,141 21.0625x16]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,158 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,158 744x0]
PaintableWithLines (BlockContainer(anonymous)) [8,174 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,174 784x0]

16
Tests/LibWeb/Layout/expected/ul-render.txt
View file

@ -11,14 +11,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,16) content-size 744x18 children: inline ListItemBox <li> at (48,16) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 5, rect: [48,16 47.859375x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 5, rect: [48,16 47.859375x18] baseline: 13.796875
"Three" "Three"
ListItemMarkerBox <(anonymous)> at (24,17) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (34,22) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,34) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,34) content-size 744x18 children: inline ListItemBox <li> at (48,34) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 4, rect: [48,34 41.5x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 4, rect: [48,34 41.5x18] baseline: 13.796875
"Four" "Four"
ListItemMarkerBox <(anonymous)> at (24,35) content-size 12x16 children: not-inline ListItemMarkerBox <(anonymous)> at (34,40) content-size 6x6 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,52) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -30,14 +30,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ListItemBox <li> at (48,68) content-size 744x18 children: inline ListItemBox <li> at (48,68) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [48,68 29.8125x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [48,68 29.8125x18] baseline: 13.796875
"One" "One"
ListItemMarkerBox <(anonymous)> at (40,69) content-size 4x8 children: not-inline ListItemMarkerBox <(anonymous)> at (41,71) content-size 3x3 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,86) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,86) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
ListItemBox <li> at (48,86) content-size 744x18 children: inline ListItemBox <li> at (48,86) content-size 744x18 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [48,86 33.875x18] baseline: 13.796875 frag 0 from TextNode start: 0, length: 3, rect: [48,86 33.875x18] baseline: 13.796875
"Two" "Two"
ListItemMarkerBox <(anonymous)> at (40,87) content-size 4x8 children: not-inline ListItemMarkerBox <(anonymous)> at (41,89) content-size 3x3 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (48,104) content-size 744x0 children: inline BlockContainer <(anonymous)> at (48,104) content-size 744x0 children: inline
TextNode <#text> TextNode <#text>
@ -52,22 +52,22 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<UL>.A) [8,16 784x36] PaintableWithLines (BlockContainer<UL>.A) [8,16 784x36]
PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,16 744x0]
PaintableWithLines (ListItemBox<LI>) [48,16 744x18] PaintableWithLines (ListItemBox<LI>) [48,16 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [24,17 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [34,22 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,34 744x0]
PaintableWithLines (ListItemBox<LI>) [48,34 744x18] PaintableWithLines (ListItemBox<LI>) [48,34 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [24,35 12x16] MarkerPaintable (ListItemMarkerBox(anonymous)) [34,40 6x6]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,52 744x0]
PaintableWithLines (BlockContainer(anonymous)) [8,68 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,68 784x0]
PaintableWithLines (BlockContainer<UL>.B) [8,68 784x36] PaintableWithLines (BlockContainer<UL>.B) [8,68 784x36]
PaintableWithLines (BlockContainer(anonymous)) [48,68 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,68 744x0]
PaintableWithLines (ListItemBox<LI>) [48,68 744x18] PaintableWithLines (ListItemBox<LI>) [48,68 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [40,69 4x8] MarkerPaintable (ListItemMarkerBox(anonymous)) [41,71 3x3]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,86 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,86 744x0]
PaintableWithLines (ListItemBox<LI>) [48,86 744x18] PaintableWithLines (ListItemBox<LI>) [48,86 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [40,87 4x8] MarkerPaintable (ListItemMarkerBox(anonymous)) [41,89 3x3]
TextPaintable (TextNode<#text>) TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [48,104 744x0] PaintableWithLines (BlockContainer(anonymous)) [48,104 744x0]
PaintableWithLines (BlockContainer(anonymous)) [8,120 784x0] PaintableWithLines (BlockContainer(anonymous)) [8,120 784x0]

BIN
Tests/LibWeb/Screenshot/images/details-open-then-closed.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

Before After
Before After

BIN
Tests/LibWeb/Screenshot/images/ordered-list-ref.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.1 KiB

After

Width:  |  Height:  |  Size: 4.1 KiB

Before After
Before After