You found a bug! We've classified it as TOUCH-5443 . We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #1
    Sencha Premium Member
    Join Date
    Aug 2012
    Location
    Germany
    Posts
    15
    Vote Rating
    3
    RonnySchleicher is on a distinguished road

      0  

    Exclamation Ext.Viewport.un('resize', 'myFunction', myScope); doesn't work in release!

    Ext.Viewport.un('resize', 'myFunction', myScope); doesn't work in release!


    Touch version tested:
    • Touch 2.3.1
    • Sencha CMD 4.0.2.67
    Browser versions tested against:
    • Chrome 33
    Description:

    The following function calls are not working properly in a release (after call 'sencha app build package' or 'sencha app build production').

    Code:
    Ext.Viewport.un('resize', 'myFunction', myScope); 
    Ext.Viewport.un('painted', 'myFunction', myScope);
    Suspected cause of the error in

    touch/src/Component.js

    The <deprecated ...> </deprecated> are missing in doAddListener line 2340 and 2344?
    Or should that not be in there in doRemoveListener() function in line 2362 and 2366?
    I think the line must be removed from 'doRemoveListener' function.


    Current code in 2.3.1 in line 2328, following

    Code:
    //@private
        doAddListener: function(name, fn, scope, options, order) {
            if (options && 'element' in options) {
                //<debug error>
                if (this.referenceList.indexOf(options.element) === -1) {
                    Ext.Logger.error("Adding event listener with an invalid element reference of '" + options.element +
                        "' for this component. Available values are: '" + this.referenceList.join("', '") + "'", this);
                }
                //</debug>
    
    
                // The default scope is this component
                return this[options.element].doAddListener(name, fn, scope || this, options, order);
            }
            if (name == 'painted' || name == 'resize') {
                return this.element.doAddListener(name, fn, scope || this, options, order);
            }
    
    
            return this.callParent(arguments);
        },
    
    
        //@private
        doRemoveListener: function(name, fn, scope, options, order) {
            if (options && 'element' in options) {
                //<debug error>
                if (this.referenceList.indexOf(options.element) === -1) {
                    Ext.Logger.error("Removing event listener with an invalid element reference of '" + options.element +
                        "' for this component. Available values are: '" + this.referenceList.join('", "') + "'", this);
                }
                //</debug>
    
    
                // The default scope is this component
                this[options.element].doRemoveListener(name, fn, scope || this, options, order);
            }
            //<deprecated product=touch since=2.1>
            if (name == 'painted' || name == 'resize') {
                return this.element.doRemoveListener(name, fn, scope, options, order);
            }
            //</deprecated>
    
    
            return this.callParent(arguments);
        },

    My Workaround in line 2362 and 2366
    I removed the <deprecated ...> </deprecated> in line 2362 and 2366.

    Code:
    //@private
        doAddListener: function(name, fn, scope, options, order) {
            if (options && 'element' in options) {
                //<debug error>
                if (this.referenceList.indexOf(options.element) === -1) {
                    Ext.Logger.error("Adding event listener with an invalid element reference of '" + options.element +
                        "' for this component. Available values are: '" + this.referenceList.join("', '") + "'", this);
                }
                //</debug>
    
    
                // The default scope is this component
                return this[options.element].doAddListener(name, fn, scope || this, options, order);
            }
            if (name == 'painted' || name == 'resize') {
                return this.element.doAddListener(name, fn, scope || this, options, order);
            }
    
    
            return this.callParent(arguments);
        },
    
    
        //@private
        doRemoveListener: function(name, fn, scope, options, order) {
            if (options && 'element' in options) {
                //<debug error>
                if (this.referenceList.indexOf(options.element) === -1) {
                    Ext.Logger.error("Removing event listener with an invalid element reference of '" + options.element +
                        "' for this component. Available values are: '" + this.referenceList.join('", "') + "'", this);
                }
                //</debug>
    
    
                // The default scope is this component
                this[options.element].doRemoveListener(name, fn, scope || this, options, order);
            }
            if (name == 'painted' || name == 'resize') {
                return this.element.doRemoveListener(name, fn, scope, options, order);
            }
    
    
            return this.callParent(arguments);
        },
    Steps to reproduce the problem:
    • Create a new Sencha App (sencha generate app MyApp../MyApp)
    Copy this in view\Main.js
    Code:
    Ext.define('MyApp.view.Main', {    extend   : 'Ext.tab.Panel',
        xtype    : 'main',
        requires : [
            'Ext.TitleBar'
        ],
        config   : {
            tabBarPosition : 'bottom',
    
    
            items : [
                {
                    title   : 'Event Problem',
                    iconCls : 'action',
    
    
                    items : [
                        {
                            docked : 'top',
                            xtype  : 'titlebar',
                            title  : 'Test Event'
                        },
                        {
                            xtype   : 'button',
                            text    : 'Ext.Viewport.on()/un()',
                            handler : function (me) {
                                if (MyApp.view.Main.isConneted) {
                                    console.log('handler un');
                                    Ext.Viewport.un('resize', MyApp.view.Main.testOutput, this);
    
    
                                } else {
                                    console.log('handler on');
                                    Ext.Viewport.on('resize', MyApp.view.Main.testOutput, this);
                                }
                                MyApp.view.Main.isConneted = !MyApp.view.Main.isConneted;
                                me.setText(MyApp.view.Main.isConneted ? 'Event connected' : 'Event disconnected');
                            }
                        }
                    ]
                }
            ]
        },
        statics  : {
            isConneted : false,
            testOutput : function () {
                console.log('testOutput');
                Ext.Msg.alert('Title', 'The quick brown fox jumped over the lazy dog.');
            }
        }
    });
    The result that was expected:
    • click the button -> message box appears ->ok
    • resize your browser window -> message box appears ->ok
    • click the Button again
    • resize your browser window -> NO message box appears ->ok
    The result that occurs instead:
    • make a production version off MyApp ('call sencha app build production' in your App root folder)
    • starts the Sencha Production App (http://localhost/MyApp/build/product...App/index.html) in your browser
    • click the button -> message box appears ->ok
    • resize your browser window -> message box appears ->ok
    • click the button again
    • resize your browser Window -> message box appears -> error -> the event was NOT disconnected in the production version!
    Ext.Viewport.un('resize', 'myFunction', myScope);
    and
    Ext.Viewport.un('painted', 'myFunction', myScope);
    not working in production/package version.

  2. #2
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    3,970
    Vote Rating
    134
    fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all

      0  

    Default


    Are they working in testing mode? Can you put together a small test case that illustrates this issue.
    Get more personalized support via a support subscription.

    Want to learn Sencha Touch 2? Check out
    Sencha training
    Sencha Touch in Action

    Need more help with your app? Hire Sencha Services services@sencha.com

    When posting code, please use BBCode's CODE tags.

    Need to include a test case use:
    The official Sencha Fiddle

  3. #3
    Sencha Premium Member
    Join Date
    Aug 2012
    Location
    Germany
    Posts
    15
    Vote Rating
    3
    RonnySchleicher is on a distinguished road

      0  

    Default


    The sample project for this Bug:

    Download

  4. #4
    Sencha Premium Member
    Join Date
    Aug 2012
    Location
    Germany
    Posts
    15
    Vote Rating
    3
    RonnySchleicher is on a distinguished road

      0  

    Default


    I have the post reviewed in accordance with the 'template bug format' and an Example project provided. Need anything else?

  5. #5
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    3,970
    Vote Rating
    134
    fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all fmoseley is a name known to all

      0  

    Default


    Thanks for the report! I have opened a bug in our bug tracker.

Thread Participants: 1

Tags for this Thread