Обратный вызов расширения Chrome после активной вкладки

Question

У меня есть расширение, в котором я хотел бы фокусировать вкладки в разное время в течение нескольких секунд.

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

Я пытался передать функцию в sendMessage, но, похоже, она сразу же выполняется (см. Ниже).Как я могу передать функцию обратного вызова, которая будет выполнена в скрипте контента, когда вкладка сфокусирована?

content_script.js

chrome.runtime.sendMessage("Do something", function(resp) {
    console.log(resp)
})

background.js

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse){
  chrome.windows.update(sender.tab.windowId, {"focused": true}, function(window){ });
  chrome.tabs.update(sender.tab.id, {"active": true}, function(tab){
    // callback function
  });
});

Answer 1

Вернуть true из прослушивателя onMessage , чтобы оставить канал ответа открытым, затем вызвать sendResponse из обратного вызова Chrome API.Обратите внимание, что обратные вызовы API Chrome всегда выполняются асинхронно , то есть после завершения основной функции.

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  let callbackCounter = 2;

  chrome.tabs.update(sender.tab.id, {active: true}, function (tab) {
    // this callback runs after the parent function has finished
    if (--callbackCounter === 0) {
      sendResponse({foo: 'bar'});
    }
  });

  chrome.windows.update(sender.tab.windowId, {focused: true}, function (window) {
    // this callback runs after the parent function has finished
    if (--callbackCounter === 0) {
      sendResponse({foo: 'bar'});
    }
  });

  // keep the response channel open 
  return true;
});

В современных браузерах это обычно решается с помощью Promise API.
Вы можете использовать его сAPI-интерфейс Chrome путем загрузки Polyzill Mozilla WebExtension .

browser.runtime.onMessage.addListener((request, sender) => {
  return Promise.all([
    browser.tabs.update(sender.tab.id, {active: true}),
    browser.windows.update(sender.tab.windowId, {focused: true}),
  ]).then(() => {
    // .........
    return {foo: 'bar'};
  });
});

Полифилл также позволяет использовать синтаксис await / async:

browser.runtime.onMessage.addListener(async (request, sender) => {
  await Promise.all([
    browser.tabs.update(sender.tab.id, {active: true}),
    browser.windows.update(sender.tab.windowId, {focused: true}),
  ]);
  return {foo: 'bar'};
});