0ct0pu5/ladybird
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

LibWeb: Report border box width for tables in a block

Browse source 
For the containing block, table borders are opaque and have to be
accounted when computing the table width since they use available space.
This commit is contained in:
Andi Gallo 2023-06-25 03:50:41 +00:00 • committed by Andreas Kling
parent 2c4908094c
commit 8b34af816e
Notes: sideshowbarker 2024-07-16 23:57:20 +09:00
19 changed files with 154 additions and 26 deletions

2
Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-presentational-hints.txt
View file

@ -1,7 +1,7 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x124 [BFC] children: not-inline
BlockContainer <body> at (10,10) content-size 780x106 children: not-inline
TableWrapper <(anonymous)> at (10,10) content-size 108x106 [BFC] children: not-inline
TableWrapper <(anonymous)> at (10,10) content-size 110x106 [BFC] children: not-inline
Box <table> at (11,11) content-size 108x104 table-box [TFC] children: not-inline
Box <tbody> at (11,11) content-size 104x100 table-row-group children: not-inline
Box <tr> at (13,13) content-size 104x100 table-row children: not-inline

2
Tests/LibWeb/Layout/expected/percentage-max-height-when-containing-block-has-indefinite-height.txt
View file

@ -33,7 +33,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text>
BlockContainer <(anonymous)> at (10,93.875) content-size 780x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (10,93.875) content-size 40.625x21.46875 [BFC] children: not-inline
TableWrapper <(anonymous)> at (10,93.875) content-size 42.625x21.46875 [BFC] children: not-inline
Box <div.table.formatting-context> at (11,94.875) content-size 40.625x19.46875 table-box [TFC] children: not-inline
Box <(anonymous)> at (11,94.875) content-size 40.625x19.46875 table-row children: not-inline
BlockContainer <(anonymous)> at (11,94.875) content-size 40.625x19.46875 table-cell [BFC] children: not-inline

2
Tests/LibWeb/Layout/expected/table/align-top-and-bottom.txt
View file

@ -1,7 +1,7 @@
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 784x100.9375 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 198.328125x100.9375 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 200.328125x100.9375 [BFC] children: not-inline
Box <table> at (9,9) content-size 198.328125x98.9375 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/border-spacing-and-borders-table-width.txt
View file

@ -1,7 +1,7 @@
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 784x77.46875 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 113.609375x77.46875 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 143.609375x77.46875 [BFC] children: not-inline
Box <table> at (23,13) content-size 113.609375x67.46875 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/border-spacing-colspan.txt
View file

@ -5,7 +5,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <body> at (8,8) content-size 784x259.34375 children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (8,8) content-size 241.90625x259.34375 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 243.90625x259.34375 [BFC] children: not-inline
Box <table> at (9,9) content-size 241.90625x257.34375 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/border-spacing-rowspan.txt
View file

@ -5,7 +5,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <body> at (8,8) content-size 784x259.34375 children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (8,8) content-size 241.90625x259.34375 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 243.90625x259.34375 [BFC] children: not-inline
Box <table> at (9,9) content-size 241.90625x257.34375 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/border-spacing.txt
View file

@ -5,7 +5,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <body> at (8,8) content-size 784x259.34375 children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (8,8) content-size 241.90625x259.34375 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 243.90625x259.34375 [BFC] children: not-inline
Box <table> at (9,9) content-size 241.90625x257.34375 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/borders.txt
View file

@ -1,7 +1,7 @@
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 784x285.625 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 172.296875x74.40625 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 174.296875x74.40625 [BFC] children: not-inline
Box <table.table-border-black> at (9,9) content-size 172.296875x72.40625 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/colspan-weighted-width-distribution.txt
View file

@ -1,7 +1,7 @@
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 784x44.9375 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 208x44.9375 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 210x44.9375 [BFC] children: not-inline
Box <table> at (9,9) content-size 208x42.9375 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/colspan-width-distribution.txt
View file

