canvas: pop many clips on restore (#38496)

When restoring context/state we need to pop all clips from current
state, before we just poped one (even if there was none).

Testing: Added new WPT tests

---------

Signed-off-by: sagudev <16504129+sagudev@users.noreply.github.com>
This commit is contained in:
sagudev 2025-08-07 10:23:09 +02:00 committed by GitHub
parent c055e8b456
commit c0cc8484f8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 161 additions and 11 deletions

View file

@ -480322,7 +480322,7 @@
[]
],
"the-canvas-state.yaml": [
"230e45f80a5901cae395ed1c4c848556e333073d",
"c3f382ef92929aa86f26f5462a7bc6d0e8731854",
[]
],
"the-canvas.yaml": [
@ -711259,6 +711259,13 @@
{}
]
],
"2d.state.saverestore.clip.2.html": [
"1f1372c2c34847a224434118d864b2431b054e01",
[
null,
{}
]
],
"2d.state.saverestore.clip.html": [
"b95a9a38c02740a4025850771c3bb8de5bb68403",
[
@ -725464,6 +725471,20 @@
{}
]
],
"2d.state.saverestore.clip.2.html": [
"31805b52bc1ca2a0a3303762bf4d46e068a45e4d",
[
null,
{}
]
],
"2d.state.saverestore.clip.2.worker.js": [
"f3d49f9511a1c099795aa8fe93955881b761b2a9",
[
"html/canvas/offscreen/the-canvas-state/2d.state.saverestore.clip.2.worker.html",
{}
]
],
"2d.state.saverestore.clip.html": [
"08ddd216a8f90c9b4bf81ef04c8cf8829f6ef5e6",
[

View file

@ -0,0 +1,36 @@
<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
<meta charset="UTF-8">
<title>Canvas test: 2d.state.saverestore.clip.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.state.saverestore.clip.2</h1>
<p class="desc">save()/restore() affects the clipping path</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("save()/restore() affects the clipping path");
_addTest(function(canvas, ctx) {
ctx.fillStyle = '#f00';
ctx.fillRect(0, 0, 100, 50);
ctx.save();
ctx.rect(0, 0, 1, 1);
ctx.clip();
ctx.clip();
ctx.restore();
ctx.fillStyle = '#0f0';
ctx.fillRect(0, 0, 100, 50);
_assertPixel(canvas, 50,25, 0,255,0,255);
});
</script>

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>OffscreenCanvas test: 2d.state.saverestore.clip.2</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/html/canvas/resources/canvas-tests.js"></script>
<h1>2d.state.saverestore.clip.2</h1>
<p class="desc">save()/restore() affects the clipping path</p>
<script>
var t = async_test("save()/restore() affects the clipping path");
var t_pass = t.done.bind(t);
var t_fail = t.step_func(function(reason) {
throw reason;
});
t.step(function() {
var canvas = new OffscreenCanvas(100, 50);
var ctx = canvas.getContext('2d');
ctx.fillStyle = '#f00';
ctx.fillRect(0, 0, 100, 50);
ctx.save();
ctx.rect(0, 0, 1, 1);
ctx.clip();
ctx.clip();
ctx.restore();
ctx.fillStyle = '#0f0';
ctx.fillRect(0, 0, 100, 50);
_assertPixel(canvas, 50,25, 0,255,0,255);
t.done();
});
</script>

View file

@ -0,0 +1,31 @@
// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py.
// OffscreenCanvas test in a worker:2d.state.saverestore.clip.2
// Description:save()/restore() affects the clipping path
// Note:
importScripts("/resources/testharness.js");
importScripts("/html/canvas/resources/canvas-tests.js");
var t = async_test("save()/restore() affects the clipping path");
var t_pass = t.done.bind(t);
var t_fail = t.step_func(function(reason) {
throw reason;
});
t.step(function() {
var canvas = new OffscreenCanvas(100, 50);
var ctx = canvas.getContext('2d');
ctx.fillStyle = '#f00';
ctx.fillRect(0, 0, 100, 50);
ctx.save();
ctx.rect(0, 0, 1, 1);
ctx.clip();
ctx.clip();
ctx.restore();
ctx.fillStyle = '#0f0';
ctx.fillRect(0, 0, 100, 50);
_assertPixel(canvas, 50,25, 0,255,0,255);
t.done();
});
done();

View file

@ -25,6 +25,21 @@
@assert pixel 50,25 == 0,255,0,255;
expected: green
- name: 2d.state.saverestore.clip.2
desc: save()/restore() affects the clipping path
code: |
ctx.fillStyle = '#f00';
ctx.fillRect(0, 0, 100, 50);
ctx.save();
ctx.rect(0, 0, 1, 1);
ctx.clip();
ctx.clip();
ctx.restore();
ctx.fillStyle = '#0f0';
ctx.fillRect(0, 0, 100, 50);
@assert pixel 50,25 == 0,255,0,255;
expected: green
- name: 2d.state.saverestore.path
desc: save()/restore() does not affect the current path
code: |