mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2024-11-26 09:30:24 +00:00
LibWeb: Use available space to resolve table container width
Using avilable space directly while resolving table container width allows to avoid assigning it to table wrapper box content width which sometimes involves infinite (saturated) values. Also this allows to get rid of set_max_content_width() which is a hack that allows to bypass set_content_width() to assign infinite (saturated) width to a box. Closes https://github.com/SerenityOS/serenity/issues/19521
This commit is contained in:
parent
fb60db7b00
commit
9101c8d079
Notes:
sideshowbarker
2024-07-17 08:42:05 +09:00
Author: https://github.com/kalenikaliaksandr Commit: https://github.com/SerenityOS/serenity/commit/9101c8d079 Pull-request: https://github.com/SerenityOS/serenity/pull/20497 Issue: https://github.com/SerenityOS/serenity/issues/19521
7 changed files with 42 additions and 35 deletions
|
@ -2,14 +2,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
|||
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x113.15625 children: not-inline
|
||||
TableWrapper <(anonymous)> at (8,8) content-size 784x113.15625 [BFC] children: not-inline
|
||||
Box <table.ambox> at (9,9) content-size 784x111.15625 table-box [TFC] children: not-inline
|
||||
Box <table.ambox> at (9,9) content-size 782x111.15625 table-box [TFC] children: not-inline
|
||||
BlockContainer <(anonymous)> (not painted) children: inline
|
||||
TextNode <#text>
|
||||
Box <tbody> at (9,9) content-size 778x107.15625 table-row-group children: not-inline
|
||||
Box <tr> at (11,11) content-size 778x107.15625 table-row children: not-inline
|
||||
Box <tbody> at (9,9) content-size 776x107.15625 table-row-group children: not-inline
|
||||
Box <tr> at (11,11) content-size 776x107.15625 table-row children: not-inline
|
||||
BlockContainer <td.mbox-image> at (12,39.578125) content-size 50x50 table-cell [BFC] children: not-inline
|
||||
BlockContainer <div.mbox-image-div> at (12,39.578125) content-size 50x50 children: not-inline
|
||||
BlockContainer <td.mbox-text> at (66,12) content-size 724x105.15625 table-cell [BFC] children: inline
|
||||
BlockContainer <td.mbox-text> at (66,12) content-size 722x105.15625 table-cell [BFC] children: inline
|
||||
line 0 width: 689.640625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||
frag 0 from TextNode start: 1, length: 84, rect: [66,12 689.640625x17.46875]
|
||||
"In a scene set in a lawyer's office, the lawyer sits alone and bounces a rubber ball"
|
||||
|
@ -32,12 +32,12 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
|||
|
||||
PaintableWithLines (Viewport<#document>) [0,0 800x600]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x113.15625] overflow: [8,8 786x113.15625]
|
||||
PaintableWithLines (TableWrapper(anonymous)) [8,8 784x113.15625] overflow: [8,8 786x113.15625]
|
||||
PaintableBox (Box<TABLE>.ambox) [8,8 786x113.15625]
|
||||
PaintableBox (Box<TBODY>) [9,9 778x107.15625] overflow: [9,9 782x109.15625]
|
||||
PaintableBox (Box<TR>) [11,11 778x107.15625] overflow: [11,11 780x107.15625]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x113.15625]
|
||||
PaintableWithLines (TableWrapper(anonymous)) [8,8 784x113.15625]
|
||||
PaintableBox (Box<TABLE>.ambox) [8,8 784x113.15625]
|
||||
PaintableBox (Box<TBODY>) [9,9 776x107.15625] overflow: [9,9 780x109.15625]
|
||||
PaintableBox (Box<TR>) [11,11 776x107.15625] overflow: [11,11 778x107.15625]
|
||||
PaintableWithLines (BlockContainer<TD>.mbox-image) [11,11 52x107.15625]
|
||||
PaintableWithLines (BlockContainer<DIV>.mbox-image-div) [12,39.578125 50x50]
|
||||
PaintableWithLines (BlockContainer<TD>.mbox-text) [65,11 726x107.15625]
|
||||
PaintableWithLines (BlockContainer<TD>.mbox-text) [65,11 724x107.15625]
|
||||
TextPaintable (TextNode<#text>)
|
||||
|
|
21
Tests/LibWeb/Layout/expected/table/infinite-padding.txt
Normal file
21
Tests/LibWeb/Layout/expected/table/infinite-padding.txt
Normal file
|
@ -0,0 +1,21 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x16 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x0 children: not-inline
|
||||
TableWrapper <(anonymous)> at (8,8) content-size 0x0 [BFC] children: not-inline
|
||||
Box <div#box1> at (8,8) content-size 0x0 table-box [TFC] children: not-inline
|
||||
Box <(anonymous)> at (8,8) content-size 0x0 table-row children: not-inline
|
||||
BlockContainer <(anonymous)> at (8,8) content-size 0x0 table-cell [BFC] children: not-inline
|
||||
BlockContainer <div> at (8,8) content-size 0x0 children: not-inline
|
||||
TableWrapper <(anonymous)> at (8,8) content-size 0x0 [BFC] children: not-inline
|
||||
Box <div#box2> at (8,8) content-size 0x0 table-box [TFC] children: not-inline
|
||||
|
||||
PaintableWithLines (Viewport<#document>) [0,0 800x600]
|
||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x16]
|
||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x0]
|
||||
PaintableWithLines (TableWrapper(anonymous)) [8,8 0x0]
|
||||
PaintableBox (Box<DIV>#box1) [8,8 0x0]
|
||||
PaintableBox (Box(anonymous)) [8,8 0x0]
|
||||
PaintableWithLines (BlockContainer(anonymous)) [8,8 0x0]
|
||||
PaintableWithLines (BlockContainer<DIV>) [8,8 0x0]
|
||||
PaintableWithLines (TableWrapper(anonymous)) [8,8 0x0]
|
||||
PaintableBox (Box<DIV>#box2) [8,8 0x0]
|
10
Tests/LibWeb/Layout/input/table/infinite-padding.html
Normal file
10
Tests/LibWeb/Layout/input/table/infinite-padding.html
Normal file
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html><html><head><style>
|
||||
#box1 {
|
||||
display: table;
|
||||
}
|
||||
|
||||
#box2 {
|
||||
display: table;
|
||||
padding: 100%;
|
||||
}
|
||||
</style></head><body><div id="box1"><div><div id="box2">
|
|
@ -421,14 +421,6 @@ CSSPixels BlockFormattingContext::compute_table_box_width_inside_table_wrapper(B
|
|||
auto available_width = width_of_containing_block - margin_left.to_px(box) - margin_right.to_px(box);
|
||||
|
||||
LayoutState throwaway_state(&m_state);
|
||||
if (available_space.width.is_definite())
|
||||
throwaway_state.get_mutable(box).set_content_width(available_width);
|
||||
else if (available_space.width.is_min_content())
|
||||
throwaway_state.get_mutable(box).set_min_content_width();
|
||||
else {
|
||||
VERIFY(available_space.width.is_max_content());
|
||||
throwaway_state.get_mutable(box).set_max_content_width();
|
||||
}
|
||||
auto context = create_independent_formatting_context_if_needed(throwaway_state, box);
|
||||
VERIFY(context);
|
||||
context->run(box, LayoutMode::IntrinsicSizing, m_state.get(box).available_inner_space_or_constraints_from(available_space));
|
||||
|
|
|
@ -426,18 +426,4 @@ void LayoutState::UsedValues::set_indefinite_content_height()
|
|||
m_has_definite_height = false;
|
||||
}
|
||||
|
||||
void LayoutState::UsedValues::set_min_content_width()
|
||||
{
|
||||
width_constraint = SizeConstraint::MinContent;
|
||||
m_content_width = 0;
|
||||
m_has_definite_height = false;
|
||||
}
|
||||
|
||||
void LayoutState::UsedValues::set_max_content_width()
|
||||
{
|
||||
width_constraint = SizeConstraint::MaxContent;
|
||||
m_content_width = INFINITY;
|
||||
m_has_definite_width = false;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -51,8 +51,6 @@ struct LayoutState {
|
|||
|
||||
void set_indefinite_content_width();
|
||||
void set_indefinite_content_height();
|
||||
void set_min_content_width();
|
||||
void set_max_content_width();
|
||||
|
||||
// NOTE: These are used by FlexFormattingContext to assign a temporary main size to items
|
||||
// early on, so that descendants have something to resolve percentages against.
|
||||
|
|
|
@ -567,7 +567,7 @@ void TableFormattingContext::compute_table_width()
|
|||
|
||||
auto& computed_values = table_box().computed_values();
|
||||
|
||||
CSSPixels width_of_table_containing_block = m_state.get(*table_box().containing_block()).content_width();
|
||||
CSSPixels width_of_table_containing_block = m_available_space->width.to_px();
|
||||
|
||||
// Percentages on 'width' and 'height' on the table are relative to the table wrapper box's containing block,
|
||||
// not the table wrapper box itself.
|
||||
|
|
Loading…
Reference in a new issue