Estoy trabajando en un proyecto que crea una extensión de Google Chrome. tengo una funcion Quiero que si la nueva pestaña está onUpdated o onActivated , esta función funcione. Además, quiero que funcione en todas las pestañas simultáneamente. ¿Cómo puedo hacer eso? Aquí está mi código:
chrome.tabs.onActivated.addListener((activeInfo) => { chrome.tabs.query({ active: true }, (tabs) => { Process() }) }) chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => { chrome.tabs.query({ currentWindow: true }, (tabs) => { Process() }) })Este ejemplo mostrará cómo aplicar la misma función en eventos de pestañas onActivated y onActivated y cómo aplicar la función a todas las pestañas de estos eventos. Querrá hacer esto en el trabajador de servicio de fondo.
Cree un manifiesto de extensión que especifique el trabajador del servicio:
{ "name": "Example", "version": "1.0", "manifest_version": 3, "background": { "service_worker": "background.js" } } A continuación, en el script background.js (el trabajador del servicio), querrá manejar estos eventos. La implementación más básica podría verse así, y llamará a la función Process en cada pestaña, cada vez que se active o actualice una pestaña:
function Process(tab) { // now do something with each tab console.log(`Process tab id ${tab.id}`); } function ProcessAllTabs() { // do not specify query options to get // all tabs in all windows for current user chrome.tabs.query({}, (tabs) => tabs.map(Process)); } // register the event listeners chrome.tabs.onActivated.addListener(ProcessAllTabs); chrome.tabs.onUpdated.addListener(ProcessAllTabs); Si depura este comportamiento, notará que la actualización de la pestaña llamará al controlador par dos veces ya que la pestaña experimenta diferentes estados de actualización. Es posible que desee ser más específico, y tal vez solo llamar al Process después de que la pestaña haya terminado de actualizarse, o tener más información sobre qué evento causó que se llamara al Process . En ese caso, una implementación más detallada podría verse así:
// name the events const EventsEnum = {UPDATE: 'update', ACTIVATE: 'activate'}; function Process(tab, eventName) { // now do something with each tab: console.log(`Process tab id ${tab.id} on ${eventName}`); } function ProcessAllTabs(eventName) { // do not specify query options to get // all tabs in all windows for current user chrome.tabs.query({}, // pass more arguments to Process function (tabs) => tabs.map(tab => Process(tab, eventName))); } // register the event listeners chrome.tabs.onActivated.addListener( // include event name () => ProcessAllTabs(EventsEnum.ACTIVATE)); chrome.tabs.onUpdated.addListener((tab, changeInfo) => { // require that tab update is complete before proceeding if (changeInfo.status === "complete") { ProcessAllTabs(EventsEnum.UPDATE) } });