【chrome拡張機能】コンソールを表示させたい

Question

実現したいこと

chrome extension v3にて
background.js → content.js にコンソールを表示させたい

発生している問題・エラーメッセージ

background.js:1
Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist. 

該当のソースコード

chrome.tabs.query({active: true, lastFocusedWindow: true, currentWindow: true}, 
    function(tab) {
        chrome.tabs.sendMessage(tab[0].id, {greeting: "hello"})
    }
);

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse){
	console.log(request.greeting)
})

{
    "name": "テスト用",
    "version": "1.0",
    "manifest_version": 3,
    "background": {
        "service_worker": "background.js"
    },
    "permissions": [
        "storage",
        "activeTab", 
        "scripting",
        "background",
        "tabs"
    ],
    "content_scripts": [{
        "matches": ["<all_urls>"],
        "js": ["content.js"]
    }]
}

試したこと

エラー文を検索し、以下のことを試してみましたが変化ありませんでした。

・chrome.runtime.onMessage.addListener()のfunctionの中の一番最後にreturn trueを記述
・更新ボタンを押す
・他の拡張機能が影響していないか、他の機能を全てOFF

Answer 1

まずchrome.tabs.queryの引数は1つでは？
引数が2つの場合ってありましたっけ？

いずれにしても、background.jsでいきなりその行が実行されても、その時点でメッセージを受け取る相手がいないということだと思いますし、その行の処理は一度実行されるだけで、それっきりですよね。

まずは拡張機能のクリックに反応してメッセージを送ることを試してみては。

まずmanifest.jsonに

    "action": {}

を追加します。

そしてbackground.jsでは

chrome.action.onClicked.addListener(function (tab) {
  chrome.tabs.sendMessage(tab.id, {greeting: "hello"});
});

を実行してみてください。

<all_urls>にマッチするURLのタブを開いた状態で拡張機能をクリックしたら、そのタブのコンソールにhelloが表示されると思います。

Comments

[退会済みユーザー]

解決できました。ありがとうございます！