Расширение Firefox - Как показать текст пользователю из фонового скрипта?

#javascript #firefox-addon #browser-extension

#javascript #firefox-аддон #браузер-расширение

Вопрос:

Это может быть очень простой вопрос, но я не могу найти ответа в Интернете. То, что я пытаюсь сделать, — это показать пользователю некоторый текст после нажатия на пункт контекстного меню. Сначала я подумал об использовании alert() , но потом понял, что это невозможно в фоновых скриптах. Есть ли какой-нибудь альтернативный способ показать какой-либо текст пользователю? Любые идеи будут оценены по достоинству.

Мой background.js файл:

 browser.contextMenus.create({
    id: "showtext",
    title: "Show text",
    contexts: ["selection"]
});

browser.contextMenus.onClicked.addListener(function (info, tab) {
    switch (info.menuItemId) {
        case "showtext":
            {
                console.log(info.selectionText);
                // alert() doesn't work here
                // looking for alternative
            }
    }
});

К вашему сведению: я пытаюсь создать небольшой инструмент шифрования и дешифрования.

PS: Я новичок в расширениях. 🙁

Ответ №1:

Вы могли бы вставлять элементы на страницу:

 const node = document.createElement('div');
node.textContent = "This page has been eaten";
document.body.appendChild(node);

Оформите его по мере необходимости, чтобы он отображался так, как вам нужно.

MDN: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Modify_a_web_page

1. Спасибо, мне нравится ваш пример! 😂 Это возможный способ сделать это, но на самом деле мне это не очень нравится, особенно потому, что я не хочу изменять страницу, если в этом нет необходимости. Но я попробую.

2. Единственный другой способ, о котором я знаю, — это отображение содержимого в вещах, которые вы можете открыть из панели расширения.

3. Хорошо, спасибо 👍 Я просто решил использовать SweetAlert, тогда мне не нужно делать стиль самостоятельно 😁

Ответ №2:

Для всех, кто найдет этот вопрос в будущем:

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

 browser.tabs.create({ url: "/pages/mypage.html" }).then(() => {
    browser.tabs.executeScript({
        code: "alert(`"   mytext   "`);"
    });
});

PS: Я не использовал alert, это всего лишь пример.