拡張機能「Bookmarks Tab Pinned」「Canonical Url Open」を、Manifest V3へ移行した時のメモ

何故Manifest V3にしたの？

Manifest V2が2023年6月ぐらいで使えなくなる様です
Manifest V3に対応しないと…ヤバイですね☆

全力全開！グーグルストライク💢

manifest.json

"manifest_version" を 3 にする

  "manifest_version": 2,
  "manifest_version": 3,

"browser_action" を "action" に変更

  "browser_action": {
    "default_icon": {
      "16": "images/icon16.png",
      "19": "images/icon19.png",
      "32": "images/icon32.png",
      "38": "images/icon38.png",
      "64": "images/icon64.png"
    },
    "default_title": "Canonical Url Open"
  },
  "action": {
    "default_icon": {
      "16": "images/icon16.png",
      "19": "images/icon19.png",
      "32": "images/icon32.png",
      "38": "images/icon38.png",
      "64": "images/icon64.png"
    },
    "default_title": "Canonical Url Open"
  },

"background" 内の "scripts" や "persistent" を "service_worker" に変更

  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "background": {
    "service_worker": "background.js"
  },

"permissions" 内の一部表記を "host_permissions" に移す

URL指定は "host_permissions" に移動となります

  "permissions": ["http://*/*","https://*/*","tabs","storage"]
  "permissions": ["tabs","storage"],
  "host_permissions": ["http://*/*","https://*/*"]

background.js

"background" に指定された、バックグラウンドで動くjsコード

chrome.browserAction.onClicked.addListener を chrome.action.onClicked.addListener に変更

browserAction を action に変更 

chrome.browserAction.onClicked.addListener(function(tab){
chrome.action.onClicked.addListener(function(tab){

chrome.extension.getURL を chrome.runtime.getURL に変更

background.jsが"service_worker"で動く仕様に変わったからなのか、変更しないとダメな様です
extension を runtime に変更

url = chrome.extension.getURL(url);
url = chrome.runtime.getURL(url);

chrome.tabs.getAllInWindow を chrome.tabs.query に変更

V2の時点で既に chrome.tabs.getAllInWindow は推奨しないになっていて、V3で廃止された模様
仕方ないので chrome.tabs.query を使う、書き方が変わる事に注意

  chrome.tabs.getAllInWindow(targetwindow.id, function(tabs) {

  chrome.tabs.query({windowId: targetwindow.id}, tabs => {

chrome.tabs.create の後ろに .catch(function(e){console.log(e.message)} を設置

特殊ケースなので、処理によっては不要だったり書き方が変わると思われる
私の場合は chrome.windows.onCreated.addListener (新たなウィンドウが生成された時に実行される)内でこの処理を入れたため、エラーが起こる可能性が出来てしまった

タブをドラック中(タブを掴んだまま左クリックが押し続けられている状態)に chrome.tabs.create が実行されると、以下のエラーが出て失敗してしまう

Uncaught (in promise) Error: Tabs cannot be edited right now (user may be dragging a tab).

エラーを見るに「タブのドラック中なのでダメです」という事らしい
仕様上は失敗しても構わなかったのですが、このようなエラーが表面で表示されるのは好ましくないので、キャッチしてコンソールログに出力する様に変更
ちなみにこのエラーはtry～catch文では受けられなかった、chrome.tabs.createがpromiseだから？

      chrome.tabs.create({
        "windowId": targetwindow.id,  //タブを開くウインドウID
        "index": 0,  //タブの位置を必ず先頭にする
        "url": bookmarkstaburl1,  //開くURL
        "selected": false,  //タブをアクティブにしない
        "pinned": true  //タブを固定化する
      });
      chrome.tabs.create({
        "windowId": targetwindow.id,  //タブを開くウインドウID
        "index": 0,  //タブの位置を必ず先頭にする
        "url": bookmarkstaburl1,  //開くURL
        "active": false,  //タブをアクティブにしない
        "pinned": true  //タブを固定化する
      }).catch(function(e){console.log(e.message)});

window.setTimeout を setTimeout に変更

background.jsが"service_worker"で動く仕様に変わったからなのか、変更しないとダメな様です

window.setTimeout(function() {openbookmarkstab(currentwindow)}, 3000);
setTimeout(function() {openbookmarkstab(currentwindow)}, 3000);

参考Webページ