LibWeb: Resolve Lengths to CSSPixels

Userland/Libraries/LibWeb/CSS/Length.cpp

@@ -15,7 +15,6 @@
 #include <LibWeb/DOM/Document.h>
 #include <LibWeb/HTML/BrowsingContext.h>
 #include <LibWeb/HTML/HTMLHtmlElement.h>
-#include <LibWeb/PixelUnits.h>
 
 namespace Web::CSS {
 
@@ -71,7 +70,7 @@ Length Length::resolved(Layout::Node const& layout_node) const
     return *this;
 }
 
-float Length::relative_length_to_px(Gfx::IntRect const& viewport_rect, Gfx::FontPixelMetrics const& font_metrics, float font_size, float root_font_size) const
+CSSPixels Length::relative_length_to_px(Gfx::IntRect const& viewport_rect, Gfx::FontPixelMetrics const& font_metrics, CSSPixels font_size, CSSPixels root_font_size) const
 {
     switch (m_type) {
     case Type::Ex:
@@ -96,7 +95,7 @@ float Length::relative_length_to_px(Gfx::IntRect const& viewport_rect, Gfx::Font
     }
 }
 
-float Length::to_px(Layout::Node const& layout_node) const
+CSSPixels Length::to_px(Layout::Node const& layout_node) const
 {
     if (is_calculated())
         return m_calculated_style->resolve_length(layout_node)->to_px(layout_node);

Userland/Libraries/LibWeb/CSS/Length.h

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
+ * Copyright (c) 2021-2022, Sam Atkins <atkinssj@serenityos.org>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -80,9 +81,9 @@ public:
     float raw_value() const { return m_value; }
     NonnullRefPtr<CalculatedStyleValue> calculated_style_value() const;
 
-    float to_px(Layout::Node const&) const;
+    CSSPixels to_px(Layout::Node const&) const;
 
-    ALWAYS_INLINE float to_px(Gfx::IntRect const& viewport_rect, Gfx::FontPixelMetrics const& font_metrics, float font_size, float root_font_size) const
+    ALWAYS_INLINE CSSPixels to_px(Gfx::IntRect const& viewport_rect, Gfx::FontPixelMetrics const& font_metrics, CSSPixels font_size, CSSPixels root_font_size) const
     {
         if (is_auto())
             return 0;
@@ -93,7 +94,7 @@ public:
         return absolute_length_to_px();
     }
 
-    ALWAYS_INLINE float absolute_length_to_px() const
+    ALWAYS_INLINE CSSPixels absolute_length_to_px() const
     {
         constexpr float inch_pixels = 96.0f;
         constexpr float centimeter_pixels = (inch_pixels / 2.54f);
@@ -123,7 +124,7 @@ public:
     // this file already. To break the cyclic dependency, we must move all method definitions out.
     bool operator==(Length const& other) const;
 
-    float relative_length_to_px(Gfx::IntRect const& viewport_rect, Gfx::FontPixelMetrics const& font_metrics, float font_size, float root_font_size) const;
+    CSSPixels relative_length_to_px(Gfx::IntRect const& viewport_rect, Gfx::FontPixelMetrics const& font_metrics, CSSPixels font_size, CSSPixels root_font_size) const;
 
 private:
     char const* unit_name() const;

Userland/Libraries/LibWeb/CSS/MediaQuery.cpp

@@ -156,8 +156,8 @@ bool MediaFeature::compare(HTML::Window const& window, MediaFeatureValue left, C
     }
 
     if (left.is_length()) {
-        float left_px;
+        CSSPixels left_px;
-        float right_px;
+        CSSPixels right_px;
         // Save ourselves some work if neither side is a relative length.
         if (left.length().is_absolute() && right.length().is_absolute()) {
             left_px = left.length().absolute_length_to_px();

Userland/Libraries/LibWeb/CSS/StyleComputer.cpp

@@ -947,7 +947,7 @@ void StyleComputer::compute_defaulted_values(StyleProperties& style, DOM::Elemen
     }
 }
 
-float StyleComputer::root_element_font_size() const
+CSSPixels StyleComputer::root_element_font_size() const
 {
     constexpr float default_root_element_font_size = 16;
 
@@ -1048,7 +1048,7 @@ void StyleComputer::compute_font(StyleProperties& style, DOM::Element const* ele
         font_size_in_px *= multiplier;
 
     } else {
-        float root_font_size = root_element_font_size();
+        auto root_font_size = root_element_font_size();
 
         Gfx::FontPixelMetrics font_metrics;
         if (parent_element && parent_element->computed_css_values())
@@ -1056,7 +1056,7 @@ void StyleComputer::compute_font(StyleProperties& style, DOM::Element const* ele
         else
             font_metrics = Platform::FontPlugin::the().default_font().pixel_metrics();
 
-        auto parent_font_size = [&]() -> float {
+        auto parent_font_size = [&]() -> CSSPixels {
             if (!parent_element || !parent_element->computed_css_values())
                 return font_size_in_px;
             auto value = parent_element->computed_css_values()->property(CSS::PropertyID::FontSize);
@@ -1083,7 +1083,7 @@ void StyleComputer::compute_font(StyleProperties& style, DOM::Element const* ele
             // FIXME: Support font-size: calc(...)
             //        Theoretically we can do this now, but to resolve it we need a layout_node which we might not have. :^(
             if (!maybe_length->is_calculated()) {
-                auto px = maybe_length.value().to_px(viewport_rect(), font_metrics, parent_font_size(), root_font_size);
+                auto px = maybe_length.value().to_px(viewport_rect(), font_metrics, parent_font_size(), root_font_size).value();
                 if (px != 0)
                     font_size_in_px = px;
             }
@@ -1207,14 +1207,14 @@ Gfx::Font const& StyleComputer::initial_font() const
 void StyleComputer::absolutize_values(StyleProperties& style, DOM::Element const*, Optional<CSS::Selector::PseudoElement>) const
 {
     auto font_metrics = style.computed_font().pixel_metrics();
-    float root_font_size = root_element_font_size();
+    auto root_font_size = root_element_font_size();
-    float font_size = style.property(CSS::PropertyID::FontSize)->to_length().to_px(viewport_rect(), font_metrics, root_font_size, root_font_size);
+    auto font_size = style.property(CSS::PropertyID::FontSize)->to_length().to_px(viewport_rect(), font_metrics, root_font_size, root_font_size);
 
     for (size_t i = 0; i < style.m_property_values.size(); ++i) {
         auto& value_slot = style.m_property_values[i];
         if (!value_slot)
             continue;
-        value_slot = value_slot->absolutized(viewport_rect(), font_metrics, font_size, root_font_size);
+        value_slot = value_slot->absolutized(viewport_rect(), font_metrics, font_size.value(), root_font_size.value());
     }
 }
 

Userland/Libraries/LibWeb/CSS/StyleComputer.h

@@ -94,7 +94,7 @@ private:
     void for_each_stylesheet(CascadeOrigin, Callback) const;
 
     Gfx::IntRect viewport_rect() const;
-    float root_element_font_size() const;
+    CSSPixels root_element_font_size() const;
 
     struct MatchingRuleSet {
         Vector<MatchingRule> user_agent_rules;

Userland/Libraries/LibWeb/CSS/StyleValue.cpp

@@ -893,10 +893,10 @@ Gfx::FloatRect EdgeRect::resolved(Layout::Node const& layout_node, Gfx::FloatRec
     // widths for <bottom>, and the same as the used value of the width plus the sum of the
     // horizontal padding and border widths for <right>, such that four 'auto' values result in the
     // clipping region being the same as the element's border box).
-    auto left = border_box.left() + (left_edge.is_auto() ? 0 : left_edge.to_px(layout_node));
+    auto left = border_box.left() + (left_edge.is_auto() ? 0 : left_edge.to_px(layout_node)).value();
-    auto top = border_box.top() + (top_edge.is_auto() ? 0 : top_edge.to_px(layout_node));
+    auto top = border_box.top() + (top_edge.is_auto() ? 0 : top_edge.to_px(layout_node)).value();
-    auto right = border_box.left() + (right_edge.is_auto() ? border_box.width() : right_edge.to_px(layout_node));
+    auto right = border_box.left() + (right_edge.is_auto() ? border_box.width() : right_edge.to_px(layout_node)).value();
-    auto bottom = border_box.top() + (bottom_edge.is_auto() ? border_box.height() : bottom_edge.to_px(layout_node));
+    auto bottom = border_box.top() + (bottom_edge.is_auto() ? border_box.height() : bottom_edge.to_px(layout_node)).value();
     return Gfx::FloatRect {
         left,
         top,
@@ -1187,7 +1187,7 @@ float Filter::Blur::resolved_radius(Layout::Node const& node) const
     // Default value when omitted is 0px.
     auto sigma = 0;
     if (radius.has_value())
-        sigma = radius->resolved(node).to_px(node);
+        sigma = radius->resolved(node).to_px(node).value();
     // Note: The radius/sigma of the blur needs to be doubled for LibGfx's blur functions.
     return sigma * 2;
 }
@@ -1197,9 +1197,9 @@ Filter::DropShadow::Resolved Filter::DropShadow::resolved(Layout::Node const& no
     // The default value for omitted values is missing length values set to 0
     // and the missing used color is taken from the color property.
     return Resolved {
-        offset_x.resolved(node).to_px(node),
+        offset_x.resolved(node).to_px(node).value(),
-        offset_y.resolved(node).to_px(node),
+        offset_y.resolved(node).to_px(node).value(),
-        radius.has_value() ? radius->resolved(node).to_px(node) : 0.0f,
+        radius.has_value() ? radius->resolved(node).to_px(node).value() : 0.0f,
         color.has_value() ? *color : node.computed_values().color()
     };
 }

Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp

@@ -42,10 +42,10 @@ CSSPixels FlexFormattingContext::get_pixel_width(Box const& box, Optional<CSS::S
     if (!size.has_value())
         return 0;
     auto inner_width = CSS::Length::make_px(containing_block_width_for(box));
-    float border_left = box.computed_values().border_left().width;
+    auto border_left = box.computed_values().border_left().width;
-    float border_right = box.computed_values().border_right().width;
+    auto border_right = box.computed_values().border_right().width;
-    float padding_left = box.computed_values().padding().left().resolved(box, inner_width).to_px(box);
+    auto padding_left = box.computed_values().padding().left().resolved(box, inner_width).to_px(box);
-    float padding_right = box.computed_values().padding().right().resolved(box, inner_width).to_px(box);
+    auto padding_right = box.computed_values().padding().right().resolved(box, inner_width).to_px(box);
     if (box.computed_values().box_sizing() == CSS::BoxSizing::BorderBox) {
         return size->resolved(box, inner_width).to_px(box) - border_left - border_right - padding_left - padding_right;
     }
@@ -58,10 +58,10 @@ CSSPixels FlexFormattingContext::get_pixel_height(Box const& box, Optional<CSS::
     if (!length_percentage.has_value())
         return 0;
     auto inner_height = CSS::Length::make_px(containing_block_height_for(box));
-    float border_top = box.computed_values().border_top().width;
+    auto border_top = box.computed_values().border_top().width;
-    float border_bottom = box.computed_values().border_bottom().width;
+    auto border_bottom = box.computed_values().border_bottom().width;
-    float padding_top = box.computed_values().padding().top().resolved(box, inner_height).to_px(box);
+    auto padding_top = box.computed_values().padding().top().resolved(box, inner_height).to_px(box);
-    float padding_bottom = box.computed_values().padding().bottom().resolved(box, inner_height).to_px(box);
+    auto padding_bottom = box.computed_values().padding().bottom().resolved(box, inner_height).to_px(box);
     if (box.computed_values().box_sizing() == CSS::BoxSizing::BorderBox) {
         return length_percentage->resolved(box, inner_height).to_px(box) - border_top - border_bottom - padding_top - padding_bottom;
     }

Userland/Libraries/LibWeb/Layout/Node.cpp

@@ -236,7 +236,7 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
     //       m_font is used by Length::to_px() when resolving sizes against this layout node.
     //       That's why it has to be set before everything else.
     m_font = computed_style.computed_font();
-    computed_values.set_font_size(computed_style.property(CSS::PropertyID::FontSize)->to_length().to_px(*this));
+    computed_values.set_font_size(computed_style.property(CSS::PropertyID::FontSize)->to_length().to_px(*this).value());
     computed_values.set_font_weight(computed_style.property(CSS::PropertyID::FontWeight)->to_integer());
     m_line_height = computed_style.line_height(*this);
 
@@ -555,9 +555,9 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
             auto resolve_border_width = [&]() {
                 auto value = computed_style.property(width_property);
                 if (value->is_calculated())
-                    return CSS::Length::make_calculated(value->as_calculated()).to_px(*this);
+                    return CSS::Length::make_calculated(value->as_calculated()).to_px(*this).value();
                 if (value->has_length())
-                    return value->to_length().to_px(*this);
+                    return value->to_length().to_px(*this).value();
                 if (value->is_identifier()) {
                     // FIXME: These values should depend on something, e.g. a font size.
                     switch (value->to_identifier()) {

Userland/Libraries/LibWeb/Layout/TableFormattingContext.cpp

@@ -121,7 +121,7 @@ void TableFormattingContext::compute_table_measures()
         auto min_content_width = calculate_min_content_width(cell.box);
         auto max_content_width = calculate_max_content_width(cell.box);
 
-        CSSPixels min_width = min_content_width.value();
+        CSSPixels min_width = min_content_width;
         if (!computed_values.min_width().is_auto())
             min_width = max(min_width, computed_values.min_width().resolved(cell.box, width_of_containing_block_as_length).to_px(cell.box));
 

Userland/Libraries/LibWeb/Painting/GradientPainting.cpp

@@ -66,7 +66,7 @@ static ColorStopData resolve_color_stop_positions(auto const& color_stop_list, a
     //    or transition hint before it.
     auto max_previous_color_stop_or_hint = resolved_color_stops[0].position;
     auto resolve_stop_position = [&](auto& position) {
-        float value = resolve_position_to_float(position);
+        float value = static_cast<float>(resolve_position_to_float(position));
         value = max(value, max_previous_color_stop_or_hint);
         max_previous_color_stop_or_hint = value;
         return value;

Userland/Libraries/LibWeb/Painting/PaintableBox.cpp

@@ -435,7 +435,7 @@ static void paint_text_decoration(PaintContext& context, Gfx::Painter& painter,
         if (computed_thickness.is_auto())
             return max(glyph_height * 0.1f, 1.f);
 
-        return CSSPixels(computed_thickness.to_px(text_node));
+        return computed_thickness.to_px(text_node);
     }();
     auto device_line_thickness = context.rounded_device_pixels(css_line_thickness);
 

Userland/Libraries/LibWeb/Painting/StackingContext.cpp

@@ -215,10 +215,10 @@ Gfx::FloatMatrix4x4 StackingContext::get_transformation_matrix(CSS::Transformati
         return transformation.values[index].visit(
             [this, reference_length](CSS::LengthPercentage const& value) {
                 if (reference_length.has_value()) {
-                    return value.resolved(m_box, reference_length.value()).to_px(m_box);
+                    return value.resolved(m_box, reference_length.value()).to_px(m_box).value();
                 }
 
-                return value.length().to_px(m_box);
+                return value.length().to_px(m_box).value();
             },
             [](CSS::Angle const& value) {
                 return value.to_degrees() * static_cast<float>(M_DEG2RAD);

Userland/Libraries/LibWeb/SVG/SVGGraphicsElement.cpp

@@ -68,8 +68,8 @@ Optional<float> SVGGraphicsElement::stroke_width() const
     if (auto width = layout_node()->computed_values().stroke_width(); width.has_value()) {
         // Resolved relative to the "Scaled viewport size": https://www.w3.org/TR/2017/WD-fill-stroke-3-20170413/#scaled-viewport-size
         // FIXME: This isn't right, but it's something.
-        float viewport_width = 0;
+        CSSPixels viewport_width = 0;
-        float viewport_height = 0;
+        CSSPixels viewport_height = 0;
         if (auto* svg_svg_element = first_ancestor_of_type<SVGSVGElement>()) {
             if (auto* svg_svg_layout_node = svg_svg_element->layout_node()) {
                 viewport_width = svg_svg_layout_node->computed_values().width().resolved(*svg_svg_layout_node, CSS::Length::make_px(0)).to_px(*svg_svg_layout_node);
@@ -77,7 +77,7 @@ Optional<float> SVGGraphicsElement::stroke_width() const
             }
         }
         auto scaled_viewport_size = CSS::Length::make_px((viewport_width + viewport_height) * 0.5f);
-        return width->resolved(*layout_node(), scaled_viewport_size).to_px(*layout_node());
+        return width->resolved(*layout_node(), scaled_viewport_size).to_px(*layout_node()).value();
     }
     return {};
 }