Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-06 06:00:15 +01:00
Code Issues Projects Releases Packages Wiki Activity

layout: Zero out collapsed track sizes when painting collapsed borders (#35165)

Browse source 
We were painting collapsed borders without taking into account that some
tracks might have been "removed" by `visibility: collapse`.

This just sets the sizes of these tracks to zero. Note this implies that
collapsed borders may overlap each other, or overlap cell contents, but
this seems to match Blink.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
Oriol Brufau 2025-01-27 12:40:26 -08:00 • committed by GitHub
parent 38847d4991
commit 7977357a57
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 92 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

14
components/layout_2020/table/layout.rs
View file

@ -1931,11 +1931,23 @@ impl<'a> TableLayout<'a> {
fn specific_layout_info_for_grid(&mut self) -> Option<SpecificLayoutInfo> { fn specific_layout_info_for_grid(&mut self) -> Option<SpecificLayoutInfo> {
mem::take(&mut self.collapsed_borders).map(|mut collapsed_borders| { mem::take(&mut self.collapsed_borders).map(|mut collapsed_borders| {
let writing_mode = self.table.style.writing_mode; // TODO: It would probably be better to use `TableAndTrackDimensions`, since that
// has already taken care of collapsed tracks and knows the final track positions.
let mut track_sizes = LogicalVec2 { let mut track_sizes = LogicalVec2 {
inline: mem::take(&mut self.distributed_column_widths), inline: mem::take(&mut self.distributed_column_widths),
block: mem::take(&mut self.row_sizes), block: mem::take(&mut self.row_sizes),
}; };
for (column_index, column_size) in track_sizes.inline.iter_mut().enumerate() {
if self.is_column_collapsed(column_index) {
mem::take(column_size);
}
}
for (row_index, row_size) in track_sizes.block.iter_mut().enumerate() {
if self.is_row_collapsed(row_index) {
mem::take(row_size);
}
}
let writing_mode = self.table.style.writing_mode;
if !writing_mode.is_bidi_ltr() { if !writing_mode.is_bidi_ltr() {
track_sizes.inline.reverse(); track_sizes.inline.reverse();
collapsed_borders.inline.reverse(); collapsed_borders.inline.reverse();

26
tests/wpt/meta/MANIFEST.json vendored
View file

@ -105658,6 +105658,32 @@
{} {}
] ]
], ],
"border-collapse-visibility-collapse-001.tentative.html": [
"d2d6e9242b98eb82e41a90b865b3e0f4204d4464",
[
null,
[
[
"/css/CSS2/reference/ref-filled-green-100px-square.xht",
"=="
]
],
{}
]
],
"border-collapse-visibility-collapse-002.tentative.html": [
"582934960946f65b2aa4f076e1ad4c3320e2352f",
[
null,
[
[
"/css/CSS2/reference/ref-filled-green-100px-square.xht",
"=="
]
],
{}
]
],
"border-conflict-element-001a.xht": [ "border-conflict-element-001a.xht": [
"585957f13b22ec2d0208f07deb127698d15ddea5", "585957f13b22ec2d0208f07deb127698d15ddea5",
[ [

21
tests/wpt/tests/css/CSS2/tables/border-collapse-visibility-collapse-001.tentative.html vendored Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<title>CSS Test: Table with collapsed borders and collapsed tracks</title>
<link rel="author" title="Oriol Brufau" href="obrufau@igalia.com">
<link rel="help" href="https://www.w3.org/TR/CSS21/tables.html#collapsing-borders">
<link rel="help" href="https://www.w3.org/TR/CSS21/tables.html#dynamic-effects">
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<style>
td { border: 50px solid green; padding: 0; }
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<table style="border-collapse: collapse; background: red">
<col style="visibility: collapse"></col>
<tr style="visibility: collapse">
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>

32
tests/wpt/tests/css/CSS2/tables/border-collapse-visibility-collapse-002.tentative.html vendored Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<title>CSS Test: Table with collapsed borders and collapsed tracks</title>
<link rel="author" title="Oriol Brufau" href="obrufau@igalia.com">
<link rel="help" href="https://www.w3.org/TR/CSS21/tables.html#collapsing-borders">
<link rel="help" href="https://www.w3.org/TR/CSS21/tables.html#dynamic-effects">
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<style>
td { padding: 0; }
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<table style="border-collapse: collapse; background: red; min-width: 100px">
<colgroup>
<col style="border-right: 100px solid green"></col>
<col style="visibility: collapse"></col>
<col style="border-left: 100px solid green"></col>
</colgroup>
<tr style="border-bottom: 100px solid green">
<td></td>
<td></td>
<td></td>
</tr>
<tr style="visibility: collapse">
<td></td>
<td></td>
<td></td>
</tr>
<tr style="border-top: 100px solid green">
<td></td>
<td></td>
<td></td>
</tr>
</table>