Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-06 14:10:11 +01:00
Code Issues Projects Releases Packages Wiki Activity

canvas: Properly bound all image pattern axis by inserting clip (#37668)

Browse source 
Before we only handled no-repeat for rect, this means we rendered
https://sagudev.github.io/briefcase/no-repeat.html incorrectly (like
firefox). Now if one of the axis is bounded (does not repeat) we clip it
and let other axis be unbounded (technically we clip it to end of
canvas).

This is also needed for vello backend.

Testing: Tests in WPT exists and another test is added.

---------

Signed-off-by: sagudev <16504129+sagudev@users.noreply.github.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
This commit is contained in:
sagudev 2025-07-11 08:49:09 +02:00 • committed by GitHub
parent 464d71ecfc
commit 75c13f1422
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
8 changed files with 314 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

137
components/canvas/canvas_data.rs
View file

@ -492,11 +492,17 @@ impl<'a, B: Backend> CanvasData<'a, B> {
// > from left to right (if any), adding to the array, for each glyph, the shape of the glyph
// > as it is in the inline box, positioned on a coordinate space using CSS pixels with its
// > origin is at the anchor point.
self.drawtarget.fill_text(
shaped_runs,
start,
&self.state.fill_style,
&self.state.draw_options,
self.maybe_bound_shape_with_pattern(
self.state.fill_style.clone(),
&Rect::from_size(Size2D::new(total_advance, size)),
|self_| {
self_.drawtarget.fill_text(
shaped_runs,
start,
&self_.state.fill_style,
&self_.state.draw_options,
);
},
);
}
@ -676,19 +682,22 @@ impl<'a, B: Backend> CanvasData<'a, B> {
return; // Paint nothing if gradient size is zero.
}
let draw_rect = self.state.fill_style.draw_rect(rect);
if self.need_to_draw_shadow() {
self.draw_with_shadow(&draw_rect, |new_draw_target: &mut B::DrawTarget| {
new_draw_target.fill_rect(
&draw_rect,
&self.state.fill_style,
&self.state.draw_options,
);
self.draw_with_shadow(rect, |new_draw_target: &mut B::DrawTarget| {
new_draw_target.fill_rect(rect, &self.state.fill_style, &self.state.draw_options);
});
} else {
self.drawtarget
.fill_rect(&draw_rect, &self.state.fill_style, &self.state.draw_options);
self.maybe_bound_shape_with_pattern(
self.state.fill_style.clone(),
&rect.cast(),
|self_| {
self_.drawtarget.fill_rect(
rect,
&self_.state.fill_style,
&self_.state.draw_options,
);
},
);
}
}
@ -711,12 +720,18 @@ impl<'a, B: Backend> CanvasData<'a, B> {
);
});
} else {
self.drawtarget.stroke_rect(
rect,
&self.state.stroke_style,
&self.state.stroke_opts,
&self.state.draw_options,
);
self.maybe_bound_shape_with_pattern(
self.state.stroke_style.clone(),
&rect.cast(),
|self_| {
self_.drawtarget.stroke_rect(
rect,
&self_.state.stroke_style,
&self_.state.stroke_opts,
&self_.state.draw_options,
);
},
)
}
}
@ -781,11 +796,17 @@ impl<'a, B: Backend> CanvasData<'a, B> {
return; // Path is uninvertible.
};
self.drawtarget.fill(
&path,
&self.state.fill_style,
&self.state.draw_options.clone(),
);
self.maybe_bound_shape_with_pattern(
self.state.fill_style.clone(),
&path.bounding_box(),
|self_| {
self_.drawtarget.fill(
&path,
&self_.state.fill_style,
&self_.state.draw_options.clone(),
);
},
)
}
pub(crate) fn fill_path(&mut self, path_segments: &[PathSegment]) {
@ -809,12 +830,18 @@ impl<'a, B: Backend> CanvasData<'a, B> {
return; // Path is uninvertible.
};
self.drawtarget.stroke(
&path,
&self.state.stroke_style,
&self.state.stroke_opts,
&self.state.draw_options,
);
self.maybe_bound_shape_with_pattern(
self.state.stroke_style.clone(),
&path.bounding_box(),
|self_| {
self_.drawtarget.stroke(
&path,
&self_.state.stroke_style,
&self_.state.stroke_opts,
&self_.state.draw_options,
);
},
)
}
pub(crate) fn stroke_path(&mut self, path_segments: &[PathSegment]) {
@ -825,12 +852,18 @@ impl<'a, B: Backend> CanvasData<'a, B> {
let mut path = B::Path::new();
path.add_segments(path_segments);
self.drawtarget.stroke(
&path,
&self.state.stroke_style,
&self.state.stroke_opts,
&self.state.draw_options,
);
self.maybe_bound_shape_with_pattern(
self.state.stroke_style.clone(),
&path.bounding_box(),
|self_| {
self_.drawtarget.stroke(
&path,
&self_.state.stroke_style,
&self_.state.stroke_opts,
&self_.state.draw_options,
);
},
)
}
pub(crate) fn clip(&mut self) {
@ -1183,6 +1216,34 @@ impl<'a, B: Backend> CanvasData<'a, B> {
);
}
/// Push a clip to the draw target to respect the non-repeating bound (either x, y, or both)
/// of the given pattern.
fn maybe_bound_shape_with_pattern<F>(
&mut self,
pattern: B::Pattern<'_>,
path_bound_box: &Rect<f64>,
draw_shape: F,
) where
F: FnOnce(&mut Self),
{
let x_bound = pattern.x_bound();
let y_bound = pattern.y_bound();
// Clear operations are also unbounded.
if self.state.draw_options.is_clear() || (x_bound.is_none() && y_bound.is_none()) {
draw_shape(self);
return;
}
let rect = Rect::from_size(Size2D::new(
x_bound.unwrap_or(path_bound_box.size.width.ceil() as u32),
y_bound.unwrap_or(path_bound_box.size.height.ceil() as u32),
))
.cast();
let rect = self.get_transform().outer_transformed_rect(&rect);
self.drawtarget.push_clip_rect(&rect.cast());
draw_shape(self);
self.drawtarget.pop_clip();
}
/// It reads image data from the canvas
/// canvas_size: The size of the canvas we're reading from
/// read_rect: The area of the canvas we want to read from