use app unit in replaced elements (#31178)

* use app unit in replaced elements

* more app unit usage

* Avoid unnecessary into()

* Run ./mach fmt

* use scaleby

* update

---------

Co-authored-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
atbrakhi 2024-01-29 10:21:52 +01:00 committed by GitHub
parent 271176094d
commit 091653417a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 82 additions and 70 deletions

View file

@ -1082,7 +1082,7 @@ impl<'a> FlexItem<'a> {
let cross_size = flex_context.vec2_to_flex_relative(size.clone()).cross; let cross_size = flex_context.vec2_to_flex_relative(size.clone()).cross;
let fragments = replaced.contents.make_fragments(&replaced.style, size); let fragments = replaced.contents.make_fragments(&replaced.style, size);
FlexItemLayoutResult { FlexItemLayoutResult {
hypothetical_cross_size: cross_size, hypothetical_cross_size: cross_size.into(),
fragments, fragments,
positioning_context, positioning_context,
} }

View file

@ -951,15 +951,18 @@ impl FloatBox {
IndependentFormattingContext::Replaced(ref replaced) => { IndependentFormattingContext::Replaced(ref replaced) => {
// https://drafts.csswg.org/css2/#float-replaced-width // https://drafts.csswg.org/css2/#float-replaced-width
// https://drafts.csswg.org/css2/#inline-replaced-height // https://drafts.csswg.org/css2/#inline-replaced-height
content_size = replaced.contents.used_size_as_if_inline_element( content_size = replaced
containing_block, .contents
&replaced.style, .used_size_as_if_inline_element(
None, containing_block,
&pbm, &replaced.style,
); None,
&pbm,
)
.into();
children = replaced children = replaced
.contents .contents
.make_fragments(&replaced.style, content_size.clone()); .make_fragments(&replaced.style, content_size.clone().into());
}, },
}; };

View file

@ -1779,7 +1779,7 @@ impl IndependentFormattingContext {
.make_fragments(&replaced.style, size.clone()); .make_fragments(&replaced.style, size.clone());
let content_rect = LogicalRect { let content_rect = LogicalRect {
start_corner: pbm_sums.start_offset(), start_corner: pbm_sums.start_offset(),
size, size: size.into(),
}; };
BoxFragment::new( BoxFragment::new(

View file

@ -1151,14 +1151,14 @@ fn layout_in_flow_replaced_block_level<'a>(
// than defined by section 10.3.3. CSS 2 does not define when a UA may put said // than defined by section 10.3.3. CSS 2 does not define when a UA may put said
// element next to the float or by how much said element may become narrower." // element next to the float or by how much said element may become narrower."
let collapsed_margin_block_start = CollapsedMargin::new(margin_block_start); let collapsed_margin_block_start = CollapsedMargin::new(margin_block_start);
let size = &content_size + &pbm.padding_border_sums; let size = &content_size + &pbm.padding_border_sums.clone().into();
(clearance, (margin_inline_start, margin_inline_end)) = (clearance, (margin_inline_start, margin_inline_end)) =
solve_clearance_and_inline_margins_avoiding_floats( solve_clearance_and_inline_margins_avoiding_floats(
sequential_layout_state, sequential_layout_state,
containing_block, containing_block,
&collapsed_margin_block_start, &collapsed_margin_block_start,
&pbm, &pbm,
size.clone(), size.clone().into(),
style, style,
); );
@ -1172,14 +1172,14 @@ fn layout_in_flow_replaced_block_level<'a>(
// Margins can never collapse into replaced elements. // Margins can never collapse into replaced elements.
sequential_layout_state.collapse_margins(); sequential_layout_state.collapse_margins();
sequential_layout_state sequential_layout_state
.advance_block_position((size.block + clearance.unwrap_or_else(Length::zero)).into()); .advance_block_position(size.block + clearance.unwrap_or_else(Length::zero).into());
sequential_layout_state.adjoin_assign(&CollapsedMargin::new(margin_block_end)); sequential_layout_state.adjoin_assign(&CollapsedMargin::new(margin_block_end));
} else { } else {
clearance = None; clearance = None;
(margin_inline_start, margin_inline_end) = solve_inline_margins_for_in_flow_block_level( (margin_inline_start, margin_inline_end) = solve_inline_margins_for_in_flow_block_level(
containing_block, containing_block,
&pbm, &pbm,
content_size.inline, content_size.inline.into(),
); );
}; };
@ -1199,7 +1199,7 @@ fn layout_in_flow_replaced_block_level<'a>(
let content_rect = LogicalRect { let content_rect = LogicalRect {
start_corner, start_corner,
size: content_size, size: content_size.into(),
}; };
let block_margins_collapsed_with_children = CollapsedBlockMargins::from_margin(&margin); let block_margins_collapsed_with_children = CollapsedBlockMargins::from_margin(&margin);
BoxFragment::new( BoxFragment::new(

View file

@ -488,8 +488,8 @@ impl HoistedAbsolutelyPositionedBox {
&pbm, &pbm,
); );
LogicalVec2 { LogicalVec2 {
inline: LengthOrAuto::LengthPercentage(used_size.inline), inline: LengthOrAuto::LengthPercentage(used_size.inline.into()),
block: LengthOrAuto::LengthPercentage(used_size.block), block: LengthOrAuto::LengthPercentage(used_size.block.into()),
} }
}, },
IndependentFormattingContext::NonReplaced(non_replaced) => non_replaced IndependentFormattingContext::NonReplaced(non_replaced) => non_replaced
@ -536,7 +536,7 @@ impl HoistedAbsolutelyPositionedBox {
content_size = computed_size.auto_is(|| unreachable!()); content_size = computed_size.auto_is(|| unreachable!());
fragments = replaced fragments = replaced
.contents .contents
.make_fragments(style, content_size.clone()); .make_fragments(style, content_size.clone().into());
}, },
IndependentFormattingContext::NonReplaced(non_replaced) => { IndependentFormattingContext::NonReplaced(non_replaced) => {
// https://drafts.csswg.org/css2/#min-max-widths // https://drafts.csswg.org/css2/#min-max-widths

View file

@ -26,7 +26,7 @@ use crate::dom::NodeExt;
use crate::fragment_tree::{BaseFragmentInfo, Fragment, IFrameFragment, ImageFragment}; use crate::fragment_tree::{BaseFragmentInfo, Fragment, IFrameFragment, ImageFragment};
use crate::geom::{LogicalRect, LogicalVec2, PhysicalSize}; use crate::geom::{LogicalRect, LogicalVec2, PhysicalSize};
use crate::sizing::ContentSizes; use crate::sizing::ContentSizes;
use crate::style_ext::{ComputedValuesExt, PaddingBorderMargin}; use crate::style_ext::{Clamp, ComputedValuesExt, PaddingBorderMargin};
use crate::ContainingBlock; use crate::ContainingBlock;
#[derive(Debug, Serialize)] #[derive(Debug, Serialize)]
@ -209,11 +209,8 @@ impl ReplacedContent {
} }
} }
fn flow_relative_intrinsic_size(&self, style: &ComputedValues) -> LogicalVec2<Option<Length>> { fn flow_relative_intrinsic_size(&self, style: &ComputedValues) -> LogicalVec2<Option<Au>> {
let intrinsic_size = PhysicalSize::new( let intrinsic_size = PhysicalSize::new(self.intrinsic.width, self.intrinsic.height);
self.intrinsic.width.map(|v| v.into()),
self.intrinsic.height.map(|v| v.into()),
);
LogicalVec2::from_physical_size(&intrinsic_size, style.writing_mode) LogicalVec2::from_physical_size(&intrinsic_size, style.writing_mode)
} }
@ -237,17 +234,17 @@ impl ReplacedContent {
let inline = self let inline = self
.flow_relative_intrinsic_size(style) .flow_relative_intrinsic_size(style)
.inline .inline
.unwrap_or(Length::zero()); .unwrap_or(Au::zero());
ContentSizes { ContentSizes {
min_content: inline.into(), min_content: inline,
max_content: inline.into(), max_content: inline,
} }
} }
pub fn make_fragments( pub fn make_fragments(
&self, &self,
style: &ServoArc<ComputedValues>, style: &ServoArc<ComputedValues>,
size: LogicalVec2<Length>, size: LogicalVec2<Au>,
) -> Vec<Fragment> { ) -> Vec<Fragment> {
match &self.kind { match &self.kind {
ReplacedContentKind::Image(image) => image ReplacedContentKind::Image(image) => image
@ -259,7 +256,7 @@ impl ReplacedContent {
style: style.clone(), style: style.clone(),
rect: LogicalRect { rect: LogicalRect {
start_corner: LogicalVec2::zero(), start_corner: LogicalVec2::zero(),
size, size: size.into(),
}, },
image_key, image_key,
}) })
@ -274,7 +271,7 @@ impl ReplacedContent {
browsing_context_id: iframe.browsing_context_id, browsing_context_id: iframe.browsing_context_id,
rect: LogicalRect { rect: LogicalRect {
start_corner: LogicalVec2::zero(), start_corner: LogicalVec2::zero(),
size, size: size.into(),
}, },
})] })]
}, },
@ -308,7 +305,7 @@ impl ReplacedContent {
style: style.clone(), style: style.clone(),
rect: LogicalRect { rect: LogicalRect {
start_corner: LogicalVec2::zero(), start_corner: LogicalVec2::zero(),
size, size: size.into(),
}, },
image_key, image_key,
})] })]
@ -327,7 +324,7 @@ impl ReplacedContent {
style: &ComputedValues, style: &ComputedValues,
box_size: Option<LogicalVec2<LengthOrAuto>>, box_size: Option<LogicalVec2<LengthOrAuto>>,
pbm: &PaddingBorderMargin, pbm: &PaddingBorderMargin,
) -> LogicalVec2<Length> { ) -> LogicalVec2<Au> {
let mode = style.writing_mode; let mode = style.writing_mode;
let intrinsic_size = self.flow_relative_intrinsic_size(style); let intrinsic_size = self.flow_relative_intrinsic_size(style);
let intrinsic_ratio = self.inline_size_over_block_size_intrinsic_ratio(style); let intrinsic_ratio = self.inline_size_over_block_size_intrinsic_ratio(style);
@ -350,35 +347,41 @@ impl ReplacedContent {
mode, mode,
) )
}; };
let clamp = |inline_size: Length, block_size: Length| LogicalVec2 { let clamp = |inline_size: Au, block_size: Au| LogicalVec2 {
inline: inline_size.clamp_between_extremums(min_box_size.inline, max_box_size.inline), inline: inline_size.clamp_between_extremums(
block: block_size.clamp_between_extremums(min_box_size.block, max_box_size.block), min_box_size.inline.into(),
max_box_size.inline.map(|t| t.into()),
),
block: block_size.clamp_between_extremums(
min_box_size.block.into(),
max_box_size.block.map(|t| t.into()),
),
}; };
// https://drafts.csswg.org/css2/visudet.html#min-max-widths // https://drafts.csswg.org/css2/visudet.html#min-max-widths
// https://drafts.csswg.org/css2/visudet.html#min-max-heights // https://drafts.csswg.org/css2/visudet.html#min-max-heights
match (box_size.inline, box_size.block) { match (box_size.inline, box_size.block) {
(LengthOrAuto::LengthPercentage(inline), LengthOrAuto::LengthPercentage(block)) => { (LengthOrAuto::LengthPercentage(inline), LengthOrAuto::LengthPercentage(block)) => {
clamp(inline, block) clamp(inline.into(), block.into())
}, },
(LengthOrAuto::LengthPercentage(inline), LengthOrAuto::Auto) => { (LengthOrAuto::LengthPercentage(inline), LengthOrAuto::Auto) => {
let block = if let Some(i_over_b) = intrinsic_ratio { let block = if let Some(i_over_b) = intrinsic_ratio {
inline / i_over_b inline / i_over_b
} else if let Some(block) = intrinsic_size.block { } else if let Some(block) = intrinsic_size.block {
block block.into()
} else { } else {
default_object_size().block default_object_size().block
}; };
clamp(inline, block) clamp(inline.into(), block.into())
}, },
(LengthOrAuto::Auto, LengthOrAuto::LengthPercentage(block)) => { (LengthOrAuto::Auto, LengthOrAuto::LengthPercentage(block)) => {
let inline = if let Some(i_over_b) = intrinsic_ratio { let inline = if let Some(i_over_b) = intrinsic_ratio {
block * i_over_b block * i_over_b
} else if let Some(inline) = intrinsic_size.inline { } else if let Some(inline) = intrinsic_size.inline {
inline inline.into()
} else { } else {
default_object_size().inline default_object_size().inline
}; };
clamp(inline, block) clamp(inline.into(), block.into())
}, },
(LengthOrAuto::Auto, LengthOrAuto::Auto) => { (LengthOrAuto::Auto, LengthOrAuto::Auto) => {
let inline_size = let inline_size =
@ -387,7 +390,7 @@ impl ReplacedContent {
(None, Some(block), Some(i_over_b)) => { (None, Some(block), Some(i_over_b)) => {
// “used height” in CSS 2 is always gonna be the intrinsic one, // “used height” in CSS 2 is always gonna be the intrinsic one,
// since it is available. // since it is available.
block * i_over_b block.scale_by(i_over_b)
}, },
// FIXME // FIXME
// //
@ -406,15 +409,15 @@ impl ReplacedContent {
// does not itself depend on the replaced element's width, // does not itself depend on the replaced element's width,
// then the used value of 'width' is calculated from the constraint // then the used value of 'width' is calculated from the constraint
// equation used for block-level, non-replaced elements in normal flow.” // equation used for block-level, non-replaced elements in normal flow.”
_ => default_object_size().inline, _ => default_object_size().inline.into(),
}; };
let block_size = if let Some(block) = intrinsic_size.block { let block_size = if let Some(block) = intrinsic_size.block {
block block
} else if let Some(i_over_b) = intrinsic_ratio { } else if let Some(i_over_b) = intrinsic_ratio {
// “used width” in CSS 2 is what we just computed above // “used width” in CSS 2 is what we just computed above
inline_size / i_over_b inline_size.scale_by(1.0 / i_over_b)
} else { } else {
default_object_size().block default_object_size().block.into()
}; };
let i_over_b = if let Some(i_over_b) = intrinsic_ratio { let i_over_b = if let Some(i_over_b) = intrinsic_ratio {
@ -431,15 +434,15 @@ impl ReplacedContent {
Below(Length), Below(Length),
Above(Length), Above(Length),
} }
let violation = |size, min_size, mut max_size: Option<Length>| { let violation = |size: Au, min_size, mut max_size: Option<Length>| {
if let Some(max) = max_size.as_mut() { if let Some(max) = max_size.as_mut() {
max.max_assign(min_size); max.max_assign(min_size);
} }
if size < min_size { if size < min_size.into() {
return Violation::Below(min_size); return Violation::Below(min_size);
} }
match max_size { match max_size {
Some(max_size) if size > max_size => Violation::Above(max_size), Some(max_size) if size > max_size.into() => Violation::Above(max_size),
_ => Violation::None, _ => Violation::None,
} }
}; };
@ -454,74 +457,80 @@ impl ReplacedContent {
}, },
// Row 2. // Row 2.
(Violation::Above(max_inline_size), Violation::None) => LogicalVec2 { (Violation::Above(max_inline_size), Violation::None) => LogicalVec2 {
inline: max_inline_size, inline: max_inline_size.into(),
block: (max_inline_size / i_over_b).max(min_box_size.block), block: (max_inline_size / i_over_b).max(min_box_size.block).into(),
}, },
// Row 3. // Row 3.
(Violation::Below(min_inline_size), Violation::None) => LogicalVec2 { (Violation::Below(min_inline_size), Violation::None) => LogicalVec2 {
inline: min_inline_size, inline: min_inline_size.into(),
block: (min_inline_size / i_over_b).clamp_below_max(max_box_size.block), block: (min_inline_size / i_over_b)
.clamp_below_max(max_box_size.block)
.into(),
}, },
// Row 4. // Row 4.
(Violation::None, Violation::Above(max_block_size)) => LogicalVec2 { (Violation::None, Violation::Above(max_block_size)) => LogicalVec2 {
inline: (max_block_size * i_over_b).max(min_box_size.inline), inline: (max_block_size * i_over_b).max(min_box_size.inline).into(),
block: max_block_size, block: max_block_size.into(),
}, },
// Row 5. // Row 5.
(Violation::None, Violation::Below(min_block_size)) => LogicalVec2 { (Violation::None, Violation::Below(min_block_size)) => LogicalVec2 {
inline: (min_block_size * i_over_b).clamp_below_max(max_box_size.inline), inline: (min_block_size * i_over_b)
block: min_block_size, .clamp_below_max(max_box_size.inline)
.into(),
block: min_block_size.into(),
}, },
// Rows 6-7. // Rows 6-7.
(Violation::Above(max_inline_size), Violation::Above(max_block_size)) => { (Violation::Above(max_inline_size), Violation::Above(max_block_size)) => {
if max_inline_size.px() / inline_size.px() <= if max_inline_size.px() / inline_size.to_f32_px() <=
max_block_size.px() / block_size.px() max_block_size.px() / block_size.to_f32_px()
{ {
// Row 6. // Row 6.
LogicalVec2 { LogicalVec2 {
inline: max_inline_size, inline: max_inline_size.into(),
block: (max_inline_size / i_over_b).max(min_box_size.block), block: (max_inline_size / i_over_b).max(min_box_size.block).into(),
} }
} else { } else {
// Row 7. // Row 7.
LogicalVec2 { LogicalVec2 {
inline: (max_block_size * i_over_b).max(min_box_size.inline), inline: (max_block_size * i_over_b).max(min_box_size.inline).into(),
block: max_block_size, block: max_block_size.into(),
} }
} }
}, },
// Rows 8-9. // Rows 8-9.
(Violation::Below(min_inline_size), Violation::Below(min_block_size)) => { (Violation::Below(min_inline_size), Violation::Below(min_block_size)) => {
if min_inline_size.px() / inline_size.px() <= if min_inline_size.px() / inline_size.to_f32_px() <=
min_block_size.px() / block_size.px() min_block_size.px() / block_size.to_f32_px()
{ {
// Row 8. // Row 8.
LogicalVec2 { LogicalVec2 {
inline: (min_block_size * i_over_b) inline: (min_block_size * i_over_b)
.clamp_below_max(max_box_size.inline), .clamp_below_max(max_box_size.inline)
block: min_block_size, .into(),
block: min_block_size.into(),
} }
} else { } else {
// Row 9. // Row 9.
LogicalVec2 { LogicalVec2 {
inline: min_inline_size, inline: min_inline_size.into(),
block: (min_inline_size / i_over_b) block: (min_inline_size / i_over_b)
.clamp_below_max(max_box_size.block), .clamp_below_max(max_box_size.block)
.into(),
} }
} }
}, },
// Row 10. // Row 10.
(Violation::Below(min_inline_size), Violation::Above(max_block_size)) => { (Violation::Below(min_inline_size), Violation::Above(max_block_size)) => {
LogicalVec2 { LogicalVec2 {
inline: min_inline_size, inline: min_inline_size.into(),
block: max_block_size, block: max_block_size.into(),
} }
}, },
// Row 11. // Row 11.
(Violation::Above(max_inline_size), Violation::Below(min_block_size)) => { (Violation::Above(max_inline_size), Violation::Below(min_block_size)) => {
LogicalVec2 { LogicalVec2 {
inline: max_inline_size, inline: max_inline_size.into(),
block: min_block_size, block: min_block_size.into(),
} }
}, },
} }