Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-12-07 21:59:54 +00:00
Code Issues Projects Releases Packages Wiki Activity

LibWeb: Don't deassociate animations when deregistering transitions

Browse source 
Also renames the `clear_transitions` function to clarify this doesn't
affect the associated transition animations.

This fixes an issue where transitions weren't being cancelled when the
relevant transition-property entry was no longer present
This commit is contained in:
Callum Law 2025-11-18 16:24:40 +13:00 • committed by Jelle Raaijmakers
parent b262902b02
commit 025274cd86
Notes: github-actions[bot] 2025-11-23 08:44:52 +00:00
5 changed files with 30 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

3
Libraries/LibWeb/Animations/Animatable.cpp
View file

@ -224,14 +224,13 @@ void Animatable::remove_transition(Optional<CSS::PseudoElement> pseudo_element,
transition.associated_transitions.remove(property_id); transition.associated_transitions.remove(property_id);
} }
void Animatable::clear_transitions(Optional<CSS::PseudoElement> pseudo_element) void Animatable::clear_registered_transitions(Optional<CSS::PseudoElement> pseudo_element)
{ {
auto maybe_transition = ensure_transition(pseudo_element); auto maybe_transition = ensure_transition(pseudo_element);
if (!maybe_transition) if (!maybe_transition)
return; return;
auto& transition = *maybe_transition; auto& transition = *maybe_transition;
transition.associated_transitions.clear();
transition.transition_attribute_indices.clear(); transition.transition_attribute_indices.clear();
transition.transition_attributes.clear(); transition.transition_attributes.clear();
} }

2
Libraries/LibWeb/Animations/Animatable.h
View file

@ -68,7 +68,7 @@ public:
void remove_transition(Optional<CSS::PseudoElement>, CSS::PropertyID); void remove_transition(Optional<CSS::PseudoElement>, CSS::PropertyID);
Vector<CSS::PropertyID> property_ids_with_existing_transitions(Optional<CSS::PseudoElement>) const; Vector<CSS::PropertyID> property_ids_with_existing_transitions(Optional<CSS::PseudoElement>) const;
GC::Ptr<CSS::CSSTransition> property_transition(Optional<CSS::PseudoElement>, CSS::PropertyID) const; GC::Ptr<CSS::CSSTransition> property_transition(Optional<CSS::PseudoElement>, CSS::PropertyID) const;
void clear_transitions(Optional<CSS::PseudoElement>); void clear_registered_transitions(Optional<CSS::PseudoElement>);
void remove_animations_from_timeline(); void remove_animations_from_timeline();

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

@ -1232,7 +1232,7 @@ static void compute_transitioned_properties(ComputedProperties const& style, DOM
if (source_declaration == element.cached_transition_property_source(pseudo_element)) if (source_declaration == element.cached_transition_property_source(pseudo_element))
return; return;
// Reparse this transition property // Reparse this transition property
element.clear_transitions(pseudo_element); element.clear_registered_transitions(pseudo_element);
element.set_cached_transition_property_source(pseudo_element, *source_declaration); element.set_cached_transition_property_source(pseudo_element, *source_declaration);
auto coordinated_transition_list = style.assemble_coordinated_value_list( auto coordinated_transition_list = style.assemble_coordinated_value_list(

3
Tests/LibWeb/Text/expected/css/transition-cancelled-on-property-change.txt Normal file
View file

@ -0,0 +1,3 @@
0
1
0

24
Tests/LibWeb/Text/input/css/transition-cancelled-on-property-change.html Normal file
View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<style>
#foo {
transition: transform 100s;
}
</style>
<div id="foo"></div>
<script src="../include.js"></script>
<script>
test(() => {
// No animations to start with
println(document.getAnimations().length);
foo.style.transform = "rotate(90deg)";
// One animation when transition starts
println(document.getAnimations().length);
foo.style.transitionProperty = "none";
// No animations after transition is cancelled because relevant transition property no longer exists
println(document.getAnimations().length);
});
</script>