REQUIRED INFORMATION
Ext version tested:
  • Ext 4.1b3
  • Ext 4.1b2
  • Ext 4.1b1

Browser versions tested against:
  • FF 10 (firebug 1.91)
  • IE8
  • Chrome 16

Description:
  • The 'blur' event for TriggerField components does not supply an event object to its listeners, even though the documentation indicates that it should. (Note: I'm referring to the 4.1 docs bundled with the beta release, not the out-of-date 4.0 documentation online.)

Steps to reproduce the problem:
  • Create a TriggerField with a listener for the 'blur' event.
  • Attempt to use the event object parameter given to the listener function.

The result that was expected:
  • The event object should be passed to the listener.

The result that occurs instead:
  • The event object is undefined.

Test Case:
Code:
Ext.onReady(function() {
	Ext.create('Ext.form.field.Trigger', {
		renderTo: Ext.getBody(),
		listeners: {
			focus: function(cmp, event) {
				console.log(event); // prints an appropriate event object
			},
			blur: function(cmp, event) {
				console.log(event); // prints undefined
			}
		}
	});
});
HELPFUL INFORMATION
Debugging already done:
  • This appears to be an issue in the source for the trigger field's mimicBlur and triggerBlur methods:
    Code:
    // private
    mimicBlur: function(e) {
        if (!this.isDestroyed && !this.bodyEl.contains(e.target) && this.validateBlur(e)) {
            this.triggerBlur(); // the event object 'e' is not passed to the triggerBlur method
        }
    },
    
    // private
    triggerBlur: function() {
        var me = this;
        me.mimicing = false;
        me.mun(me.doc, 'mousedown', me.mimicBlur, me);
        if (me.monitorTab && me.inputEl) {
            me.un('specialkey', me.checkTab, me);
        }
        Ext.form.field.Trigger.superclass.onBlur.call(me); // no event object is passed to the superclass
        if (me.bodyEl) {
            me.bodyEl.removeCls(me.wrapFocusCls);
        }
    },

Possible fix:
  • Starting on line 379 of Trigger.js, modify the mimicBlur and triggerBlur methods to pass the event object:
    Code:
    mimicBlur: function(e) {
        if (!this.isDestroyed && !this.bodyEl.contains(e.target) && this.validateBlur(e)) {
            this.triggerBlur(e);
        }
    },
    
    triggerBlur: function(e) {
        var me = this;
        me.mimicing = false;
        me.mun(me.doc, 'mousedown', me.mimicBlur, me);
        if (me.monitorTab && me.inputEl) {
            me.un('specialkey', me.checkTab, me);
        }
        Ext.form.field.Trigger.superclass.onBlur.call(me, e);
        if (me.bodyEl) {
            me.bodyEl.removeCls(me.wrapFocusCls);
        }
    }

Additional CSS used:
  • only default ext-all.css

Operating System:
  • Win7