We continue to see this issue with some message boxes on some Android 5 devices. Among others, we've seen it on a Nexus running 5.0.1 in an iOS/Android cordova app. It doesn't happen with all message boxes, but the ones effected can easily replicate the problem with a few attempts at showing. It seems to only happen in the cases where we use the Ext.Msg singleton instead of creating a new Ext.MessageBox.
It seems that the source of the issue is that in our case the transitionend event which is used in CssTransition.js to call onTransitionEnd is only fired once during the show animation in the cases where the message box breaks. onTransitionEnd is responsible for running refreshRunningAnimationsData. It looks like it should be run multiple times.
On iOS and in other android version, the transitionend event is fired multiple times. The last time it's fired, refreshRunningAnimationsData calls onAnimationEnd & then onAllAnimationsEnd. Those animation end events are not called in the case the transitionend event is only fired 1x.
According to the spec, transitionend should fire, unless the transition is removed before it completes. I'm not sure why it doesn't occur 100% of the time for all messageboxes, but absent the transitionend event firing again, the animation is never going to complete and call animationend, which can leave the message box and app in an unstable state.
Although we've disabled the show animations - hide animation does not exhibit this problem - disabling animations is not a suitable solution & is merely a temporary hack.
This latest detail might help someone fix the underlying problem. We found that if we override the popin & fade animations so that they don't change opacity, the problem went away. We're not sure if it's the opacity animation that's at fault or just reducing the number of transitions for the animation is what fixed it.
Although this works fine on affected Android 5 webviews, it's caused problems on older webkit browsers. On older Android browsers not the animated object is super blury until the animation completes. It might be related to an old ant-aliasing issue and we haven't solved that issue yet.
Are any sencha developers working to solve this serious issue?