Animations needs to be stopped manually - by design or bug?

[m_laci]

REQUIRED INFORMATION


Ext version problem encountered:

• Ext 4.1.3 Build date: 2012-10-25 15:13:53 (240477695016a85fb9ed1098fd5f8e116327fcc3)

Ext version problem tested but not encountered:

• Ext 4.1.0 (?) Build date: 2012-04-20 14:10:47 (19f55ab932145a3443b228045fa80950dfeaf9cc)

Browser versions tested against:

• Chrome 23.0.1271.64
• IE 9.0.10

Description:

• Animations attached to the body of an Exp.panel.Panel needs to be stopped manually.
• Is this something is required by design? Previous version did not had an issue with that

Steps to reproduce the problem:

• 1. Create a class that extends Ext.panel.Panel
• 2. In the onRender use this.body.animate to attach an animation
• 3. Create an instance of this class
• 4. Destroy the created instance of this class

The result that was expected:

• It appears to work correctly

The result that was not expected:

• It keeps outputting to following error to the console: "Cannot read property 'style' of undefined

Test Case:

describe('Animation_issues', function () {
    Ext.define('AnimatedPanel', {
        extend: 'Ext.panel.Panel',
        onRender: function () {
            var me = this;
            me.callParent(arguments);
            me.body.animate({
                to: {
                    opacity: 1
                },
                duration: 2000,
                easing: "easeIn",
                from: {
                    opacity: 0
                }
            });
        },


        onDestroy: function () {
            var me = this;
            /*
            if (me.body && me.body.getActiveAnimation()) {
                me.body.stopAnimation();
            }
            */
            me.callParent(arguments);
        }
    });


    it('should stop animations properly', function () {
        var panel = Ext.create('AnimatedPanel', { renderTo: Ext.getBody()});
        panel.show();
        panel.destroy();
    });
});

Possible fix:

• If this is something we are required to do by design, than we should call manually stopAnimation

Additional CSS used:

• only default ext-all.css

Operating System:

• Windows 7 Enterprise

[evant]

I guess it probably wouldn't hurt to do that. However for elements the component doesn't know about, that would need to be up to you to stop the animation.