🌊

captureVisibleTab を使うと出てくるエラー

2023/11/10に公開

ウィンドウのスクリーンショットを撮影するために次のようなコードを書いていた。

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  if (changeInfo.status === "complete") {
    const tabData = { id: tab.id, title: tab.title, url: tab.url, favicon: tab.favIconUrl, aspect: aspect };  
    chrome.tabs.captureVisibleTab((imageURl) => {
      tabData.screenShot = imageURl;
      chrome.storage.local.set({ [tab.id]: tabData });
      console.log(`[${tab.id}] をスクショしました`);
    });
  }
})

スクショができているか確認するために新しいタブを開くと次のようなエラーが毎回出た

Unchecked runtime.lastError: The 'activeTab' permission is not in effect because this extension has not been in invoked.

厄介なことにpermissionactiveTabを追加してもこのエラーは解消されなかった。
これは新しいタブを開いたときだけに発生し、ページ移動をしたり再度読み込みしたときは正常にスクショが撮れていたので特に問題があるわけではない。しかし新しいタブを開くたびにエラーが発生して嫌な気分になるので次のようにコードを付け足すと表示されなくなった。

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  if (changeInfo.status === "complete") {
    const tabData = { id: tab.id, title: tab.title, url: tab.url, favicon: tab.favIconUrl, aspect: aspect };  
+   if (tab.url === 'chrome://newtab/') {
+     return;
+   }
    chrome.tabs.captureVisibleTab((imageURl) => {
      tabData.screenShot = imageURl;
      chrome.storage.local.set({ [tab.id]: tabData });
      console.log(`[${tab.id}] をスクショしました`);
    });
  }
})

ポイントは新しいタブを開いたときの特別なURLchrome://newtab/に移動したときだけcaptureVisibleTabを動作させないことだ。新しいタブを開くとはChrome視点ではchrome://newtab/に移動することになるのだが、なぜかこのページではcaptureVisibleTabが使えない。だから条件分岐でcaptureVisibleTabを使わないようにした。

注意点としては保存しなかったスクショを削除する処理を書いてしまわないようにすることだ。次のようなコードを付け足す。

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  if (changeInfo.status === "complete") {
    const tabData = { id: tab.id, title: tab.title, url: tab.url, favicon: tab.favIconUrl, aspect: aspect };  
    if (tab.url === 'chrome://newtab/') {
      return;
    }
    chrome.tabs.captureVisibleTab((imageURl) => {
      tabData.screenShot = imageURl;
      chrome.storage.local.set({ [tab.id]: tabData });
      console.log(`[${tab.id}] をスクショしました`);
    });
  }
})

+// タブを削除したらスクショを削除
+chrome.tabs.onRemoved.addListener((tabId, removeInfo) => {
+  chrome.storage.local.remove(String(tabId), () => {
+    console.log(`[${tabId}] を削除しました`)
+  })
+})

タブを削除する処理では、全てのタブでスクショを保存していることを前提に書かれているので、保存していないタブのスクショも削除してしまう。例えば新しいタブを開いてすぐに削除すれば存在しないキーを削除してることになる。(さっき説明したように、新しいタブを開いたときはcaptureVisibleTabは実行しないようにしているからだ)

存在しないキーを削除してもエラーは起こらず、undefinedが返ってくるだけなので問題はない。しかし念の為、キーを検索してキーが存在した場合だけ削除するようにしておく。

Discussion