Bug in Button.toggle() when called before rendering

[Dipish]

REQUIRED INFORMATION
Ext version tested:

• Ext 4.0.7

Browser versions tested against:
Irrelevant

DOCTYPE tested against:
Irrelevant

Description:
There is a bug in Button.toggle() code that causes an error when called before the button is rendered.


Steps to reproduce the problem:

• Instantiate a button, don't render it
• Call the toggle method

The result that was expected:

• The button object should change it's state without breaking things

The result that occurs instead:

• Error: "Uncaught TypeError: Cannot read property 'dom' of undefined"

Test Case:

No test case, see code below.



HELPFUL INFORMATION


Debugging already done:

• There is a line outside the rendered that interacts with the DOM. See code:

    toggle: function(state, suppressEvent) {        var me = this;
        state = state === undefined ? !me.pressed : !!state;
        if (state !== me.pressed) {
            if (me.rendered) {
                me[state ? 'addClsWithUI': 'removeClsWithUI'](me.pressedCls);
            }
            me.btnEl.dom.setAttribute('aria-pressed', state); // <- should go inside the check
            me.pressed = state;
            if (!suppressEvent) {
                me.fireEvent('toggle', me, state);
                Ext.callback(me.toggleHandler, me.scope || me, [me, state]);
            }
        }
        return me;
    },

Possible fix:

/** * Fixes Button.toggle() bug when called before rendering
 * Found in Ext 4.0.7
 */
Ext.override(Ext.button.Button, {
    toggle: function(state, suppressEvent) {
        var me = this;
        state = state === undefined ? !me.pressed : !!state;
        if (state !== me.pressed) {
            if (me.rendered) {
                me[state ? 'addClsWithUI': 'removeClsWithUI'](me.pressedCls);
                me.btnEl.dom.setAttribute('aria-pressed', state);   // <- This was outside the check
            }


            me.pressed = state;
            if (!suppressEvent) {
                me.fireEvent('toggle', me, state);
                Ext.callback(me.toggleHandler, me.scope || me, [me, state]);
            }
        }
        return me;
    }
});

P.S. The bug is also referred to in this thread but apparently nobody posted a bug report and thus it still hasn't been fixed.

[mitchellsimoens]

Thank you for looking into this and providing a possible fix. I can reproduce this error in 4.0.7 but not in our latest code which will be 4.1.0 beta