diff options
author | Moonchild <mcwerewolf@gmail.com> | 2018-04-29 18:48:43 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2018-04-29 18:48:43 +0200 |
commit | b83c51a1a51f58a7a68d1a4877b0f0a8f03a939e (patch) | |
tree | 8ba5cabbaa5390ce5bffb1af3b31a4e49a8def09 /dom/events | |
parent | 3fe37f6ae848f7d88e2316857a1a95d9c2abae14 (diff) | |
parent | 35c61a027dc6f4d58ca9d33e06da79adf2503ebd (diff) | |
download | uxp-b83c51a1a51f58a7a68d1a4877b0f0a8f03a939e.tar.gz |
Merge pull request #296 from janekptacijarabaci/js_dom_animationcancel_1
DOM - implement animationcancel event
Diffstat (limited to 'dom/events')
-rw-r--r-- | dom/events/EventNameList.h | 8 | ||||
-rw-r--r-- | dom/events/test/test_legacy_event.html | 21 |
2 files changed, 15 insertions, 14 deletions
diff --git a/dom/events/EventNameList.h b/dom/events/EventNameList.h index 891035c43e..509863e6ce 100644 --- a/dom/events/EventNameList.h +++ b/dom/events/EventNameList.h @@ -1007,6 +1007,10 @@ EVENT(transitionend, eTransitionEnd, EventNameType_All, eTransitionEventClass) +EVENT(transitioncancel, + eTransitionCancel, + EventNameType_All, + eTransitionEventClass) EVENT(animationstart, eAnimationStart, EventNameType_All, @@ -1019,6 +1023,10 @@ EVENT(animationiteration, eAnimationIteration, EventNameType_All, eAnimationEventClass) +EVENT(animationcancel, + eAnimationCancel, + EventNameType_All, + eAnimationEventClass) // Webkit-prefixed versions of Transition & Animation events, for web compat: EVENT(webkitAnimationEnd, diff --git a/dom/events/test/test_legacy_event.html b/dom/events/test/test_legacy_event.html index d772be1066..b2105a6dfc 100644 --- a/dom/events/test/test_legacy_event.html +++ b/dom/events/test/test_legacy_event.html @@ -73,22 +73,15 @@ function triggerShortAnimation(node) { node.style.animation = "anim1 1ms linear"; } -// This function triggers a long animation with two iterations, which is -// *nearly* at the end of its first iteration. It will hit the end of that -// iteration (firing an event) almost immediately, 1ms in the future. +// This function triggers a very short (10ms long) animation with many +// iterations, which will cause a start event followed by an iteration event +// on each subsequent tick, to fire. // -// NOTE: It's important that this animation have a *long* duration. If it were -// short (e.g. 1ms duration), then we might jump past all its iterations in -// a single refresh-driver tick. And if that were to happens, we'd *never* fire -// any animationiteration events -- the CSS Animations spec says this event -// must not be fired "...when an animationend event would fire at the same time" -// (which would be the case in this example with a 1ms duration). So, to make -// sure our event does fire, we use a long duration and a nearly-as-long -// negative delay. This ensures we hit the end of the first iteration right -// away, and that we don't risk hitting the end of the second iteration at the -// same time. +// NOTE: We need the many iterations since if an animation frame coincides +// with the animation starting or ending we dispatch only the start or end +// event and not the iteration event. function triggerAnimationIteration(node) { - node.style.animation = "anim1 300s -299.999s linear 2"; + node.style.animation = "anim1 10ms linear 20000"; } // GENERAL UTILITY FUNCTIONS |