將上下文菜單項添加到Chrome擴展程序的瀏覽器操作按鈕

Question

A G Chrome擴展程序可以有'browser action'。通常，當你點擊它時，ext開發者會顯示這些選項，這意味着每個動作需要2次點擊，即使是默認的99％的時間動作。 Chrome本身添加了一個上下文菜單，其中包含幾個選項：禁用ext，卸載ext，進入ext主頁等。

我可以作爲ext開發人員將項目添加到該上下文菜單，因此我可以保留我的單擊動作正常/左/主鼠標點擊？

我知道chrome.contextMenus但這隻適用於頁面中的上下文菜單（請參閱屬性'contexts'）。

我找不到它在Chrome Extension dev guide，但你知道比我更

Answer 1

這是now possible，的AdBlock Chrome擴展有它。下面是「瀏覽器動作中的上下文菜單」的工作示例。

manifest.json的：

{ 
    "name": "Custom context menu in browser action", 
    "version": "1", 
    "manifest_version": 2, 
    "background": { 
     "scripts": ["background.js"] 
    }, 
    "browser_action": { 
     "default_title": "Some tooltip", 
     "default_popup": "popup.html" 
    }, 
    "permissions": [ 
     "contextMenus" 
    ], 
    "icons": { 
     "16": "icon16.png" 
    } 
} 

background.js：

chrome.contextMenus.removeAll(); 
chrome.contextMenus.create({ 
     title: "first", 
     contexts: ["browser_action"], 
     onclick: function() { 
     alert('first'); 
     } 
}); 

請注意，如果您使用的Event page，您不能使用onclick屬性;您需要將偵聽器添加到chrome.contextMenus.onClicked。

Answer 2

這是不可能任何自定義條目添加到右鍵菜單。

但是，您可以動態地將面板分配到按鈕chrome.browserAction.setPopup。您可以使用options page來允許用戶選擇他們的首選選項（單擊動作，或雙擊多個動作）。選項頁面距離按鈕僅需兩次點擊，這一事實也相當不錯。

下面是用於說明在面板和單擊之間進行切換的概念的示例代碼。

background.js（在你的event/background page使用）：

chrome.browserAction.onClicked.addListener(function() { 
    // Only called when there's no popup. 
    alert('Next time you will see a popup again.'); 
    chrome.browserAction.setPopup({ 
     popup: 'popup.html' 
    }); 
}); 

popup.html，只是爲了演示（使用CSS來使它看起來更好）：

<button>Click</button> 
<script src="popup.js"></script> 

popup.js，只是爲了演示。由於CSP，JavaScript必須放置在單獨的文件中。

document.querySelector('button').onclick = function() { 
    chrome.browserAction.setPopup({ 
     popup: '' // Empty string = no popup 
    }); 
    alert('Next time, you will not see the popup.'); 
    // Close panel 
    window.close(); 
}; 

正如你可以看到在這個例子中，chrome.browserAction.setPopup也是一個彈出頁面可用。

PS。 manifest.json，所以你可以複製粘貼示例並玩這個答案。

{ 
    "name": "Test badge - minimal example", 
    "version": "1", 
    "manifest_version": 2, 
    "background": { 
     "scripts": ["background.js"] 
    }, 
    "browser_action": { 
     "default_title": "Some tooltip" 
    } 
}