Handle aspect ratios in ReplacedContent::inline_content_sizes (#33240)

We were only handling the aspect ratio of a replaced element when
computing its min/max-content contribution, but not when computing
the min/max-content size. Now both cases will take it into account.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
Oriol Brufau 2024-08-29 17:38:59 +02:00 committed by GitHub
parent 3f93de7f54
commit 0643aa4708
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 39 additions and 59 deletions

View file

@ -346,6 +346,7 @@ impl FlexContainer {
&ifc.style().clone(),
&LogicalVec2::zero(),
),
containing_block_for_children,
));
},
FlexLevelBox::OutOfFlowAbsolutelyPositionedBox(_) => {},
@ -955,6 +956,7 @@ impl<'a> FlexItem<'a> {
main: flex_relative_content_min_size.main.auto_is(|| {
box_.automatic_min_size(
flex_context.layout_context,
&containing_block.into(),
cross_axis_is_item_block_axis,
flex_relative_content_box_size,
flex_relative_content_min_size,
@ -989,6 +991,7 @@ impl<'a> FlexItem<'a> {
let (flex_base_size, flex_base_size_is_definite) = box_.flex_base_size(
flex_context.layout_context,
&containing_block.into(),
flex_context.container_definite_inner_size,
cross_axis_is_item_block_axis,
flex_relative_content_box_size,
@ -1913,6 +1916,7 @@ impl FlexItemBox {
style.content_box_sizes_and_padding_border_margin(containing_block);
let automatic_min_size = self.automatic_min_size(
layout_context,
containing_block,
cross_axis_is_item_block_axis,
flex_axis.vec2_to_flex_relative(content_box_size),
flex_axis.vec2_to_flex_relative(content_min_size),
@ -1984,6 +1988,7 @@ impl FlexItemBox {
// we compute the base sizes of the items twice. We should consider caching.
let (flex_base_size, _) = self.flex_base_size(
layout_context,
containing_block,
FlexRelativeVec2 {
main: None,
cross: None,
@ -2091,6 +2096,7 @@ impl FlexItemBox {
fn automatic_min_size(
&mut self,
layout_context: &LayoutContext,
containing_block: &IndefiniteContainingBlock,
cross_axis_is_item_block_axis: bool,
content_box_size: FlexRelativeVec2<AuOrAuto>,
min_size: FlexRelativeVec2<GenericLengthPercentageOrAuto<Au>>,
@ -2159,7 +2165,11 @@ impl FlexItemBox {
let containing_block_for_children =
IndefiniteContainingBlock::new_for_style_and_block_size(&style, block_size);
self.independent_formatting_context
.inline_content_sizes(layout_context, &containing_block_for_children)
.inline_content_sizes(
layout_context,
&containing_block_for_children,
containing_block,
)
.min_content
} else {
block_content_size_callback(self)
@ -2191,6 +2201,7 @@ impl FlexItemBox {
fn flex_base_size(
&mut self,
layout_context: &LayoutContext,
containing_block: &IndefiniteContainingBlock,
container_definite_inner_size: FlexRelativeVec2<Option<Au>>,
cross_axis_is_item_block_axis: bool,
content_box_size: FlexRelativeVec2<AuOrAuto>,
@ -2276,7 +2287,11 @@ impl FlexItemBox {
let containing_block_for_children =
IndefiniteContainingBlock::new_for_style_and_block_size(&style, block_size);
flex_item
.inline_content_sizes(layout_context, &containing_block_for_children)
.inline_content_sizes(
layout_context,
&containing_block_for_children,
containing_block,
)
.max_content
} else {
block_content_size_callback(self)

View file

@ -5,7 +5,6 @@
use app_units::Au;
use serde::Serialize;
use servo_arc::Arc;
use style::logical_geometry::Direction;
use style::properties::ComputedValues;
use style::selector_parser::PseudoElement;
use style::values::specified::text::TextDecorationLine;
@ -180,14 +179,17 @@ impl IndependentFormattingContext {
&mut self,
layout_context: &LayoutContext,
containing_block_for_children: &IndefiniteContainingBlock,
containing_block: &IndefiniteContainingBlock,
) -> ContentSizes {
match self {
Self::NonReplaced(inner) => {
inner.inline_content_sizes(layout_context, containing_block_for_children)
},
Self::Replaced(inner) => inner
.contents
.inline_content_sizes(layout_context, containing_block_for_children),
Self::Replaced(inner) => inner.contents.inline_content_sizes(
layout_context,
containing_block_for_children,
inner.preferred_aspect_ratio(containing_block),
),
}
}
@ -211,20 +213,11 @@ impl IndependentFormattingContext {
containing_block,
auto_minimum,
|containing_block_for_children| {
match (
containing_block_for_children.size.block,
replaced.contents.inline_content_sizes(
layout_context,
containing_block_for_children,
replaced.preferred_aspect_ratio(containing_block),
) {
(AuOrAuto::LengthPercentage(block_size), Some(ratio)) => {
return ratio
.compute_dependent_size(Direction::Inline, block_size)
.into();
},
_ => {},
}
replaced
.contents
.inline_content_sizes(layout_context, containing_block_for_children)
)
},
),
}

View file

@ -255,15 +255,22 @@ impl ReplacedContent {
&self,
_: &LayoutContext,
containing_block_for_children: &IndefiniteContainingBlock,
preferred_aspect_ratio: Option<AspectRatio>,
) -> ContentSizes {
// FIXME: min/max-content of replaced elements is not defined in
// https://dbaron.org/css/intrinsic/
// This seems sensible?
self.flow_relative_intrinsic_size(containing_block_for_children.style)
let block_size = containing_block_for_children.size.block;
let inline_size = match (block_size, preferred_aspect_ratio) {
(AuOrAuto::LengthPercentage(block_size), Some(ratio)) => {
ratio.compute_dependent_size(Direction::Inline, block_size)
},
_ => self
.flow_relative_intrinsic_size(containing_block_for_children.style)
.inline
.unwrap_or(Au::zero())
.into()
.unwrap_or_else(Au::zero),
};
inline_size.into()
}
pub fn make_fragments(

View file

@ -1,7 +1,4 @@
[flex-aspect-ratio-img-column-011.html]
[.flexbox 5]
expected: FAIL
[.flexbox 7]
expected: FAIL

View file

@ -1,9 +1,3 @@
[flex-aspect-ratio-img-row-005.html]
[img 1]
expected: FAIL
[img 2]
expected: FAIL
[img 3]
expected: FAIL

View file

@ -1,7 +1,4 @@
[image-as-flexitem-size-001.html]
[.flexbox > img 3]
expected: FAIL
[.flexbox > img 4]
expected: FAIL

View file

@ -13,6 +13,3 @@
[.flexbox > img 6]
expected: FAIL
[.flexbox > img 3]
expected: FAIL

View file

@ -19,6 +19,3 @@
[.flexbox > img 10]
expected: FAIL
[.flexbox > img 3]
expected: FAIL

View file

@ -19,6 +19,3 @@
[.flexbox > img 10]
expected: FAIL
[.flexbox > img 3]
expected: FAIL

View file

@ -1,7 +1,4 @@
[image-as-flexitem-size-007.html]
[.flexbox > img 3]
expected: FAIL
[.flexbox > img 4]
expected: FAIL

View file

@ -13,6 +13,3 @@
[.flexbox > img 6]
expected: FAIL
[.flexbox > img 3]
expected: FAIL

View file

@ -1,2 +0,0 @@
[flex-aspect-ratio-017.html]
expected: FAIL

View file

@ -1,6 +0,0 @@
[percentage-height-in-flexbox.html]
[#target offsetSize matches #container offsetSize]
expected: FAIL
[#target offsetSize matches #container offsetSize after resize]
expected: FAIL