mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Fix table with rows but no column (#31862)
* Fix table with rows but no column We weren't generating any fragment for the rows, which meant that JS APIs like clientWidth would be 0, and also outlines weren't painted. This aligns Servo with Blink and WebKit. Gecko is broken, it distributes twice the table height among the rows. * Feedback * Avoid conflict with #31874
This commit is contained in:
Oriol Brufau
GitHub
parent
68b0be6dc7
commit
d16f259e1d
6 changed files with 126 additions and 43 deletions
|
|
@ -1423,7 +1423,7 @@ impl<'a> TableLayout<'a> {
|
|||
let mut baselines = Baselines::default();
|
||||
let mut table_fragments = Vec::new();
|
||||
|
||||
if self.table.size.width == 0 || self.table.size.height == 0 {
|
||||
if self.table.size.width == 0 && self.table.size.height == 0 {
|
||||
return IndependentLayout {
|
||||
fragments: table_fragments,
|
||||
content_block_size: self.final_table_height,
|
||||
|
|
@ -1794,8 +1794,16 @@ impl TableAndTrackDimensions {
|
|||
fn new(table_layout: &TableLayout) -> Self {
|
||||
let border_spacing = table_layout.table.border_spacing();
|
||||
|
||||
// The sizes used for a dimension when that dimension has no table tracks.
|
||||
let fallback_inline_size = table_layout.assignable_width;
|
||||
let fallback_block_size = table_layout.final_table_height;
|
||||
|
||||
let mut column_dimensions = Vec::new();
|
||||
let mut column_offset = border_spacing.inline;
|
||||
let mut column_offset = if table_layout.table.size.width == 0 {
|
||||
fallback_inline_size
|
||||
} else {
|
||||
border_spacing.inline
|
||||
};
|
||||
for column_index in 0..table_layout.table.size.width {
|
||||
let column_size = table_layout.distributed_column_widths[column_index];
|
||||
column_dimensions.push((column_offset, column_offset + column_size));
|
||||
|
|
@ -1803,7 +1811,11 @@ impl TableAndTrackDimensions {
|
|||
}
|
||||
|
||||
let mut row_dimensions = Vec::new();
|
||||
let mut row_offset = border_spacing.block;
|
||||
let mut row_offset = if table_layout.table.size.height == 0 {
|
||||
fallback_block_size
|
||||
} else {
|
||||
border_spacing.block
|
||||
};
|
||||
for row_index in 0..table_layout.table.size.height {
|
||||
let row_size = table_layout.row_sizes[row_index];
|
||||
row_dimensions.push((row_offset, row_offset + row_size));
|
||||
|
|
@ -1811,12 +1823,14 @@ impl TableAndTrackDimensions {
|
|||
}
|
||||
|
||||
let table_start_corner = LogicalVec2 {
|
||||
inline: column_dimensions[0].0,
|
||||
block: row_dimensions[0].0,
|
||||
inline: column_dimensions.first().map_or_else(Au::zero, |v| v.0),
|
||||
block: row_dimensions.first().map_or_else(Au::zero, |v| v.0),
|
||||
};
|
||||
let table_size = &LogicalVec2 {
|
||||
inline: column_dimensions[column_dimensions.len() - 1].1,
|
||||
block: row_dimensions[row_dimensions.len() - 1].1,
|
||||
inline: column_dimensions
|
||||
.last()
|
||||
.map_or(fallback_inline_size, |v| v.1),
|
||||
block: row_dimensions.last().map_or(fallback_block_size, |v| v.1),
|
||||
} - &table_start_corner;
|
||||
let table_cells_rect = LogicalRect {
|
||||
start_corner: table_start_corner,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,36 @@
|
|||
[table-rows-with-zero-columns.html]
|
||||
[tr 1]
|
||||
expected: FAIL
|
||||
|
||||
[tr 2]
|
||||
expected: FAIL
|
||||
|
||||
[tr 3]
|
||||
expected: FAIL
|
||||
|
||||
[tr 4]
|
||||
expected: FAIL
|
||||
|
||||
[tr 5]
|
||||
expected: FAIL
|
||||
|
||||
[tr 6]
|
||||
expected: FAIL
|
||||
|
||||
[tr 7]
|
||||
expected: FAIL
|
||||
|
||||
[tr 8]
|
||||
expected: FAIL
|
||||
|
||||
[tr 9]
|
||||
expected: FAIL
|
||||
|
||||
[tr 10]
|
||||
expected: FAIL
|
||||
|
||||
[tr 11]
|
||||
expected: FAIL
|
||||
|
||||
[tr 12]
|
||||
expected: FAIL
|
||||
|
|
@ -545267,6 +545267,13 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"table-rows-with-zero-columns.html": [
|
||||
"da9e0098a7a1e6657887539448c5e1b2c1f14b5b",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"table-width-redistribution-fixed-padding.html": [
|
||||
"097ddacfc3139105f0d80689e0c03ac722a00aeb",
|
||||
[
|
||||
|
|
|
|||
|
|
@ -7,6 +7,3 @@
|
|||
|
||||
[.container 13]
|
||||
expected: FAIL
|
||||
|
||||
[.container 3]
|
||||
expected: FAIL
|
||||
|
|
|
|||
|
|
@ -2,39 +2,9 @@
|
|||
[table 5]
|
||||
expected: FAIL
|
||||
|
||||
[table 6]
|
||||
expected: FAIL
|
||||
|
||||
[table 7]
|
||||
expected: FAIL
|
||||
|
||||
[table 8]
|
||||
expected: FAIL
|
||||
|
||||
[table 9]
|
||||
expected: FAIL
|
||||
|
||||
[table 10]
|
||||
expected: FAIL
|
||||
|
||||
[table 11]
|
||||
expected: FAIL
|
||||
|
||||
[table 12]
|
||||
expected: FAIL
|
||||
|
||||
[table 13]
|
||||
expected: FAIL
|
||||
|
||||
[table 14]
|
||||
expected: FAIL
|
||||
|
||||
[table 15]
|
||||
expected: FAIL
|
||||
|
||||
[table 16]
|
||||
expected: FAIL
|
||||
|
||||
[table 17]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -53,9 +23,6 @@
|
|||
[table 22]
|
||||
expected: FAIL
|
||||
|
||||
[table 23]
|
||||
expected: FAIL
|
||||
|
||||
[table 25]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,62 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: size of table rows when the table has no columns</title>
|
||||
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-tables-3/">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/10132">
|
||||
<meta name="assert" content="If a table has rows but no columns, the rows are as wide as the inner width of the table.">
|
||||
|
||||
<style>
|
||||
#tests table {
|
||||
box-sizing: border-box;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="log"></div>
|
||||
|
||||
<main id="tests">
|
||||
<table cellspacing="0">
|
||||
<tr data-expected-width="60" data-expected-height="60"></tr>
|
||||
</table>
|
||||
|
||||
<table cellspacing="0">
|
||||
<tr data-expected-width="60" data-expected-height="30"></tr>
|
||||
<tr data-expected-width="60" data-expected-height="30"></tr>
|
||||
</table>
|
||||
|
||||
<table cellspacing="10">
|
||||
<tr data-expected-width="60" data-expected-height="40"></tr>
|
||||
</table>
|
||||
|
||||
<table cellspacing="10">
|
||||
<tr data-expected-width="60" data-expected-height="15"></tr>
|
||||
<tr data-expected-width="60" data-expected-height="15"></tr>
|
||||
</table>
|
||||
|
||||
<table cellspacing="0" border="5">
|
||||
<tr data-expected-width="50" data-expected-height="50"></tr>
|
||||
</table>
|
||||
|
||||
<table cellspacing="0" border="5">
|
||||
<tr data-expected-width="50" data-expected-height="25"></tr>
|
||||
<tr data-expected-width="50" data-expected-height="25"></tr>
|
||||
</table>
|
||||
|
||||
<table cellspacing="10" border="5">
|
||||
<tr data-expected-width="50" data-expected-height="30"></tr>
|
||||
</table>
|
||||
|
||||
<table cellspacing="10" border="5">
|
||||
<tr data-expected-width="50" data-expected-height="10"></tr>
|
||||
<tr data-expected-width="50" data-expected-height="10"></tr>
|
||||
</table>
|
||||
</main>
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<script>
|
||||
checkLayout("tr");
|
||||
</script>
|
||||
Loading…
Add table
Add a link
Reference in a new issue