@ -5,7 +5,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <body> at (8,8) content-size 784x44.9375 children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (8,8) content-size 37.3125x44.9375 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 39.3125x44.9375 [BFC] children: not-inline
Box <table> at (9,9) content-size 37.3125x42.9375 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

4
Tests/LibWeb/Layout/expected/table/long-caption-increases-width.txt
View file

@ -3,13 +3,13 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
TextNode <#text>
BlockContainer <body> at (8,8) content-size 784x111.8125 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 59.046875x111.8125 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 63.046875x111.8125 [BFC] children: not-inline
Box <table#full-table> at (10,43.40625) content-size 59.046875x72.40625 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <caption> at (8,8) content-size 59.046875x35.40625 [BFC] children: inline
line 0 width: 54.03125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 1, length: 6, rect: [9,8 54.03125x17.46875]
frag 0 from TextNode start: 1, length: 6, rect: [11,8 54.03125x17.46875]
"A long"
line 1 width: 59.046875, height: 17.9375, bottom: 35.40625, baseline: 13.53125
frag 0 from TextNode start: 8, length: 7, rect: [8,25 59.046875x17.46875]

2
Tests/LibWeb/Layout/expected/table/multi-line-cell.txt
View file

@ -1,7 +1,7 @@
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 784x86.8125 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 79.4375x86.8125 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 81.4375x86.8125 [BFC] children: not-inline
Box <table> at (9,9) content-size 79.4375x84.8125 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

82
Tests/LibWeb/Layout/expected/table/nested-table-box-width.txt Normal file
View file

@ -0,0 +1,82 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x140.9375 [BFC] children: not-inline
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
TextNode <#text>
BlockContainer <body> at (8,8) content-size 784x124.9375 children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (8,8) content-size 115.828125x124.9375 [BFC] children: not-inline
Box <table> at (13,13) content-size 105.828125x114.9375 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tbody> at (13,13) content-size 99.828125x108.9375 table-row-group children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tr> at (15,15) content-size 99.828125x54.46875 table-row children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <td> at (25,33.5) 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: [25,33.5 11.5625x17.46875]
"X"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <td> at (58.5625,25) content-size 48.265625x90.9375 table-cell [BFC] children: not-inline
BlockContainer <(anonymous)> at (58.5625,25) content-size 48.265625x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (58.5625,25) content-size 48.265625x90.9375 [BFC] children: not-inline
Box <table> at (63.5625,30) content-size 38.265625x80.9375 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tbody> at (63.5625,30) content-size 34.265625x74.9375 table-row-group children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tr> at (65.5625,32) content-size 34.265625x37.46875 table-row children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <td> at (75.5625,42) 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: [75.5625,42 14.265625x17.46875]
"A"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tr> at (65.5625,69.46875) content-size 34.265625x37.46875 table-row children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <td> at (75.5625,81.46875) 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: [75.5625,81.46875 9.34375x17.46875]
"B"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> at (58.5625,115.9375) content-size 48.265625x0 children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tr> at (15,69.46875) content-size 99.828125x54.46875 table-row children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <td> at (25,89.96875) content-size 11.5625x17.46875 table-cell [BFC] children: inline
line 0 width: 11.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [25,89.96875 11.09375x17.46875]
"Y"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> at (8,132.9375) content-size 784x0 children: inline
TextNode <#text>

18
Tests/LibWeb/Layout/expected/table/row-span-and-nested-tables.txt
View file

