web-push - pushsubscriptionchange イベント処理コードをテストするにはどうすればよいですか?

Question

このpushsubscriptionchangeイベントは、プッシュ通知サーバーがクライアントに再サブスクライブを要求したときに、ブラウザーによって発生します。テストのためにこのイベントを手動でトリガーするにはどうすればよいですか?

Answer 1

残念ながら、この機能のエンド ツー エンドのテストを行うことはできません。あなたができる最善の方法は、Service Worker から JS を介してイベントを発生させることです。

function triggerSubscriptionChange() {
  registration.pushManager.getSubscription().then(subscription => {
    if (subscription) {
      console.log("subscribed, subscription", subscription);
      return subscription.unsubscribe();
    }
  }).then(() => {
    console.log("unsubscribed");
    return registration.pushManager.subscribe({
      userVisibleOnly: true
    });
  }).then(subscription => {
    console.log("subscribed, subscription", subscription);
    self.dispatchEvent(new ExtendableEvent("pushsubscriptionchange"));
  });
}

Answer 2

このイベントは、ユーザーがプッシュ許可を削除して再付与したときにもトリガーされます ( https://github.com/w3c/push-api/issues/116を参照)。

たとえば、Firefox では、サイト ID アイコンをクリックし、[許可] セクションで [通知の受信] に対して [ブロック] を選択し、[許可] を選択します。

pushsubscriptionchangeイベントがトリガーされます。