mirror of
https://github.com/RGBCube/serenity
synced 2025-07-25 14:27:35 +00:00
LibWeb: Fix empty slot finding in table formation algorithm
The algorithm which finds the first free slot must run for every cell, not for every row.
This commit is contained in:
Andi Gallo
Andreas Kling
parent
282e8357ed
commit
205f9c75d9
3 changed files with 122 additions and 2 deletions
|
|
@ -0,0 +1,86 @@
|
||||||
|
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 784x159.875 children: not-inline
|
||||||
|
TableWrapper <(anonymous)> at (8,8) content-size 99.421875x159.875 [BFC] children: not-inline
|
||||||
|
Box <table> at (9,9) content-size 99.421875x157.875 table-box [TFC] children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
Box <tbody> at (9,9) content-size 101.421875x157.875 table-row-group children: not-inline
|
||||||
|
Box <tr> at (9,9) content-size 101.421875x39.46875 table-row children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (20,20) content-size 9.59375x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 9.59375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [20,20 9.59375x17.46875]
|
||||||
|
"0"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (51.59375,39.734375) content-size 14.265625x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 14.265625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [51.59375,39.734375 14.265625x17.46875]
|
||||||
|
"A"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (87.859375,59.46875) content-size 11.5625x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 11.5625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [87.859375,59.46875 11.5625x17.46875]
|
||||||
|
"X"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
Box <tr> at (9,48.46875) content-size 101.421875x39.46875 table-row children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (20,59.46875) content-size 9.59375x17.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: [20,59.46875 6.34375x17.46875]
|
||||||
|
"1"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
Box <tr> at (9,87.9375) content-size 101.421875x39.46875 table-row children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (20,98.9375) content-size 9.59375x17.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: [20,98.9375 8.8125x17.46875]
|
||||||
|
"2"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (51.59375,118.671875) content-size 14.265625x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 9.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [51.59375,118.671875 9.34375x17.46875]
|
||||||
|
"B"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
Box <tr> at (9,127.40625) content-size 101.421875x39.46875 table-row children: not-inline
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (20,138.40625) content-size 9.59375x17.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: [20,138.40625 9.09375x17.46875]
|
||||||
|
"3"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <td> at (87.859375,138.40625) content-size 11.5625x17.46875 table-cell [BFC] children: inline
|
||||||
|
line 0 width: 10.3125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||||
|
frag 0 from TextNode start: 0, length: 1, rect: [87.859375,138.40625 10.3125x17.46875]
|
||||||
|
"C"
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> (not painted) children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <(anonymous)> at (8,167.875) content-size 784x0 children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
|
@ -0,0 +1,31 @@
|
||||||
|
<style>
|
||||||
|
table {
|
||||||
|
border: 1px solid black;
|
||||||
|
border-collapse: collapse;
|
||||||
|
border-spacing: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
padding: 10px;
|
||||||
|
border: 1px solid black;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<td>0</td>
|
||||||
|
<td rowspan="2">A</td>
|
||||||
|
<td rowspan="3">X</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>1</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>2</td>
|
||||||
|
<td rowspan="2">B</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>3</td>
|
||||||
|
<td>C</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
@ -98,16 +98,19 @@ void TableFormattingContext::calculate_row_column_grid(Box const& box)
|
||||||
size_t x_width = 0, y_height = 0;
|
size_t x_width = 0, y_height = 0;
|
||||||
size_t x_current = 0, y_current = 0;
|
size_t x_current = 0, y_current = 0;
|
||||||
|
|
||||||
|
// Implements https://html.spec.whatwg.org/multipage/tables.html#algorithm-for-processing-rows
|
||||||
auto process_row = [&](auto& row) {
|
auto process_row = [&](auto& row) {
|
||||||
if (y_height == y_current)
|
if (y_height == y_current)
|
||||||
y_height++;
|
y_height++;
|
||||||
|
|
||||||
x_current = 0;
|
x_current = 0;
|
||||||
while (x_current < x_width && grid.contains(GridPosition { x_current, y_current }))
|
|
||||||
x_current++;
|
|
||||||
|
|
||||||
for (auto* child = row.first_child(); child; child = child->next_sibling()) {
|
for (auto* child = row.first_child(); child; child = child->next_sibling()) {
|
||||||
if (child->display().is_table_cell()) {
|
if (child->display().is_table_cell()) {
|
||||||
|
// Cells: While x_current is less than x_width and the slot with coordinate (x_current, y_current) already has a cell assigned to it, increase x_current by 1.
|
||||||
|
while (x_current < x_width && grid.contains(GridPosition { x_current, y_current }))
|
||||||
|
x_current++;
|
||||||
|
|
||||||
Box const* box = static_cast<Box const*>(child);
|
Box const* box = static_cast<Box const*>(child);
|
||||||
if (x_current == x_width)
|
if (x_current == x_width)
|
||||||
x_width++;
|
x_width++;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue