:don:170802 v1.5.0

🎉 v1.5.0リリース 🎉

https://github.com/tootsuite/mastodon/compare/v1.5.0rc3…v1.5.0

まあrc3まで行ったのでそんなに残ってはいないですね。

でかい修正(当社比)

™ ® © を絵文字に変換しない

Do not emojify ™, ® and © - no more gray on gray by MightyPork · Pull Request #4472 · tootsuite/mastodon

やったーっ。

これらの記号がカラー絵文字に変換された結果、グレーになっていたんですね。背景が暗いから読みにくいのなんの。使ったことないから知らんって人はPRの比較画像をどうぞ。

その他

rc2以降一部ブラウザでトゥートが表示されなくなっていたバグ

Load extra polyfills when isIntersecting is undefined (regression #4398) by ykzts · Pull Request #4469 · tootsuite/mastodon

MastodonのWebUIではIntersectionObserverを使って、トゥートが表示範囲内に入っている(もしくは近づいている)時以外はDOM構造を簡略化して、かつ非表示にするようにしています。この判定に isIntersecting というプロパティを使うのですが、IntersectionObserverには対応してるけどこのプロパティは持っていない、というブラウザがいくつかあります。Edgeとか、あと今回の話から察するにしばらく前のChromeとか?

これまで代わりの策を自前で書いていたんですが、IntersectionObserverのpolyfillにこのプロパティも入ったのでそれを使うことにしました。というのがrc2の話。

ここもPolyfillに頼ることにしたので、IntersectionObserverだけでなくisIntersectingの存在までチェックして読み込む必要があるわけですが、上記のPRではそれが漏れていたので、一部ブラウザでうまく動かなくなっていたわけです。

じゃあなぜ気づかなかったのかって話ですが、MastodonではPolyfillをbaseとextraの2セットに分けていて、それぞれまとめて判定・読み込みを行っているんですね。Edgeは object-fit のために既にextraを読み込んでいたので、isIntersectingの判定を行わなくても読み込まれてしまっていたのでした。今後もはまりそうだなーこれ。

rc3で一旦背景色に置き換えた :focus 効果を元に戻す

rc2でトゥートにフォーカス移動できるようになりましたが、その際にフォーカスを表すoutlineが表示されていました。マウスで操作しているときには邪魔ですし、ブラウザによっても見た目が違うし、ということで最初はひとまず消してしまおうという話があったのですが、流石にそれはアクセシビリティ上まずいということで背景色を変えることにしました。

Remove outline from focused toot by ykzts · Pull Request #4448 · tootsuite/mastodon

ただこれはこれで、背景色とテキストのコントラストが下がって読みにくい、既に背景色を変えているDMと紛らわしい、といった意見が出てoutlineに戻すことになりました。この時もChromeの表示に揃えるという提案があったのですが、トゥート以外の場所で表示されるoutlineは今回ノータッチなので、やっぱりデフォルトの挙動にもどすか、という結論に。

Remove outline from focused toot by ykzts · Pull Request #4448 · tootsuite/mastodon

ちなみに、ブラウザ間での違いについて、手元で少し試した感じだと次のような違いがありました。

  • Chrome: 青い線、クリックでも常にoutlineを表示
  • Firefox: 点線、一度キーボードでのフォーカス移動するとクリックでも表示される
  • Edge: 点線、クリックでは常にoutlineが表示されない

結構違いますね…。

SMTP_TLSのサンプルを .env.production.sample に追加

Show SMTP_TLS in config sample by ScienJus · Pull Request #4477 · tootsuite/mastodon

SMTPSなメールサーバーを使う人はオンにしましょうね。