diff options
4 files changed, 61 insertions, 4 deletions
diff --git a/components/layout_2020/flow/inline.rs b/components/layout_2020/flow/inline.rs index 7f31faf1e26..1ef642a4405 100644 --- a/components/layout_2020/flow/inline.rs +++ b/components/layout_2020/flow/inline.rs @@ -101,7 +101,9 @@ use crate::cell::ArcRefCell; use crate::context::LayoutContext; use crate::flow::float::{FloatBox, SequentialLayoutState}; use crate::flow::FlowLayout; -use crate::formatting_contexts::{Baselines, IndependentFormattingContext}; +use crate::formatting_contexts::{ + Baselines, IndependentFormattingContext, NonReplacedFormattingContextContents, +}; use crate::fragment_tree::{ BaseFragmentInfo, BoxFragment, CollapsedBlockMargins, CollapsedMargin, Fragment, FragmentFlags, PositioningFragment, @@ -2114,9 +2116,8 @@ impl IndependentFormattingContext { } let size = &pbm_sums.sum().into() + &fragment.content_rect.size; - let baseline_offset = fragment - .baselines - .last + let baseline_offset = self + .pick_baseline(&fragment.baselines) .map(|baseline| pbm_sums.block_start + baseline) .unwrap_or(size.block.into()); @@ -2139,6 +2140,18 @@ impl IndependentFormattingContext { ifc.have_deferred_soft_wrap_opportunity = true; } + /// Picks either the first or the last baseline, depending on `baseline-source`. + /// <https://drafts.csswg.org/css-inline/#baseline-source> + fn pick_baseline(&self, baselines: &Baselines) -> Option<Au> { + // TODO: Currently this only supports the initial `baseline-source: auto`. + if let Self::NonReplaced(non_replaced) = self { + if let NonReplacedFormattingContextContents::Flow(_) = non_replaced.contents { + return baselines.last; + } + } + baselines.first + } + fn get_block_sizes_and_baseline_offset( &self, ifc: &InlineFormattingContextState, diff --git a/tests/wpt/meta-legacy-layout/css/CSS2/tables/table-vertical-align-baseline-009.xht.ini b/tests/wpt/meta-legacy-layout/css/CSS2/tables/table-vertical-align-baseline-009.xht.ini new file mode 100644 index 00000000000..cd3d748b4ac --- /dev/null +++ b/tests/wpt/meta-legacy-layout/css/CSS2/tables/table-vertical-align-baseline-009.xht.ini @@ -0,0 +1,2 @@ +[table-vertical-align-baseline-009.xht] + expected: FAIL diff --git a/tests/wpt/meta/MANIFEST.json b/tests/wpt/meta/MANIFEST.json index 034edff4a33..8f2a771f74c 100644 --- a/tests/wpt/meta/MANIFEST.json +++ b/tests/wpt/meta/MANIFEST.json @@ -106880,6 +106880,19 @@ {} ] ], + "table-vertical-align-baseline-009.xht": [ + "4620848ddc19661b5ddfaa34cefc9c9eee266dcb", + [ + null, + [ + [ + "/css/CSS2/reference/ref-filled-green-100px-square.xht", + "==" + ] + ], + {} + ] + ], "table-visual-layout-017.xht": [ "25067cb68385a520a10a31949d742b520c7e9cd6", [ diff --git a/tests/wpt/tests/css/CSS2/tables/table-vertical-align-baseline-009.xht b/tests/wpt/tests/css/CSS2/tables/table-vertical-align-baseline-009.xht new file mode 100644 index 00000000000..4620848ddc1 --- /dev/null +++ b/tests/wpt/tests/css/CSS2/tables/table-vertical-align-baseline-009.xht @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Test for baseline alignment of table cells</title> + <link rel="author" title="Oriol Brufau" href="obrufau@igalia.com" /> + <link rel="help" href="https://github.com/servo/servo/issues/31651" /> + <link rel="help" href="https://drafts.csswg.org/css2/#height-layout" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + <meta name="assert" content="The baseline of the table should be aligned with the baseline of the cell in the first row." /> + <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> + <style><![CDATA[ + span { + font: 50px/1 Ahem; + color: green; + } + ]]></style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div style="float: left; position: relative; font-size: 0; background: red"> + <span style="position: absolute; left: 0; bottom: 0">X</span> + <span>X</span> + <span style="display: inline-table"> + <span style="display: table-row">X</span> + <span style="display: table-row">X</span> + </span> + </div> + </body> +</html> |