どうも、皆さんは GitLab 使っていますか？
筆者はプライベートでもそうですが、会社でも GitLab を使っているため基本的にブラウザのタブには GitLab のタヌキが氾濫しています。流石にこれでは見辛い……ということで、 GitLab の favicon をプロジェクトのロゴに変更するブラウザ拡張を作ってみました。
5年ほど前から GitLab の Issue には上がっているようですが実装はされていないようなので、ブラウザ拡張という形で作ってみた、というのが背景です1。
更新 2024-02-05
v2.0.0 で名前を Tanuki Utilities に変更しました。
v2.1.0 で Copy reference ボタンを常時表示する機能を追加しました。
詳しくは Tanuki Utilitiesの紹介（旧 gitlab-project-favicon） - Sogo.dev をご覧ください。
更新 2022-10-15
デフォルトですべてのサイトで適用されるように変更しました。既存ユーザーの動作に影響を与えることはないので、引き続きご利用いただければと思います。
概要
指定された GitLab サイト (gitlab.com or セルフホスト GitLab) で favicon をプロジェクトのロゴに変更します
- ソースコード
- Firefox
- Chrome
つかいかた
上記のリンクからお使いのブラウザに拡張機能をインストールすれば OK です！
適用したいサイトを限定したい場合は、下記の手順を実施することで拡張機能を有効にするサイトを絞ることができます。
- Firefox の場合は about:addons に、 Chrome の場合は chrome://extensions にアクセスして、拡張機能の設定ページを開きます
- GitLab サイトのホスト名を指定します。例えば gitlab.com や gitlab.example.com のようなホスト名をカンマ区切り・改行区切りで指定します
- 設定を終えた後 Gitlab のページを開くと favicon が変わっていることが確認できるはずです
作ってみた感想
- 会社の Slack に作ってみたと投稿したら割と反響があって地味にみんな困ってたんだと発見
- プロジェクトのロゴになって見分けやすくはなったが、逆に GitLab のタブかどうかが分かりにくくなってしまったかも
- 動的に画像を作成して favicon を変えてみたい
- ブラウザ拡張機能を作るのは簡単
- ブラウザ間で基本的な仕様は同じ
- Chrome が v3 のマニフェストしか受け付けなくなってしまったので、 Firefox 版とマニフェストを変える必要性があった
- メソッド名やインターフェースに少し違いがあるので、そこは if 文で分岐して差異を吸収した2
最後に
少し宣伝。筆者のチームが開発に携わるニフクラ DevOps with Gitlab を使えば簡単にセルフホスト GitLab 環境が手に入ります👍
それでは良い GitLab ライフを〜