Zenn
😺

Chrome拡張でタブを自動削除(Teamsのローンチページを消したい)

2023/01/04に公開
Chrome拡張
tech

Chrome web store版

https://chrome.google.com/webstore/detail/tab-closer/cmcmmpklddmejocjlienfddkdlggccbd

OSS版

https://github.com/shimo164/tab-closer

やりたいこと - 開いた時点で用済みなタブを自動で消したい

  • Teams会議を開いたときに、Chromeでローンチ用のタブが開くのですが、これを自動で消したいです。
  • AWS-VPNを接続するときに、空のChromeタブが開くのですが、これを自動で消したいです。

Chrome拡張

あまり経験がなかったのですが、こちらのブログを参考にしました。

https://tech.smartshopping.co.jp/chrome-extension

使い方

インストール

  • コードから直接インストールします
  • 以下のコードをファイルにコピペ(ファイル名は固定)して、close-tabというフォルダに入れます(フォルダ名は任意)。
close-tab/
├── background.js
└── manifest.json
  • chrome://extensions/　にアクセス
  • 右上のデベロッパーモードをONにする
  • 「パッケージ化されていない拡張機能を読み込む」からclose-tabフォルダを指定

とすると読み込まれます。

削除

拡張機能のアイコンを右クリック→削除/Remove from Chrome

設定

  • manifest.jsonは変更なし
  • background.js
    • keyword_blacklist_urlにマッチさせる文字列を書く。キーワードのいずれかに"部分マッチ"すればよいので、全体を書く必要はなし。
    • 複数のときは例えば、const keyword_blacklist_url = ['teams.microsoft.com/dl/launcher/launcher.html', 'some-url'];
    • delay(5000)は5000ミリ秒後にマッチするタブを消すという意味なので調整する

やっていること

  • Chromeのタブが開いたときに、URLを見て、keyword_blacklist_urlに入れておいたキーワードにマッチすれば、待機してからタブを閉じます
manifest.json
{
	"name": "Close tabs",
	"description": "Close tabs with specific keywords after opening 5 seconds.",
	"version": "1.0",
	"manifest_version": 3,
	"background": {
		"service_worker": "background.js"
	},
	"permissions": [
		"tabs"
	]
}
background.js
// Patterns in URLs to match
const keywordBlacklistUrl = [
  'teams.microsoft.com/dl/launcher/launcher.html',
  'stackoverflow',
];

function delay(time) {
  return new Promise((resolve) => setTimeout(resolve, time));
}

function findKeywords(url) {
  let isFound = false;

  keywordBlacklistUrl.forEach((key) => {
    if (url.includes(key)) {
      isFound = true;
    }
  });

  return isFound;
}

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  if (changeInfo.status === 'complete' && tab.active) {
    let url = tab.url;

    if (findKeywords(url)) {
      delay(5000).then(() => {
        chrome.tabs.query({ active: true, lastFocusedWindow: true }, (tabs) => {
          let currentTab = tabs.find((t) => t.id === tabId);
          if (currentTab) {
            chrome.tabs.remove(tabId);
          }
        });
      });
    }
  }
});

何が起きているかを見たい場合は、console.logのコメントアウトを外して、拡張のビューを検証(Inspect view)を開くとログが見れます。

まとめ

  • Chrome Extensionで特定のタブを自動で消せるようにしました

TODO

最低限の機能しかないので追加するかもしれないこと

  • 設定を拡張側から確認、変更できるようにする
  • 消す前にポップアップで通知する
  • 機能の一時的なOFF
  • 消したタブのログ記録(最新5とか)

更新履歴

2023/01/04 初稿
2023/05/16 Javascriptの記法を修正

Discussion