mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-08-11 18:50:50 +00:00
LibWeb: Don't skip last keyframe
This commit is contained in:
parent
f8f399c9c0
commit
4292344729
Notes:
github-actions[bot]
2025-06-23 19:02:33 +00:00
Author: https://github.com/Gingeh
Commit: 4292344729
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/5139
Reviewed-by: https://github.com/gmta ✅
3 changed files with 46 additions and 2 deletions
|
@ -1334,8 +1334,10 @@ void StyleComputer::collect_animation_into(DOM::Element& element, Optional<CSS::
|
||||||
return keyframes.begin();
|
return keyframes.begin();
|
||||||
}
|
}
|
||||||
auto potential_match = keyframes.find_largest_not_above_iterator(key);
|
auto potential_match = keyframes.find_largest_not_above_iterator(key);
|
||||||
if (output_progress.value() >= 0) {
|
auto next = potential_match;
|
||||||
return --potential_match;
|
++next;
|
||||||
|
if (next.is_end()) {
|
||||||
|
--potential_match;
|
||||||
}
|
}
|
||||||
return potential_match;
|
return potential_match;
|
||||||
}();
|
}();
|
||||||
|
|
|
@ -0,0 +1,3 @@
|
||||||
|
rect.left > 0: true
|
||||||
|
rect.left <= 100: true
|
||||||
|
rect.top > 0: true
|
39
Tests/LibWeb/Text/input/css/animate-with-many-keyframes.html
Normal file
39
Tests/LibWeb/Text/input/css/animate-with-many-keyframes.html
Normal file
|
@ -0,0 +1,39 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<style>
|
||||||
|
#foo {
|
||||||
|
animation: 1s forwards linear anim;
|
||||||
|
animation-play-state: paused;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes anim {
|
||||||
|
0% {
|
||||||
|
left: 0px;
|
||||||
|
top: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
left: 100px;
|
||||||
|
top: 0px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
left: 100px;
|
||||||
|
top: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<div id="foo"></div>
|
||||||
|
<script src="../include.js"></script>
|
||||||
|
<script>
|
||||||
|
asyncTest(async (done) => {
|
||||||
|
const foo = document.getElementById("foo");
|
||||||
|
const anim = foo.getAnimations()[0];
|
||||||
|
anim.onfinish = function () {
|
||||||
|
const rect = foo.getBoundingClientRect();
|
||||||
|
println("rect.left > 0: " + (rect.left > 0));
|
||||||
|
println("rect.left <= 100: " + (rect.left <= 100));
|
||||||
|
println("rect.top > 0: " + (rect.top > 0));
|
||||||
|
done();
|
||||||
|
};
|
||||||
|
anim.play();
|
||||||
|
});
|
||||||
|
</script>
|
Loading…
Add table
Add a link
Reference in a new issue