title: ExtJs manually firing Click event, button param is different from mouse click
body: <p>So, I have a login controller, you can click login with mouse or press Enter key, like this:</p>
  
  <pre><code>Ext.define('My.controller.Login', {
      extend: 'Ext.app.Controller',
  
      init: function(application) {
          this.control({
              "#idLogin button": {click: this.onButton},
              "#idLogin form &gt; *": {specialkey: this.onKey}
          });
      },
  
      onButton: function(button, e, eOpts) {
          var win = button.up('window'); // the login window
          //do more stuff...
      },
  
      onKey: function (field, el) {
          if (el.getKey() == Ext.EventObject.ENTER) //ENTER key performs Login
              Ext.getCmp('#idLogin button').fireEvent('click');
      }
  });
  </code></pre>
  
  <p>I realised when I use the mouse to click the Login button, <code>onButton</code> function works properly, <code>button.up()</code> returns me the Login <code>window</code>.</p>
  
  <p>However, if I pressed Enter key and fires the <code>onKey</code> function to do <code>fireEvent('click')</code>, in this case the <code>onButton</code> fires up but parameter <code>button</code> NOT the same as the <code>button</code> parameter received when you click by mouse! And this time, <code>button.up()</code> function is undefined.</p>
  
  <p>Question is, why does <code>fireEvent('click')</code> give me a different button parameter? </p>