Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-12-07 21:59:54 +00:00
Code Issues Projects Releases Packages Wiki Activity

LibWeb: Don't draw shadows for transparent gradient fills

Browse source
This commit is contained in:
Tim Ledbetter 2025-10-21 11:04:52 +01:00 • committed by Jelle Raaijmakers
parent 13f551612c
commit 0516c414d4
Notes: github-actions[bot] 2025-10-21 16:56:41 +00:00
6 changed files with 106 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

8
Libraries/LibGfx/PaintStyle.h
View file

@ -20,6 +20,7 @@ namespace Gfx {
class PaintStyle : public RefCounted<PaintStyle> {
public:
virtual ~PaintStyle() = default;
virtual bool is_visible() const { return true; }
};
class SolidColorPaintStyle : public PaintStyle {
@ -29,6 +30,8 @@ public:
return adopt_nonnull_ref_or_enomem(new (nothrow) SolidColorPaintStyle(color));
}
bool is_visible() const override { return m_color.alpha() > 0; }
Color const& color() const { return m_color; }
private:
@ -65,6 +68,11 @@ public:
Optional<float> repeat_length() const { return m_repeat_length; }
bool is_visible() const override
{
return any_of(m_color_stops, [](auto& stop) { return stop.color.alpha() > 0; });
}
private:
Vector<ColorStop, 4> m_color_stops;
Optional<float> m_repeat_length;

6
Libraries/LibWeb/HTML/CanvasRenderingContext2D.cpp
View file

@ -1070,6 +1070,9 @@ void CanvasRenderingContext2D::paint_shadow_for_fill_internal(Gfx::Path const& p
if (state.current_compositing_and_blending_operator == Gfx::CompositingAndBlendingOperator::Copy)
return;
if (!state.fill_style.to_gfx_paint_style()->is_visible())
return;
auto alpha = state.global_alpha * (state.shadow_color.alpha() / 255.0f);
auto fill_style_color = state.fill_style.as_color();
if (fill_style_color.has_value() && fill_style_color->alpha() > 0)
@ -1103,6 +1106,9 @@ void CanvasRenderingContext2D::paint_shadow_for_stroke_internal(Gfx::Path const&
if (state.shadow_blur == 0.0f && state.shadow_offset_x == 0.0f && state.shadow_offset_y == 0.0f)
return;
if (!state.stroke_style.to_gfx_paint_style()->is_visible())
return;
auto alpha = state.global_alpha * (state.shadow_color.alpha() / 255.0f);
auto fill_style_color = state.fill_style.as_color();
if (fill_style_color.has_value() && fill_style_color->alpha() > 0)

6
Tests/LibWeb/Text/expected/wpt-import/html/canvas/element/shadows/2d.shadow.gradient.transparent.1.txt Normal file
View file

@ -0,0 +1,6 @@
Harness status: OK
Found 1 tests
1 Pass
Pass Shadows are not drawn for transparent gradient fills

6
Tests/LibWeb/Text/expected/wpt-import/html/canvas/element/shadows/2d.shadow.gradient.transparent.2.txt Normal file
View file

@ -0,0 +1,6 @@
Harness status: OK
Found 1 tests
1 Pass
Pass Shadows are not drawn for transparent parts of gradient fills

37
Tests/LibWeb/Text/input/wpt-import/html/canvas/element/shadows/2d.shadow.gradient.transparent.1.html Normal file
View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
<meta charset="UTF-8">
<title>Canvas test: 2d.shadow.gradient.transparent.1</title>
<script src="../../../../resources/testharness.js"></script>
<script src="../../../../resources/testharnessreport.js"></script>
<script src="../../../../html/canvas/resources/canvas-tests.js"></script>
<link rel="stylesheet" href="../../../../html/canvas/resources/canvas-tests.css">
<body class="show_output">
<h1>2d.shadow.gradient.transparent.1</h1>
<p class="desc">Shadows are not drawn for transparent gradient fills</p>
<p class="output">Actual output:</p>
<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
<p class="output expectedtext">Expected output:<p><img src="../../../../images/green-100x50.png" class="output expected" id="expected" alt="">
<ul id="d"></ul>
<script>
var t = async_test("Shadows are not drawn for transparent gradient fills");
_addTest(function(canvas, ctx) {
var gradient = ctx.createLinearGradient(0, 0, 100, 0);
gradient.addColorStop(0, 'rgba(0,0,0,0)');
gradient.addColorStop(1, 'rgba(0,0,0,0)');
ctx.fillStyle = '#0f0';
ctx.fillRect(0, 0, 100, 50);
ctx.shadowColor = '#f00';
ctx.shadowOffsetY = 50;
ctx.fillStyle = gradient;
ctx.fillRect(0, -50, 100, 50);
_assertPixel(canvas, 50,25, 0,255,0,255);
});
</script>

43
Tests/LibWeb/Text/input/wpt-import/html/canvas/element/shadows/2d.shadow.gradient.transparent.2.html Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
<meta charset="UTF-8">
<title>Canvas test: 2d.shadow.gradient.transparent.2</title>
<script src="../../../../resources/testharness.js"></script>
<script src="../../../../resources/testharnessreport.js"></script>
<script src="../../../../html/canvas/resources/canvas-tests.js"></script>
<link rel="stylesheet" href="../../../../html/canvas/resources/canvas-tests.css">
<body class="show_output">
<h1>2d.shadow.gradient.transparent.2</h1>
<p class="desc">Shadows are not drawn for transparent parts of gradient fills</p>
<p class="output">Actual output:</p>
<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
<p class="output expectedtext">Expected output:<p><img src="../../../../images/green-100x50.png" class="output expected" id="expected" alt="">
<ul id="d"></ul>
<script>
var t = async_test("Shadows are not drawn for transparent parts of gradient fills");
_addTest(function(canvas, ctx) {
var gradient = ctx.createLinearGradient(0, 0, 100, 0);
gradient.addColorStop(0, '#f00');
gradient.addColorStop(0.499, '#f00');
gradient.addColorStop(0.5, 'rgba(0,0,0,0)');
gradient.addColorStop(1, 'rgba(0,0,0,0)');
ctx.fillStyle = '#f00';
ctx.fillRect(0, 0, 50, 50);
ctx.fillStyle = '#0f0';
ctx.fillRect(50, 0, 50, 50);
ctx.shadowOffsetY = 50;
ctx.shadowColor = '#0f0';
ctx.fillStyle = gradient;
ctx.fillRect(0, -50, 100, 50);
_assertPixel(canvas, 25,25, 0,255,0,255);
_assertPixel(canvas, 50,25, 0,255,0,255);
_assertPixel(canvas, 75,25, 0,255,0,255);
});
</script>