mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-08-03 22:59:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Calculate width property resolved value correctly

Browse source 
This means that relative width values are now correctly resolved when
calling `getComputedStyle()`.
This commit is contained in:
Tim Ledbetter 2024-05-06 23:29:21 +01:00 • committed by Andreas Kling
commit 0b0ad5c9db
Notes: sideshowbarker 2024-07-17 06:35:23 +09:00
4 changed files with 50 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

33
Userland/Libraries/LibWeb/CSS/ResolvedCSSStyleDeclaration.cpp
View file

@ -196,6 +196,18 @@ static RefPtr<StyleValue const> style_value_for_shadow(Vector<ShadowData> const&
RefPtr<StyleValue const> ResolvedCSSStyleDeclaration::style_value_for_property(Layout::NodeWithStyle const& layout_node, PropertyID property_id) const
{
auto used_value_for_property = [&layout_node](Function<CSSPixels(Painting::PaintableBox const&)>&& used_value_getter) -> Optional<CSSPixels> {
auto const& display = layout_node.computed_values().display();
if (!display.is_none() && !display.is_contents() && layout_node.paintable()) {
if (layout_node.paintable()->is_paintable_box()) {
auto const& paintable_box = static_cast<Painting::PaintableBox const&>(*layout_node.paintable());
return used_value_getter(paintable_box);
}
dbgln("FIXME: Support getting used value for ({})", layout_node.debug_description());
}
return {};
};
// A limited number of properties have special rules for producing their "resolved value".
// We also have to manually construct shorthands from their longhands here.
// Everything else uses the computed value.
@ -269,20 +281,13 @@ RefPtr<StyleValue const> ResolvedCSSStyleDeclaration::style_value_for_property(L
// -> padding-right
// -> padding-top
// -> width
// -> A resolved value special case property like height defined in another specification
case PropertyID::Height: {
// If the property applies to the element or pseudo-element and the resolved value of the
// display property is not none or contents, then the resolved value is the used value.
// Otherwise the resolved value is the computed value.
auto const& display = layout_node.computed_values().display();
if (!display.is_none() && !display.is_contents() && layout_node.paintable()) {
if (layout_node.paintable()->is_paintable_box()) {
auto const& paintable_box = static_cast<Painting::PaintableBox const&>(*layout_node.paintable());
auto const used_height = paintable_box.content_height();
return style_value_for_size(Size::make_px(used_height));
}
dbgln("FIXME: Support getting used height for ({})", layout_node.debug_description());
}
case PropertyID::Height: {
auto maybe_used_height = used_value_for_property([](auto const& paintable_box) { return paintable_box.content_height(); });
if (maybe_used_height.has_value())
return style_value_for_size(Size::make_px(maybe_used_height.release_value()));
return style_value_for_size(layout_node.computed_values().height());
}
case PropertyID::MarginBlockEnd:
@ -317,8 +322,12 @@ RefPtr<StyleValue const> ResolvedCSSStyleDeclaration::style_value_for_property(L
return style_value_for_length_percentage(layout_node.computed_values().padding().right());
case PropertyID::PaddingTop:
return style_value_for_length_percentage(layout_node.computed_values().padding().top());
case PropertyID::Width:
case PropertyID::Width: {
auto maybe_used_width = used_value_for_property([](auto const& paintable_box) { return paintable_box.content_width(); });
if (maybe_used_width.has_value())
return style_value_for_size(Size::make_px(maybe_used_width.release_value()));
return style_value_for_size(layout_node.computed_values().width());
}
// -> bottom
// -> left