Electronのデスクトップ通知の動作を変更する

ElectronではNotificationを使ってWebアプリケーションと同様にデスクトップ通知をすることができます。 しかし、electron-mattermostのようにBrowserWindowやWebViewに外部HTMLを読み込んで表示するだけのアプリケーションでは、通知の動作が外部HTMLによって操作されるので、元のElectronのままでは以下のような動作を実現することができませんでした。

  • 通知をクリックしたときに、隠した/最小化したBrowserWindowにフォーカスを移し、かつ元々のNotification.onclickを実行する
  • 通知方法を変更し、Windows 7ではトーストの代わりにバルーンを表示する

そこでNotificationを直接上書きしてみたところ、デスクトップ通知の動作を変更できました。

var NativeNotification = Notification;

Notification = function(title, options) {
  this.notification = new NativeNotification(title, options);
};

Notification.requestPermission = function(callback) {
  callback('granted');
};

Notification.prototype.close = function() {
  this.notification.close();
};

Notification.prototype.__defineSetter__('onclick', function(callback) {
  this.notification.onclick = function() {
    electron.remote.getCurrentWindow().show();
    callback();
  };
});

通知を表示する部分に関してはElectronに頼りたいので、NativeNotificationに元々のNotificationを保持させておきます。その後、Notificationのコンストラクタやメンバを再設定することで通知動作を変更する、というコードになっています。

このコードでは受け取った通知関連のパラメータをそのままthis.notificationに渡してやることで元の通知動作を維持しつつ、通知元のBrowserWindowを表示します。Electronの通知でなく他の方法で通知を表示したければ、コンストラクタの中身を書き換えることになります。後はHTML側で通常通りnew Notification()が呼び出されたときに、変更された動作を使って通知を発生させられます。