Adding a context menu item to an unstable background script?

Question

I am adding a context menu item from a non-persistent script background using:

chrome.contextMenus.create({ title: 'Get Code', id: 'myUniqueIdForThisExtension123', contexts: ['all'], onclick: onClickHandler }); function onClickHandler() {} 

The documentation just states:

The unique identifier assigned to this item. Mandatory for event pages. It cannot be the same as another identifier for this extension.

So, I added a unique identifier, but I still can't get it to work. Nothing new has been added to the context menu.

Answer 1

You say that you have an unstable background page, so you should have a manifest.json file that looks like this:

 { "manifest_version": 2, "name": "My extension", "description": "My description", "version": "1", "permissions": ["contextMenus"], "background": { "persistent": false, "scripts": [ "/background.js" ] } } 

Now, since you have an unstable background page, you should use the right listeners to wake up when you need to use the context menu.

Quote from the official documentation If you use the context menu APIs, pass the line identifier parameter to contextMenus.create and use contextMenus.create instead of the onclick parameter .

So your error is using the onclick parameter instead of the contextMenus.onClicked.addListener() method in your background.js .

Decision

I already said that you should use the onClicked event, but I would like to add this, referencing:

You must register the context menu via contextMenus.create in the event handler , since these entries in the context menu are still saved.

So simple, given that after creating context menus are saved in your extension, it is best to define them only once: when your extension is installed (or updated) and adds a listener each time the background page loads.

 chrome.runtime.onInstalled.addListener(function() { chrome.contextMenus.create({ title: 'My menu', id: 'menu1', // you'll use this in the handler function to identify this context menu item contexts: ['all'], }); }); chrome.contextMenus.onClicked.addListener(function(info, tab) { if (info.menuItemId === "menu1") { // here where you'll need the ID // do something } }); 

What you need to create a context menu on the events page, as shown on the documentation page chrome.contextMenus API

Answer 2

Correcting what Marco Bonelli wrote:

If you want to use an event page or a fickle background page, as you call it, you must register the context menu via contextMenus.create in the runtime.onInstalled event runtime.onInstalled , since these registrations are "saved" in the context menu anyway.

You must add a listener function for the contextMenus.onClicked event each time the event page reloads, however, since the registration of your desire to listen to this event is saved, while the callback itself does not.

So, to do it right ™, register your context menu from runtime.onInstalled , but set the event handler callback itself using contextMenus.onClicked.addListener from the top level or another code that is guaranteed to be executed every time the event page is loaded. ^{[ 1 ]}