Скопируйте выделенный текст через опцию контекстного меню в расширение Chrome

Question

Я пытаюсь создать параметр контекстного меню, который копирует некоторый текст в системный буфер обмена.

В настоящее время я просто копирую строковый строковый литерал, но мне интересно, как его можно изменить, чтобы скопировать выделенный текст. В частности, я не знаю, как правильно создать объект createProperties (см. Внизу)

Насколько я понимаю, это можно сделать только с помощью справочной страницы.

У меня есть следующие страницы фона:

background.html

<textarea id="temp"></textarea> 
<script src="context.js"></script> 

---

context.js выглядит следующим образом:

chrome.contextMenus.create({ 
    "title": "Freedom", 
    "contexts": ["editable"], 
    "onclick" : copyToClipboard 
    });   

function copyToClipboard() 
{ 
    var tempNode = document.getElementById("temp"); 
    tempNode.value = "some text"; 
    tempNode.select(); 
    var status = document.execCommand('copy',false,null); 

    if(status) alert('successful'); 

    else alert('unsuccessful'); 
}  

---

мой manifest.json является следующим образом:

{ 
    "manifest_version": 2, 

    "name": "Freedom", 
    "description": "Provides users useful and fun context menu options that they can access from anywhere.", 
    "version": "1.0", 

    "permissions": [ 
     "contextMenus", 
     "clipboardWrite" 
     ], 

    "background": { 
     "page": "background.html" 
    } 

}  

---

Я, видимо, объявляя функцию chrome.contextMenus.create() неправильно. Я прочитал документы для этого, и могу только представить, что я неправильно создаю объект createProperties.

Я пытался имитировать эти источники:

Is that possible calling content script method by context menu item in Chrome extension?

http://paul.kinlan.me/chrome-extension-adding-context-menus/

некоторые другие связанные вопросы:

Copy to Clipboard in Chrome Extension

How to copy text to clipboard from a Google Chrome extension?

Answer 1

"createProperties" в документации - это словарь, который передается методу chrome.contextMenus.create (т. эта вещь с «заголовком», «контекстом» и т. д.)

В сообщении onclick event description of chrome.contextMenus.create указано, что функция получает два параметра. Первый параметр («info») - это словарь с информацией о выбранном тексте. Второй параметр («вкладка») содержит информацию о вкладке (в вашем случае вам это не нужно).
Словарь «информация» имеет свойство «selectionText», которое содержит выделенный текст, когда был нажат элемент контекстного меню. Это может быть использовано в вашем коде следующим образом:

function copyToClipboard(info) { 
    var tempNode = document.getElementById("temp"); 
    tempNode.value = info.selectionText; // <-- Selected text 
    tempNode.select(); 
    document.execCommand('copy', false, null); 
} 

Это решит ваш неотложный вопрос.
Кроме того, ваше расширение может быть улучшено путем преобразования вашего background page в event page. Основное преимущество страниц событий над фоновыми страницами заключается в том, что ваше расширение не будет излишне использовать память при сидении в фоновом режиме.

// background.js 

// Register context menu 
chrome.runtime.onInstalled.addListener(function() { 
    chrome.contextMenus.create({ 
     "id": "some id", // Required for event pages 
     "title": "Copy selected text to clipboard", 
     "contexts": ["editable"], 
     // "onclick" : ... // Removed in favor of chrome.contextMenus.onClicked 
    }); 

}); 

// Register a contextmenu click handler. 
chrome.contextMenus.onClicked.addListener(copyToClipboard); 

Вот минимальный manifest.json (обратите внимание на "persistent": false ключ, который указывает, что вы хотите использовать event page)

{ 
    "manifest_version": 2, 

    "name": "Copy selected text to clipboard", 
    "version": "1.0", 

    "permissions": [ 
     "contextMenus", 
     "clipboardWrite" 
    ], 

    "background": { 
     "page": "background.html", 
     "persistent": false 
    } 
}