Results 1 to 2 of 2

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

    Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-7755 in 4.2.0.265.
  1. #1
    Sencha User
    Join Date
    May 2012
    Posts
    3
    Vote Rating
    0
      0  

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

    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:


    Code:
    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

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    18,597
    Vote Rating
    874
      0  

    Default

    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.
    Evan Trimboli
    Twitter - @evantrimboli

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •