diff --git a/src/addons/transitions/ReactTransitionEvents.js b/src/addons/transitions/ReactTransitionEvents.js index be61140598..ac65be7719 100644 --- a/src/addons/transitions/ReactTransitionEvents.js +++ b/src/addons/transitions/ReactTransitionEvents.js @@ -20,6 +20,11 @@ var ExecutionEnvironment = require('ExecutionEnvironment'); +/** + * EVENT_NAME_MAP is used to determine which event fired when a + * transition/animation ends, based on the style property used to + * define that event. + */ var EVENT_NAME_MAP = { transitionend: { 'transition': 'transitionend', @@ -43,6 +48,20 @@ var endEvents = []; function detectEvents() { var testEl = document.createElement('div'); var style = testEl.style; + + // On some platforms, in particular some releases of Android 4.x, + // the un-prefixed "animation" and "transition" properties are defined on the + // style object but the events that fire will still be prefixed, so we need + // to check if the un-prefixed events are useable, and if not remove them + // from the map + if (!('AnimationEvent' in window)) { + delete EVENT_NAME_MAP.animationend.animation; + } + + if (!('TransitionEvent' in window)) { + delete EVENT_NAME_MAP.transitionend.transition; + } + for (var baseEventName in EVENT_NAME_MAP) { var baseEvents = EVENT_NAME_MAP[baseEventName]; for (var styleName in baseEvents) {