I have encountered some strange behavour with animation. May be it's my mistake, but I would like to describe the case.
I have MVC app, where we support views and card layout. One view - is login page and I have login and lgout procedure. Our transition is slide. Everything works fine. But I found one case:
1) after login and running the app I make logout at any time, which makes these steps
- destroy all views and controllers:
Code:
view.destroy();
delete Ext.app.Application.getControllerInstances()[controllerName];
delete Ext.app.Application.controllers[controllerName];
- redirect to Login Page
Code:
Ext.Viewport.setActiveItem(loginPageViewInstance);
At the moment of logout I have only one view, because I destroy view every time after switching to another.

2) I enter my app for the second time, and everyting is fine, but when I try to open view, which was the last showed in a previous session before logout, this view has got visibility: "hidden !important" style and I see only blank page with my invisible view.

I found, why is it happened. Every time I switch between views I run Ext.Animator's CSS transition for animation. It log every animation in Ext.Animator.runningAnimationsData array, where in my case I have two animation sessions for previous hiding view and next showing view at one transition operation.
When I make logout and invoke view.destroy as a child of Ext.Viewport it makes parent.remove(view), i.e. Ext.Viewport.remove(view). Which starts animation operation over my last view, and unfortunately it leaves info of last view in Ext.Animator.runningAnimationsData like animation did not finished. As a result after logout and second view showing Ext.Animator thinks that this view is visible (because of this info) and doesn't remove visibility: hidden from it's style.
I make this hack code:
Code:
delete Ext.Animator.runningAnimationsData[view.id];
but it's not good to use private code. I would be happy to receive someone's advice or make it clear, what is wrong.