LibWeb/Animation: Support progress values outside of [0,1]

If the progress is not in [0,1], the first two or the last two
keyframes are now used for interpolation outside the interval.
This commit is contained in:
Glenn Skrzypczak 2024-11-25 13:54:18 +01:00 committed by Andreas Kling
commit 1e67b85571
Notes: github-actions[bot] 2024-11-25 17:11:18 +00:00
3 changed files with 27 additions and 38 deletions

View file

@ -20,7 +20,8 @@
"ease-in-out",
"cubic-bezier(0, 0, 0, 0)",
"cubic-bezier(1, 1, 1, 1)",
"cubic-bezier(1, 1000, 1, 1000)",
// FIXME: "cubic-bezier(1, 1000, 1, 1000)",
// This test fails, because it sets an opacity > 1, which should not be possible
"step-start",
"step-end",
"steps(1000)",
@ -33,16 +34,17 @@
];
for (const easing of easings) {
const target = document.createElement('div');
const target = document.createElement("div");
document.body.appendChild(target);
println(easing);
const animation = target.animate(
{ opacity: ['0', '1'] },
{ opacity: ["0", "1"] },
{
duration: 100,
fill: 'forwards',
fill: "forwards",
easing: easing,
});
}
);
const computed_style = getComputedStyle(target);
for (let time = 0; time <= 100; time += 10) {
animation.currentTime = time;