Сделайте скриншот определенного элемента из расширения Google Chrome - PullRequest
Новая
       55

Сделайте скриншот определенного элемента из расширения Google Chrome

0 голосов
/ 08 июня 2018

Мне нужно, чтобы мое расширение Chrome делало снимок экрана со всей страницей / вкладкой, исключая элемент, который я вставил в него после закрывающего </body>, который перекрывает все остальное.

В настоящее время я беруснимок экрана из фонового скрипта со следующим кодом: 

chrome.extension.onMessage.addListener((request, sender, sendResponse) => {
    if (request.type === 'cheese') {
        setTimeout(() => {
            chrome.tabs.captureVisibleTab(null, { format: 'png' }, (src) => {
                sendResponse({ src });
            });
        }, 10);

        return true;
    }
});

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

Раньше я использовал requestAnimationFrame для отправкизапрос на скриншот к фоновому скрипту только после того, как элемент был скрыт, но, что удивительно, это не решило проблему, поэтому я попытался использовать этот setTimeout.

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

Я взялвзглянем на протокол удаленной отладки, где самым близким был Page.captureScreenshot, который принимает параметр clip, который обрезает снимок экрана, но по-прежнему захватывает наложение.

...