Sencha Touch 2でのイベントキャプチャー

Ext JSやSencha Touch 1では、あるオブジェクトのイベントをすべてキャプチャーする、
captureというメソッドが、Ext.util.Observableにありました。

このメソッドは、デバッグの時や、コンポーネントのイベント発火の挙動を確かめるときに非常に便利です。

Ext.util.Observable.capture(someCmp, function () {
    console.log(argumetns);
});

なんてやっておくと、someCmpで何かイベントが発生したら全部ログしてくれます。
そのログをみて、「はぁ、こういう風に動くんだ」とか「あ！ここではイベント発火しないんだ！」とかわかるわけです。

と、開発時に便利なメソッドなんですが、Sencha Touch 2では廃止されて、なくなってしまいました。そのことをつぶやいたら、 @kotsutsumi さんが同じ事をやる方法を教えてくれました。

Ext.define('Override.mixin.Observable', {
    override : 'Ext.mixin.Observable',

    fireEvent : function(eventName) {
        console.log(eventName);

        this.callOverridden(arguments);
    },

    fireAction : function(eventName) {
        console.log(eventName);

        this.callOverridden(arguments);
    }
});

ちなみに、Ext.util.ObservableもExt.mixin.ObservableもSencha Touch 2では同じです。

Ext.defineのoverride指定で、fireEventをオーバーライドしています。
これを実行した後にイベントを装着したクラスをインスタンス化したら、
それらみんなのオブジェクトをキャプチャーできるようになります。