Как перемещаться по сайту с расширением - PullRequest
Новая
       12

Как перемещаться по сайту с расширением

0 голосов
/ 08 ноября 2018

Я пытаюсь написать фоновый скрипт, который открывает новую вкладку, в которой выполняется скрипт контента. Фон вызывает «method_1» в скрипте содержимого, который получает ссылку на поддомен с веб-сайта и сообщает об этом фоновому сценарию. Фоновый сценарий обновляет вкладку ссылкой и вызывает «method_2» в сценарии содержимого, который пытается получить доступ к элементу на обновленной вкладке.

Все отлично работает, пока вкладка не обновится. После обновления вкладки DOM кажется недоступным для скрипта контента. Я могу получить доступ к тем элементам, которые присутствовали при первой загрузке, но не к тем, которые изменились после обновления вкладки. Даже если я разделю 2 метода на отдельные скрипты содержимого, один из которых выполняется до обновления вкладки, а другой - после обновления вкладки, новые элементы DOM по-прежнему недоступны.

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

Код (я выбрал iana.org в качестве примера, чтобы вы могли попробовать код самостоятельно):

manifest.json 

{
    "description": "extension",
    "manifest_version": 2,
    "name": "extension",
    "version": "1.0",

    "background": {
        "scripts": ["background.js"],
        "persistent": false
    },

    "permissions": [
        "*://*.iana.org/*",
        "activeTab",
        "tabs",
        "tabCapture"
    ],

    "browser_action": {}
}

background.js 

chrome.browserAction.onClicked.addListener(function () {
    chrome.tabs.create({url: "https://www.iana.org", active: true}, function(tab) {
        chrome.tabs.executeScript(tab.id, {file: "content.js"}, (res) => {
            chrome.tabs.sendMessage(tab.id, {msg: "method_1"}, function (res) {
                // res.url is a sudomain of iana.org
                chrome.tabs.update(tab.id, {url: res.url}, (tab) => {
                    chrome.tabs.sendMessage(tab.id, {msg: "method_2"}, function (res) {
                        console.log("res.text: " + res);
                    });
                });
            });
        });
    });
});

content.js 

chrome.runtime.onMessage.addListener((req, sender, sendResponse) => {
    let url;
    if(req.msg === "method_1") {
        url = document.querySelector("#home-panel-domains > h2 > a").href;
        sendResponse({url: url});
    }
    if(req.msg === "method_2") {
        // this is where the code fails because the element is not accessible
        url = document.querySelector("#main_right > h1").textContent;
        sendResponse({text: url});
    }
});

Любая помощь или подсказка приветствуется.

...