LibWeb: Don't round numbers too early when painting backgrounds

Preserve floating point precision and delay rounding until the last
moment when figuring out where to paint background layers. This fixes an
issue on Acid3 where a thin sliver of red was visible because the
background X position was incorrectly rounded by 1px.

Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp

@@ -73,25 +73,25 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
         }
 
         // Size
-        Gfx::IntRect image_rect;
+        Gfx::FloatRect image_rect;
         switch (layer.size_type) {
         case CSS::BackgroundSize::Contain: {
             float max_width_ratio = background_positioning_area.width() / image.width();
             float max_height_ratio = background_positioning_area.height() / image.height();
             float ratio = min(max_width_ratio, max_height_ratio);
-            image_rect.set_size(roundf(image.width() * ratio), roundf(image.height() * ratio));
+            image_rect.set_size(image.width() * ratio, image.height() * ratio);
             break;
         }
         case CSS::BackgroundSize::Cover: {
             float max_width_ratio = background_positioning_area.width() / image.width();
             float max_height_ratio = background_positioning_area.height() / image.height();
             float ratio = max(max_width_ratio, max_height_ratio);
-            image_rect.set_size(roundf(image.width() * ratio), roundf(image.height() * ratio));
+            image_rect.set_size(image.width() * ratio, image.height() * ratio);
             break;
         }
         case CSS::BackgroundSize::LengthPercentage: {
-            int width;
-            int height;
+            float width;
+            float height;
             bool x_is_auto = layer.size_x.is_length() && layer.size_x.length().is_auto();
             bool y_is_auto = layer.size_y.is_length() && layer.size_y.length().is_auto();
             if (x_is_auto && y_is_auto) {
@@ -99,10 +99,10 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
                 height = image.height();
             } else if (x_is_auto) {
                 height = layer.size_y.resolved(layout_node, CSS::Length::make_px(background_positioning_area.height())).to_px(layout_node);
-                width = roundf(image.width() * ((float)height / (float)image.height()));
+                width = image.width() * (height / image.height());
             } else if (y_is_auto) {
                 width = layer.size_x.resolved(layout_node, CSS::Length::make_px(background_positioning_area.width())).to_px(layout_node);
-                height = roundf(image.height() * ((float)width / (float)image.width()));
+                height = image.height() * (width / image.width());
             } else {
                 width = layer.size_x.resolved(layout_node, CSS::Length::make_px(background_positioning_area.width())).to_px(layout_node);
                 height = layer.size_y.resolved(layout_node, CSS::Length::make_px(background_positioning_area.height())).to_px(layout_node);
@@ -122,10 +122,10 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
             // where round() is a function that returns the nearest natural number
             // (integer greater than zero).
             if (layer.repeat_x == CSS::Repeat::Round) {
-                image_rect.set_width((float)background_positioning_area.width() / roundf((float)background_positioning_area.width() / (float)image_rect.width()));
+                image_rect.set_width(background_positioning_area.width() / background_positioning_area.width() / image_rect.width());
             }
             if (layer.repeat_y == CSS::Repeat::Round) {
-                image_rect.set_height((float)background_positioning_area.height() / roundf((float)background_positioning_area.height() / (float)image_rect.height()));
+                image_rect.set_height(background_positioning_area.height() / background_positioning_area.height() / image_rect.height());
             }
 
             // If background-repeat is round for one dimension only and if background-size is auto
@@ -133,26 +133,26 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
             // so that the original aspect ratio is restored.
             if (layer.repeat_x != layer.repeat_y) {
                 if (layer.size_x.is_length() && layer.size_x.length().is_auto()) {
-                    image_rect.set_width((float)image.width() * ((float)image_rect.height() / (float)image.height()));
+                    image_rect.set_width(image.width() * (image_rect.height() / image.height()));
                 }
                 if (layer.size_y.is_length() && layer.size_y.length().is_auto()) {
-                    image_rect.set_height((float)image.height() * ((float)image_rect.width() / (float)image.width()));
+                    image_rect.set_height(image.height() * (image_rect.width() / image.width()));
                 }
             }
         }
 
-        int space_x = background_positioning_area.width() - image_rect.width();
-        int space_y = background_positioning_area.height() - image_rect.height();
+        float space_x = background_positioning_area.width() - image_rect.width();
+        float space_y = background_positioning_area.height() - image_rect.height();
 
         // Position
-        int offset_x = layer.position_offset_x.resolved(layout_node, CSS::Length::make_px(space_x)).to_px(layout_node);
+        float offset_x = layer.position_offset_x.resolved(layout_node, CSS::Length::make_px(space_x)).to_px(layout_node);
         if (layer.position_edge_x == CSS::PositionEdge::Right) {
             image_rect.set_right_without_resize(background_positioning_area.right() - offset_x);
         } else {
             image_rect.set_left(background_positioning_area.left() + offset_x);
         }
 
-        int offset_y = layer.position_offset_y.resolved(layout_node, CSS::Length::make_px(space_y)).to_px(layout_node);
+        float offset_y = layer.position_offset_y.resolved(layout_node, CSS::Length::make_px(space_y)).to_px(layout_node);
         if (layer.position_edge_y == CSS::PositionEdge::Bottom) {
             image_rect.set_bottom_without_resize(background_positioning_area.bottom() - offset_y);
         } else {
@@ -231,12 +231,12 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
         float initial_image_x = image_rect.x();
         float image_y = image_rect.y();
         while (image_y < clip_rect.bottom()) {
-            image_rect.set_y(roundf(image_y));
+            image_rect.set_y(image_y);
 
             float image_x = initial_image_x;
             while (image_x < clip_rect.right()) {
-                image_rect.set_x(roundf(image_x));
-                painter.draw_scaled_bitmap(image_rect, image, image.rect(), 1.0f, Gfx::Painter::ScalingMode::BilinearBlend);
+                image_rect.set_x(image_x);
+                painter.draw_scaled_bitmap(image_rect.to_rounded<int>(), image, image.rect(), 1.0f, Gfx::Painter::ScalingMode::BilinearBlend);
                 if (!repeat_x)
                     break;
                 image_x += x_step;