特定のページのみでGoogle Chromeの拡張に右クリックメニューを追加したい

###前提・実現したいこと
特定のページのみでGoogle Chromeの拡張に右クリックメニューを追加したいと思います。
とりあえずここでは『teratail.com』のページ内で右クリックメニューを押した場合コンソールログ内に『Hello World!』と表示させたいです。

background 側から右クリックメニューを追加すると『teratail.com』以外のページでも表示されてしまって困っております。

最終的な目標は特定のページ内の入力フォームに対して右クリックメニューから挿入する文字列を選択することで値が当てはまることです。
現在はすべてのページにおいて右クリックメニューから挿入する文字列を特定するところまでできております。

###発生している問題・エラーメッセージ
content_scripts 側で chrome.contextMenus.create 処理を行うと以下のエラーが発生しています。

Uncaught TypeError: Cannot read property 'create' of undefined
    at script.js:1
(anonymous) @ script.js:1

エラーの原因は理解しているので回避するために background 側でも行いました。

###該当のソースコード
manifest.json

json
1{
2    "manifest_version": 2,
3    "version": "0.0.1",
4    "name": "Hello World!",
5    "content_scripts": [
6        {
7            "matches": [
8                "https://teratail.com/*"
9            ],
10            "js": [
11                "js/script.js"
12            ]
13        }
14    ],
15    "background": {
16        "scripts": [
17            "js/background.js"
18        ]
19    },
20    "permissions": [
21        "contextMenus"
22    ]
23}

script.js

javascript
1chrome.contextMenus.create({
2    "title": "Hello World!",
3    "onclick": function () {
4        console.log("Hello World!");
5    }
6});

###試したこと

###補足情報(言語/FW/ツール等のバージョンなど)
より詳細な情報

行動規範の内容に同意します

回答2件

ベストアンサー

manifestのpermissionsに tabs 追加して
background側で

javascript
1var url;
2
3chrome.tabs.onActiveChanged.addListener(function(id,info){
4  chrome.tabs.get(id,function(tab){
5    url = tab.url;
6  });
7});
8
9chrome.tabs.onUpdated.addListener(function(id,info,tab){
10  if(tab.active){
11    url = tab.url;
12  }
13});