Расширение Chrome: присоединение текущей вкладки к всплывающему окну и просмотр его DOM

Question

Я делаю расширение для Google Chrome и столкнулся с проблемой.

Я пытаюсь загрузить и выполнить поиск по DOM в popup.html.

Вот как я могу получить текущую вкладку (где-то нашел скрипт, кредит мне не принадлежит):

 chrome.windows.getCurrent(function(w) {
      chrome.tabs.getSelected(w.id,function (response){
  )};

Моя проблема заключается в следующем: мне нужно пройти через DOM ответа. При попытке сделать это вручную я не смог, так как переменная ответа теперь по какой-то причине не была определена, поэтому использование консоли не вариант. При попытке предупредить ответ в HTML-файл, он пришел как объект. Затем я попытался просмотреть ответ, как если бы он был объектом «документ», но тоже не повезло.

Любая помощь будет принята с благодарностью.

Answer 1

Вы можете получить выбранную вкладку для вашего всплывающего окна, передав NULL в качестве идентификатора окна для getSelected. () В вашем всплывающем окне вы можете прослушать события расширения и выполнить скрипт для отправки содержимого в ваше всплывающее окно:

chrome.extension.onRequest.addListener(
    function(request, sender, sendResponse) {
        if (request.action == "content")
        {
            console.log('content is ' + request.content.length + ' bytes');
        }
    });
chrome.tabs.getSelected(null, function(tab) {
        chrome.tabs.executeScript(tab.id, { file: 'scripts/SendContent.js' } );
    });

И, наконец, скрипт содержимого ... У меня он есть как "scripts / SendContent.js" в моей папке расширений, но скрипт достаточно прост, чтобы выполнить его, поместив код в свойство кода вместо имени свойство файла объекта, который вы передаете executeScript:

    console.log('SendContent.js');
    chrome.extension.sendRequest( {
            action: "content",
            host: document.location.hostname,
            content: document.body.innerHTML
        }, function(response) { }
    );

Результат:

POPUP: content is 67533 bytes

Если у вас возникли проблемы, используйте console.log () и щелкните правой кнопкой мыши на своей странице или в действии браузера, чтобы просмотреть его и прочитать сообщения на консоли (или отладить сценарий оттуда).

Answer 2

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

Вы можете добавить скрипт контента с помощью chrome.tabs.executeScript, обработать обход DOM в скрипте контента, а затем передать нужную информацию из скрипта контента во всплывающее окно с помощью API передачи сообщений.

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