संदर्भ मेन्यू बनाना

माउस के दूसरे क्लिक (इसे अक्सर राइट क्लिक कहा जाता है) के लिए, एक कॉन्टेक्स्ट मेन्यू दिखता है. इस पेज पर, कॉन्टेक्स्ट मेन्यू लागू करने का तरीका बताया गया है. इससे जुड़े एपीआई के सदस्यों की पूरी सूची देखने के लिए, browser.contextMenu पर जाएं.

कॉन्टेक्स्ट मेन्यू बनाने के लिए, सबसे पहले manifest.json फ़ाइल में "contextMenus" permission जोड़ें.

manifest.json:

  "permissions": [
    "contextMenus"
  ],

अगर आपको मेन्यू आइटम के बगल में कोई आइकॉन दिखाना है, तो "icons" कुंजी का इस्तेमाल करें. हालांकि, ऐसा करना ज़रूरी नहीं है. इस उदाहरण में, "Global Google Search" एक्सटेंशन के मेन्यू आइटम में 16x16 आइकॉन का इस्तेमाल किया गया है.

इस उदाहरण का बाकी हिस्सा, Global Google Search के कॉन्टेक्स्ट मेन्यू के सैंपल से लिया गया है. इसमें कॉन्टेक्स्ट मेन्यू के कई विकल्प दिए गए हैं. जब किसी एक्सटेंशन में एक से ज़्यादा कॉन्टेक्स्ट मेन्यू होते हैं, तो Chrome उन्हें अपने-आप एक ही पैरंट मेन्यू में छोटा कर देता है. जैसा कि यहां दिखाया गया है:

इस सैंपल में, एक्सटेंशन सर्विस वर्कर में contextMenus.create() को कॉल करके यह दिखाया गया है. सब मेन्यू आइटम, locales.js फ़ाइल से इंपोर्ट किए जाते हैं. इसके बाद, runtime.onInstalled इन पर बार-बार काम करता है.

service-worker.js:

const tldLocales = {
  'com.au': 'Australia',
  'com.br': 'Brazil',
  ...
}

browser.runtime.onInstalled.addListener(async () => {
  for (let [tld, locale] of Object.entries(tldLocales)) {
    browser.contextMenus.create({
      id: tld,
      title: locale,
      type: 'normal',
      contexts: ['selection'],
    });
  }
});