Youtube用のChrome拡張機能を作ってストアに配信してみた。

私はずっとYoutubeに欲しい機能があったのです。
それはライブチャットのデフォルトを「すべてのチャット」にするという機能。

というのもチャット欄はデフォルトで「トップチャット」になっているのですが私は不適切なコメントでさえも見たいタイプなのでいつも「すべてのチャットに」切り替えていました。

Tray

だけど毎度毎度切り替えがめんどくさい！！

設定にありそうなのにどれだけ探しても無い…拡張機能にもない…
しょうがない。。以前から興味はあったので結局拡張機能を自作することにしました。

まずは拡張機能の作り方を調べてみると最低限以下のファイルが必要とのこと。

├── content.js（実際に動かすファイル）
├── manifest.json（設定ファイル）　
├── icon.png（拡張機能のアイコン画像）

├── content.js（実際に動かすファイル）
├── manifest.json（設定ファイル）　
├── icon.png（拡張機能のアイコン画像）

JSはほぼ初心者ですが実際に手を動かしてみることにします。
テキストエディタはVisual Studio Codeを使いました。

拡張機能の設定ファイルです。備忘録として今回設定した各項目についてまとめておきます。

{
  "name": "Show All YouTube Chats by Default",
  "version": "1.0.0",
  "manifest_version": 3,
  "description": "YouTubeのデフォルトチャット表示をトップチャットからすべてのチャットに変更します。",
  "icons": {
    "96": "icon48.png"
  },
  "content_scripts": [
    {
      "matches": ["*://www.youtube.com/*"],
      "js": ["content.js"]
    }
  ]
}

{
  "name": "Show All YouTube Chats by Default",
  "version": "1.0.0",
  "manifest_version": 3,
  "description": "YouTubeのデフォルトチャット表示をトップチャットからすべてのチャットに変更します。",
  "icons": {
    "96": "icon48.png"
  },
  "content_scripts": [
    {
      "matches": ["*://www.youtube.com/*"],
      "js": ["content.js"]
    }
  ]
}

実際に動かすプログラムです。JSはほぼ知識がないので1週間以上かかってしまいました。
多分無駄な記述や間違いもあると思いますがなんとか動くものができました。

Tray

動いたときは少し感動しましたね…

// チャット欄の変化を監視して、都度ボタンを探しにいく
observeChatContainer(() => {
  scheduleButtonClick();
});

function scheduleButtonClick() {
  poll(() => {
    if (「すべてのチャット」ボタンが見つかった) {
      ONなら クリック;
      お知らせバナーが有効なら 非表示にする;
      return 完了;
    }
    1秒後にもう一度試す（最大15回）;
  });
}

// ページ遷移・シアターモードの変化を検知したら
onPageOrTheaterChange(() => {
  それまでの監視を止めて再設定;
  scheduleButtonClick();
});

// チャット欄の変化を監視して、都度ボタンを探しにいく
observeChatContainer(() => {
  scheduleButtonClick();
});

function scheduleButtonClick() {
  poll(() => {
    if (「すべてのチャット」ボタンが見つかった) {
      ONなら クリック;
      お知らせバナーが有効なら 非表示にする;
      return 完了;
    }
    1秒後にもう一度試す（最大15回）;
  });
}

// ページ遷移・シアターモードの変化を検知したら
onPageOrTheaterChange(() => {
  それまでの監視を止めて再設定;
  scheduleButtonClick();
});

完成した拡張機能はYouTubeライブやアーカイブを開くと以下のように自動ですべてのチャットに切り替わります。

実装後、結局 Chrome ウェブストアにも公開しちゃいました。

公開当初は25人のインストールで驚いていたのですが、2026年9月時点では593人まで増えていました。
評価も5点満点中5.0（5件）をいただいていて、素直に嬉しいです。

Chrome 拡張機能は500円の登録費を払えば誰でもウェブストアに公開できます。
一度登録すれば次からの公開は無料です。公開までの流れはこんな感じ。

公開してからも「あったら便利かも」と思った機能を少しずつ追加してきました。
YouTube側の仕様変更で出てきた不具合も、その都度直しています。

特にv1.2で追加したポップアップのON/OFF切り替えは我ながら便利です。
「配信を録画で見返すときだけ一時的に切りたい」といった場面で役立っています。

Tray

JSの知識ほぼゼロから始めた拡張機能が、ここまで長く使ってもらえるのは素直に嬉しいです。

とにかく途中で投げ出さず最後まで完成させられて良かったです。
ボタン1つクリックさせるだけなのに思った以上に苦戦しました。プログラマーは大変ですね…
今後は、例えば固定コメントや登録者限定メッセージなど、個人的にあまり必要ない機能を非表示にできる設定などを追加できたらいいなぁとふんわり思ってます。
同じ悩みを持っている方の参考になれば嬉しいです！

Tray

実際にアップデートを重ねてきたので、この記事にも追記しました！