javascript - 除非我打开扩展开发工具，否则上下文菜单不起作用

Question

我正在尝试制作一个 chrome 扩展，让您可以使用上下文菜单将突出显示的一段文本添加到扩展的 DOM 中。这段代码可以正常工作，但只有当我让 devtools 检查扩展程序打开时。否则上下文菜单命令什么也不做。任何帮助将不胜感激。

Javascript代码：

if (typeof (document) !== "undefined"){
    let wordList = []
    const ulEl = document.getElementById("ul-el")
    const CONTEXT_MENU_ID = "MY_CONTEXT_MENU"
    const localStorageStuff = JSON.parse(localStorage.getItem("text"))

    if (localStorageStuff){
        wordList = localStorageStuff
        console.log(wordList)
        render(wordList)
    }

    function render(words) {
        let renderWords = ""
        for (let i=0; i<words.length; i++) {
            renderWords += `
            <li>
                <a target='blank_' href='http://www.google.com/search?q=${words[i]}'>
                ${words[i]}
                </a>
            </li>
        `
        }
        ulEl.innerHTML = renderWords
    }

    function getword(info) {
        if (info.menuItemId !== CONTEXT_MENU_ID) {
            return;
        }
        console.log("Word " + info.selectionText + " was clicked.")
        wordList.push(info.selectionText)
        console.log(wordList)
        localStorage.setItem("text", JSON.stringify(wordList))
        render(wordList)
    }
    chrome.contextMenus.removeAll(function() {chrome.contextMenus.create({
    title: "Add log: %s", 
    contexts:["selection"], 
    id: CONTEXT_MENU_ID
    })})
    chrome.contextMenus.onClicked.addListener(getword)
}

清单.json

{
    "name": "Memos",
    "version": "1.0",
    "manifest_version": 3,
    "action": {
        "default_popup": "index.html"
    },
    "permissions": [
      "contextMenus",
      "tabs",
      "storage"
    ],
    "background": { 
      "service_worker": "index.js"
    }
}

标签： javascriptgoogle-chrome-extension