LibWeb: Make CSSPixels and Length use 64-bit (double) floating point

This fixes a plethora of rounding problems on many websites.
In the future, we may want to replace this with fixed-point arithmetic
(bug #18566) for performance (and consistency with other engines),
but in the meantime this makes the web look a bit better. :^)

There's a lot more things that could be converted to doubles, which
would reduce the amount of casting necessary in this patch.
We can do that incrementally, however.

4 files changed, 10 insertions, 10 deletions

diff --git a/Userland/Libraries/LibWeb/CSS/StyleValues/CalculatedStyleValue.cpp b/Userland/Libraries/LibWeb/CSS/StyleValues/CalculatedStyleValue.cpp
index e59c9deb99..2ce0745d64 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleValues/CalculatedStyleValue.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleValues/CalculatedStyleValue.cpp
@@ -536,7 +536,7 @@ void CalculatedStyleValue::CalculationResult::multiply_by(CalculationResult cons
         },
         [&](Length const& length) {
             VERIFY(layout_node);
-            m_value = Length::make_px(length.to_px(*layout_node) * other.m_value.get<Number>().value());
+            m_value = Length::make_px(length.to_px(*layout_node) * static_cast<double>(other.m_value.get<Number>().value()));
         },
         [&](Time const& time) {
             m_value = Time::make_seconds(time.to_seconds() * other.m_value.get<Number>().value());
@@ -569,7 +569,7 @@ void CalculatedStyleValue::CalculationResult::divide_by(CalculationResult const&
         },
         [&](Length const& length) {
             VERIFY(layout_node);
-            m_value = Length::make_px(length.to_px(*layout_node) / denominator);
+            m_value = Length::make_px(length.to_px(*layout_node) / static_cast<double>(denominator));
         },
         [&](Time const& time) {
             m_value = Time::make_seconds(time.to_seconds() / denominator);
diff --git a/Userland/Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.cpp b/Userland/Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.cpp
index 8df68e1456..e4e00a0234 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.cpp
@@ -30,7 +30,7 @@ Filter::DropShadow::Resolved Filter::DropShadow::resolved(Layout::Node const& no
     return Resolved {
         offset_x.to_px(node).value(),
         offset_y.to_px(node).value(),
-        radius.has_value() ? radius->to_px(node).value() : 0.0f,
+        radius.has_value() ? radius->to_px(node).value() : 0.0,
         color.has_value() ? *color : node.computed_values().color()
     };
 }
diff --git a/Userland/Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.h b/Userland/Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.h
index 5c4257d4ee..601d774f28 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.h
+++ b/Userland/Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.h
@@ -30,9 +30,9 @@ struct DropShadow {
     Optional<Length> radius {};
     Optional<Color> color {};
     struct Resolved {
-        float offset_x;
-        float offset_y;
-        float radius;
+        double offset_x;
+        double offset_y;
+        double radius;
         Color color;
     };
     Resolved resolved(Layout::Node const&) const;
diff --git a/Userland/Libraries/LibWeb/CSS/StyleValues/RadialGradientStyleValue.cpp b/Userland/Libraries/LibWeb/CSS/StyleValues/RadialGradientStyleValue.cpp
index e414f152d2..5c56d882db 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleValues/RadialGradientStyleValue.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleValues/RadialGradientStyleValue.cpp
@@ -146,12 +146,12 @@ Gfx::FloatSize RadialGradientStyleValue::resolve_size(Layout::Node const& node,
         },
         [&](CircleSize const& circle_size) {
             auto radius = circle_size.radius.to_px(node);
-            return Gfx::FloatSize { radius, radius };
+            return Gfx::FloatSize { radius.value(), radius.value() };
         },
         [&](EllipseSize const& ellipse_size) {
             auto radius_a = ellipse_size.radius_a.resolved(node, CSS::Length::make_px(size.width())).to_px(node);
             auto radius_b = ellipse_size.radius_b.resolved(node, CSS::Length::make_px(size.height())).to_px(node);
-            return Gfx::FloatSize { radius_a, radius_b };
+            return Gfx::FloatSize { radius_a.value(), radius_b.value() };
         });
 
     // Handle degenerate cases
@@ -187,8 +187,8 @@ Gfx::FloatSize RadialGradientStyleValue::resolve_size(Layout::Node const& node,
 void RadialGradientStyleValue::resolve_for_size(Layout::Node const& node, CSSPixelSize paint_size) const
 {
     CSSPixelRect gradient_box { { 0, 0 }, paint_size };
-    auto center = m_properties.position.resolved(node, gradient_box).to_type<float>();
-    auto gradient_size = resolve_size(node, center, gradient_box.to_type<float>());
+    auto center = m_properties.position.resolved(node, gradient_box).to_type<double>().to_type<float>();
+    auto gradient_size = resolve_size(node, center, gradient_box.to_type<double>().to_type<float>());
     if (m_resolved.has_value() && m_resolved->gradient_size == gradient_size)
         return;
     m_resolved = ResolvedData {