mirror of
https://github.com/RGBCube/serenity
synced 2025-07-26 04:27:44 +00:00
LibWeb: Clip cell spans past the end of the table
This occurs on Wikipedia for tournament brackets, for example: https://en.wikipedia.org/wiki/2022%E2%80%9323_UEFA_Champions_League_knockout_phase
This commit is contained in:
Andi Gallo
Andreas Kling
parent
205f9c75d9
commit
701b170dc0
3 changed files with 96 additions and 0 deletions
|
|
@ -0,0 +1,65 @@
|
||||||
|
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 784x118.40625 children: not-inline
|
||||||
|
TableWrapper <(anonymous)> at (8,8) content-size 123.171875x118.40625 [BFC] children: not-inline
|
||||||
|
Box <table> at (8,8) content-size 123.171875x118.40625 table-box [TFC] children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
Box <tbody> at (8,8) content-size 123.171875x118.40625 table-row-group children: not-inline
|
||||||
|
Box <tr> at (8,8) content-size 123.171875x39.46875 table-row children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (19,19) content-size 8.453125x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [19,19 6.34375x17.46875]
|
||||||
|
"1"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (49.453125,19) content-size 8.8125x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [49.453125,19 8.8125x17.46875]
|
||||||
|
"2"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (80.265625,19) content-size 9.09375x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [80.265625,19 9.09375x17.46875]
|
||||||
|
"3"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
Box <tr> at (8,47.46875) content-size 123.171875x39.46875 table-row children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (19,58.46875) content-size 8.453125x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [19,58.46875 7.75x17.46875]
|
||||||
|
"4"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (49.453125,78.203125) content-size 70.71875x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 24.046875, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 3, rect: [49.453125,78.203125 24.046875x17.46875]
|
||||||
|
"6-9"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
Box <tr> at (8,86.9375) content-size 123.171875x39.46875 table-row children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (19,97.9375) content-size 8.453125x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 8.453125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [19,97.9375 8.453125x17.46875]
|
||||||
|
"5"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
25
Tests/LibWeb/Layout/input/table/clip-spans-to-table-end.html
Normal file
25
Tests/LibWeb/Layout/input/table/clip-spans-to-table-end.html
Normal file
|
|
@ -0,0 +1,25 @@
|
||||||
|
<style>
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
padding: 10px;
|
||||||
|
border: 1px solid black;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<td>1</td>
|
||||||
|
<td>2</td>
|
||||||
|
<td>3</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>4</td>
|
||||||
|
<td rowspan="3" colspan="3">6-9</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>5</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
@ -153,6 +153,12 @@ void TableFormattingContext::calculate_row_column_grid(Box const& box)
|
||||||
});
|
});
|
||||||
|
|
||||||
m_columns.resize(x_width);
|
m_columns.resize(x_width);
|
||||||
|
|
||||||
|
for (auto& cell : m_cells) {
|
||||||
|
// Clip spans to the end of the table.
|
||||||
|
cell.row_span = min(cell.row_span, m_rows.size() - cell.row_index);
|
||||||
|
cell.column_span = min(cell.column_span, m_columns.size() - cell.column_index);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
void TableFormattingContext::compute_cell_measures(AvailableSpace const& available_space)
|
void TableFormattingContext::compute_cell_measures(AvailableSpace const& available_space)
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue