Chrome-extension: Append functions to right click menu

Question

How would I append functions to the right click menu in the browser? E.g something appended to the right click menu which does function dosomething() which is located in my extension.

Answer 1

Found out how, using the contextmenu API https://developer.chrome.com/docs/extensions/reference/contextMenus/

Answer 2

I made simple extenstion using the contextMenu API - link
Hope this works well as an example.

manifest.json -

{
  "manifest_version": 2,
  ...
  ...
  "permissions": [
      "contextMenus", 
      "tabs"],
  ...
  ...
  "background": {
    "page": "background.html",
    "scripts": ["main.js"]
  }
}

main.js -

 searchUrbanDict = function(word){
    var query = word.selectionText;
    chrome.tabs.create({url: "http://www.urbandictionary.com/define.php?term=" + query});
 };

chrome.contextMenus.create({
 title: "Search in UrbanDictionary",
 contexts:["selection"],  // ContextType
 onclick: searchUrbanDict // A callback function
});

For more information on different context types - link

Answer 3

Anurag-Sharma's answer updated for manifest v3:

manifest.json -

{
    "name": "terapeak",
    "description": "easy way to research ebay products",
    "version": "1.0",
    "manifest_version": 3,
    "permissions": [
        "contextMenus",
        "tabs"
    ],
    "background": {
        "service_worker": "main.js"
    }
}

main.js

searchTerapeak = function(word){
    var query = word.selectionText;
    chrome.tabs.create({url: "https://www.ebay.com/sh/research?dayRange=365&sorting=-avgsalesprice&tabName=SOLD&keywords="
+ query});  };

chrome.contextMenus.removeAll(function() {
    chrome.contextMenus.create({
     id: "1",
     title: "Terapeak this!",
     contexts:["selection"],  // ContextType
    }); })

chrome.contextMenus.onClicked.addListener(searchTerapeak);

Why you need to removeAll each time: Why does chrome.contextMenus create multiple entries?