ladybird/Tests/LibWeb/Text/input/WebAnimations/animation-methods/cancel.html
2024-03-30 19:26:58 +01:00

52 lines
2.1 KiB
HTML

<!DOCTYPE html>
<div id="foo"></div>
<script src="../../include.js"></script>
<script>
promiseTest(async () => {
const foo = document.getElementById("foo");
const animation = foo.animate({}, {});
const previousReadyPromise = animation.ready;
const previousFinishedPromise = animation.finished;
const { promise: promise1, resolve: resolve1 } = Promise.withResolvers();
const { promise: promise2, resolve: resolve2 } = Promise.withResolvers();
animation.ready.then(() => {
println("Calling cancel() does not abort the ready promise");
resolve1();
}).catch(e => {
println(`Calling cancel() aborts the ready promise with an error of type AbortError: ${e.name === "AbortError"}`);
resolve1();
});
animation.finished.then(() => {
println("Calling cancel() does not abort the finished promise");
resolve2();
}).catch(e => {
println(`Calling cancel() aborts the finished promise with an error of type AbortError: ${e.name === "AbortError"}`);
resolve2();
});
let receivedEvents = {
cancel: false,
finish: false,
remove: false,
};
animation.oncancel = () => { receivedEvents.cancel = true; };
animation.onfinish = () => { receivedEvents.finish = true; };
animation.onremove = () => { receivedEvents.remove = true; };
animation.cancel();
await promise1;
await promise2;
println(`Calling cancel() recreates the ready promise: ${!Object.is(previousReadyPromise, animation.ready)}`);
println(`Calling cancel() recreates the finished promise: ${!Object.is(previousFinishedPromise, animation.finished)}`);
println(`Calling cancel() resets the start time: ${animation.startTime === null}`);
await animationFrame();
println(`Calling cancel() sends a cancel event: ${receivedEvents.cancel}`);
println(`Calling cancel() does not send a finish or remove event: ${!receivedEvents.finish && !receivedEvents.remove}`);
});
</script>