Ladybird/ladybird
1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-06-08 05:27:14 +09:00
Code Activity

LibWeb: Cancel previous animation if new animation-name is "none"

Browse source 
"none" value should be interpreted as "no animation" to trigger the path
that cancels previous animation if it exists.
This commit is contained in:
Aliaksandr Kalenik 2025-05-27 17:09:39 +02:00 • committed by Alexander Kalenik
parent 985434ea10
commit 4b4d960cba
Notes: github-actions[bot] 2025-06-01 03:03:12 +00:00
3 changed files with 42 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

2
Libraries/LibWeb/CSS/StyleComputer.cpp
View file

@ -2678,6 +2678,8 @@ GC::Ref<ComputedProperties> StyleComputer::compute_properties(DOM::Element& elem
auto const animation_name = computed_style->maybe_null_property(PropertyID::AnimationName);
if (!animation_name)
return OptionalNone {};
if (animation_name->is_keyword() && animation_name->to_keyword() == Keyword::None)
return OptionalNone {};
if (animation_name->is_string())
return animation_name->as_string().string_value().to_string();
return animation_name->to_string(SerializationMode::Normal);

1
Tests/LibWeb/Text/expected/WebAnimations/cancel-animation.txt Normal file
View file

@ -0,0 +1 @@
Animation cancelled

39
Tests/LibWeb/Text/input/WebAnimations/cancel-animation.html Normal file
View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html>
<body>
<div id="box"></div>
<style>
#box {
width: 100px;
height: 100px;
background: #000;
margin: 200px;
}
@keyframes enlarge {
from {
transform: scale(1);
}
to {
transform: scale(5);
}
}
</style>
</body>
<script src="../include.js"></script>
<script>
asyncTest(done => {
const box = document.getElementById("box");
box.addEventListener("animationcancel", () => {
println("Animation cancelled");
done();
});
box.addEventListener("animationstart", () => {
requestAnimationFrame(() => (box.style.animation = "none"));
});
box.style.animation = "enlarge 2s forwards";
});
</script>
</html>