Как выбрать правильное слово?

Question

У меня есть следующий код.Это то, что он делает.Когда вы выделяете / выделяете какой-либо текст на веб-странице, щелкая и перетаскивая его, щелкните правой кнопкой мыши, чтобы увидеть контекстное меню, а при щелчке по пункту меню выделенный текст отобразится в окне предупреждения.Я хочу изменить этот код, чтобы пользователю не нужно было выделять текст щелчком и перетаскиванием.Все, что им нужно сделать, это щелкнуть правой кнопкой мыши на слове и выбрать пункт контекстного меню.Слово / текст, по которому они щелкнули правой кнопкой мыши, должно появиться как предупреждение.

let contextMenuItem = {
    "id": "helloWorld",
    "title": "Hello World",
    "contexts": ["selection"]
};

chrome.contextMenus.removeAll(function() {
    chrome.contextMenus.create(contextMenuItem);
  });

chrome.contextMenus.onClicked.addListener(function(clickData) {
        let inputString = clickData.selectionText;
        alert(inputString);
})

Answer 1

Прежде всего, расширения имеют "строгую" модель разрешений.Когда вы даете разрешение на contextMenus , вы ограничены следующими контекстами:

«все», «страница», «фрейм», «выделение», «ссылка»,«редактируемый», «изображение», «видео», «аудио», «средство запуска», «browser_action» или «page_action»

Плохой UX

Если он имел "слово" или даже "текст" контекст, это создает непоследовательный пользовательский опыт.Пользователи не знакомы с правым кликом, выполняющим действия над текстом в веб-браузере.

Если вам нужно такое действие, вам нужно ввести content-script , чтобы добавить событие мыши к "автоматическому" выбору этого слова с помощью JavaScriptAPI выбора .Если вы хотите этого, вам нужно предоставить больше «разрешений» вашему расширению для поддержки этого опыта.Это может не понравиться пользователям.

Пример

Если это то, что нужно расширению, просто создайте content-script , который автоматически выбирает это слово.Нечто подобное сработает, что создаст диапазон каретки от положения мыши и изменит его выделение на это слово.Обратите внимание, что в разрешениях я только что включил google.com, вот где скрипт контента будет внедряться.

contentscript.js

document.addEventListener('mouseup', (e) => {
    if (e.button !== 2) {
        return
    }

    const selection = window.getSelection()
    selection.removeAllRanges()

    const range = document.caretRangeFromPoint(e.clientX, e.clientY)
    range.expand('word')

    selection.addRange(range)
});

background.js

const menu = chrome.contextMenus.create({
    'id': 'helloWorld',
    'title': 'Hello "%s"',
    'contexts': ['selection']
})

chrome.contextMenus.onClicked.addListener((clickData) => {
    const inputString = clickData.selectionText
    console.log(inputString)
});

manifest.json

{
  "name": "contextMenus",
  "version": "1.0",
  "minimum_chrome_version": "35.0",
  "manifest_version": 2,
  "permissions": [
    "contextMenus"
  ],
  "background": {
    "scripts": [
      "background.js"
    ]
  },
  "content_scripts": [
    {
      "matches": ["https://*.google.com/*"],
      "js": ["contentscript.js"]
    }
  ]
}