Can’t register a service worker on Vivaldi

あべ☆アニ Extension のシリーズ予約機能は、ブラウザ拡張内のバックグラウンドページでサービスワーカーを登録し、そこでここのサーバからのプッシュ通知を受け取るような構造になっている。

サービスワーカーのハンドリングや、プッシュ通知をために各デバイスに固有のトークンを得る処理などは、Firebase のライブラリに任せている。このため、今のところシリーズ予約機能は Chrome ファミリーであるブラウザ上でのみ動作する。

さて Vivaldi という謎のブラウザがある。これもまた基本的には Chrome の一族なのだが…以前も似たような Vivaldi 特有の現象に悩まされたことがあったが、どうもえ?そんなところまで手を入れる必要あります?ってくらいいろいろ魔改造されているようだ。

具体的には Vivaldi 上ではサービスワーカーの登録に失敗するのである。こんなエラーが出る:

FirebaseError: Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker for scope ('chrome-extension://feohncbfalalaopkicfimhiphlnffile/firebase-cloud-messaging-push-scope') with script ('chrome-extension://feohncbfalalaopkicfimhiphlnffile/firebase-messaging-sw.js'): An unknown error occurred when fetching the script. (messaging/failed-service-worker-registration).
at ot.<anonymous> (https://www.gstatic.com/firebasejs/8.2.1/firebase-messaging.js:1:36826)
at https://www.gstatic.com/firebasejs/8.2.1/firebase-messaging.js:1:1982
at Object.throw (https://www.gstatic.com/firebasejs/8.2.1/firebase-messaging.js:1:2087)
at i (https://www.gstatic.com/firebasejs/8.2.1/firebase-messaging.js:1:884)

つまるところ、Firebase のライブラリ内でデフォルトのサービスワーカーとしてサイトのルートにある firebase-messaging-sw.js を登録しようとして失敗している。失敗した理由は、”An unknown error occurred when fetching the script.” だそうである。

この文言でググってみると特に Firebase に限ったものではなく、とにかく指定されたファイルを読み込めなかった際に Chrome 自身が出力するメッセージのようである。読み込めない理由は実際にファイルがないとか、スキームが https ではないとかそんな感じになる。しかしあべ☆アニ Extension の場合はそういう理由とは違うようだ。なにしろ Vivaldi でだけ失敗するので。

ということで、何か Vivaldi が抱えてる問題なのでは? という気がする。こういうバグもある。

Let the box be light #2

lightbox を一新した後、コメントにクリックするとCPUパワーを専有してしまうというバグが報告されたのだが、なかなか再現できなかった。そもそも lightbox の中に CPU を専有しそうな重い処理がない。

が、クリック時に 200ms ほどやけに重くなる現象は再現できた。画像のドラッグ時にテキストが選択されることがないように pointerdown/pointerup で document.body.style.userSelect を操作しているのだが、これがリフローを呼び起こすらしく同時に使っている getBoundingClientRect() と相性が悪いようだ。

userSelect を none にするのはドラッグ時ではなく lightbox 実行時全体にすることでこれを回避できた。もちろん副作用としてテキスト(倍率とか)を選択できなくなったがまあ許してくれるねグッドトリップ。

CPU 専有現象自体は Vivaldi 特有のものなのか環境によるものなのかは不明。以前、あべ☆アニを作ってた際にも同じようなことがあったので、Vivaldi 自身がなんかやってるのかなあ…?

The TV program time table #9

虹裏でアナウンスした際に Vivaldi で動かした時、お気に入りのチャンネルを定義する場合のドラッグ&ドロップが正常に動作しないという報告を受けた。

調べてみると、ドラッグ&ドロップのためにはいくつかのイベントを処理しないといけないわけだが、その中でドロップされた際の drop イベントと、ドラッグプロセスが完全に終了した際の dragend イベントの発行される順番の問題のようだ。

仕様では、常に drop -> dragend の順番であり、あべアニもそういう前提で組んであり、実際 Chrome、Opera、Firefox、Edge でテストした際もそういうふうに動作した。Vivaldi ではテストしなかったのだが、これは Vivaldi は結局 Chrome ファミリーであり、Chrome で動けばきっと多分 Vivaldi でも同様のはず…という判断なのだが、びっくりすることに Vivaldi では drop イベントが最後に発行するようなのである。

なんで…?

前述の通り drop -> dragend なのはそういう規格だし、Chrome 自体がそういうふうに動作するのに、何を意図して変更したんだろう? 分からないがとにかく、いずれの順番でも正しくドラッグ&ドロップが動作するように修正。