@ -5,14 +5,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <body> at (8,8) content-size 784x116.40625 children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (8,8) content-size 71.828125x116.40625 [BFC] children: not-inline
Box <table> at (9,9) content-size 71.828125x114.40625 table-box [TFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 75.828125x116.40625 [BFC] children: not-inline
Box <table> at (9,9) content-size 73.828125x114.40625 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tbody> at (9,9) content-size 65.828125x108.40625 table-row-group children: not-inline
Box <tbody> at (9,9) content-size 67.828125x108.40625 table-row-group children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tr> at (11,11) content-size 65.828125x54.203125 table-row children: not-inline
Box <tr> at (11,11) content-size 67.828125x54.203125 table-row children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <td> at (17,29.367187) content-size 11.5625x17.46875 table-cell [BFC] children: inline
@ -22,10 +22,10 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <td> at (42.5625,17) content-size 30.265625x98.40625 table-cell [BFC] children: not-inline
BlockContainer <(anonymous)> at (42.5625,17) content-size 30.265625x0 children: inline
BlockContainer <td> at (42.5625,17) content-size 32.265625x98.40625 table-cell [BFC] children: not-inline
BlockContainer <(anonymous)> at (42.5625,17) content-size 32.265625x0 children: inline
TextNode <#text>
TableWrapper <(anonymous)> at (42.5625,17) content-size 30.265625x98.40625 [BFC] children: not-inline
TableWrapper <(anonymous)> at (42.5625,17) content-size 32.265625x98.40625 [BFC] children: not-inline
Box <table> at (43.5625,18) content-size 30.265625x96.40625 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
@ -70,13 +70,13 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> at (42.5625,115.40625) content-size 30.265625x0 children: inline
BlockContainer <(anonymous)> at (42.5625,115.40625) content-size 32.265625x0 children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
Box <tr> at (11,65.203125) content-size 65.828125x54.203125 table-row children: not-inline
Box <tr> at (11,65.203125) content-size 67.828125x54.203125 table-row children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>
BlockContainer <td> at (17,85.570312) content-size 11.5625x17.46875 table-cell [BFC] children: inline

2
Tests/LibWeb/Layout/expected/table/stretch-to-fixed-height.txt
View file

@ -1,7 +1,7 @@
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 784x122 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 2x122 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 24x122 [BFC] children: not-inline
Box <table> at (19,19) content-size 2x100 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/table-formation-with-rowspan-in-the-middle.txt
View file

@ -1,7 +1,7 @@
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 101.421875x159.875 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 103.421875x159.875 [BFC] children: not-inline
Box <table> at (9,9) content-size 101.421875x157.875 table-box [TFC] children: not-inline
BlockContainer <(anonymous)> (not painted) children: inline
TextNode <#text>

2
Tests/LibWeb/Layout/expected/table/table-width.txt
View file

@ -1,7 +1,7 @@
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 784x214 children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 584x214 [BFC] children: not-inline
TableWrapper <(anonymous)> at (8,8) content-size 784x214 [BFC] children: not-inline
Box <table.table> at (108,108) content-size 584x14 table-box [TFC] children: not-inline
Box <tbody> at (108,108) content-size 580x10 table-row-group children: not-inline
Box <tr> at (110,110) content-size 580x10 table-row children: not-inline

46
Tests/LibWeb/Layout/input/table/nested-table-box-width.html Normal file
View file

@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Rowspan interaction with nested tables</title>
<style>
table {
border: 5px solid black;
border-spacing: 2px;
}
td {
border: 5px solid blue;
padding: 5px;
}
</style>
</head>
<body>
<table>
<tbody>
<tr>
<td>X</td>
<td rowspan="2">
<table>
<tbody>
<tr>
<td>A</td>
</tr>
<tr>
<td>B</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td>Y</td>
</tr>
</tbody>
</table>
</body>
</html>

2
Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp
View file

@ -437,7 +437,7 @@ CSSPixels BlockFormattingContext::compute_table_box_width_inside_table_wrapper(B
});
VERIFY(table_box.has_value());
auto table_used_width = throwaway_state.get(*table_box).content_width();
auto table_used_width = throwaway_state.get(*table_box).border_box_width();
return available_space.width.is_definite() ? min(table_used_width, available_width) : table_used_width;
}