Novedades de Chrome 116 para extensiones

Chrome 116 ya está disponible en versión beta y incluye muchas actualizaciones interesantes para los desarrolladores de extensiones de Chrome. Veamos rápidamente las novedades.

Cómo abrir un panel lateral de forma programática

El panel lateral es una de las funciones más solicitadas en las extensiones de Chrome y está disponible en Chrome desde la versión 114. Después de lanzar la API de Side Panel, uno de los primeros comentarios que recibimos fue que los desarrolladores querían una forma de abrir un panel lateral de forma programática. Y aquí está: chrome.sidePanel.open ahora está en versión beta. Puedes usarlo para abrir el panel lateral de la extensión de forma programática en respuesta a una interacción del usuario, como un clic en el menú contextual:

chrome.contextMenus.onClicked.addListener((info, tab) => {
  if (info.menuItemId === 'openSidePanel') {
    // This will open the panel in all the pages on the current window.
    chrome.sidePanel.open({ windowId: tab.windowId });
  }
});

Compatibilidad con WebSocket en los trabajadores del servicio

La compatibilidad con WebSocket es fundamental para muchas extensiones que planean migrar a Manifest V3. Chrome 116 mejora aún más la compatibilidad con WebSocket en los service workers, ya que toda la actividad de WebSocket restablecerá el cronómetro inactivo de 30 s del service worker. Esto significa que, mientras tu WebSocket esté activo, el trabajador del servicio permanecerá activo.

Puedes usar esto para implementar un mecanismo de mantenimiento de la conexión que garantice que tu trabajador de servicio permanezca activo mientras esperas mensajes de tu servidor, incluso si tarda más de 30 segundos en llegar el siguiente mensaje:

function keepAlive() {
  const keepAliveIntervalId = setInterval(
    () => {
      if (webSocket) {
        webSocket.send('keepalive');
      } else {
        clearInterval(keepAliveIntervalId);
      }
    },
    // It's important to pick an interval that's shorter than 30s, to
    // avoid that the service worker becomes inactive.
    20 * 1000
  );
}

Consulta nuestra nueva guía y muestra de WebSockets para obtener más detalles.

Mantener la conexión activa de forma sólida para los trabajadores de servicio

A propósito del ciclo de vida del trabajador de servicio, se lanzó otra actualización importante: un mantenimiento activo sólido para las APIs que requieren interacción del usuario. Las APIs que requieren una interacción del usuario tendrán tiempos de actividad "fuertes" para los trabajadores de servicio de extensión (es decir, permiten que el trabajador demore más de 5 minutos en esta tarea):

Grabación de audio y video en segundo plano

Se cerró otra brecha entre Manifest V2 y Manifest V3: puedes grabar audio y video en segundo plano con tabCapture y documentos fuera de pantalla. Usa la API de chrome.tabCapture en un trabajador de servicio para obtener un ID de transmisión después de un gesto del usuario. Luego, se puede pasar a un documento fuera de la pantalla para iniciar la grabación.

Consulta nuestra guía actualizada de tabCapture para obtener información sobre cómo funciona o, para ver un ejemplo en funcionamiento, consulta la muestra de Captura de pestañas: grabador.

Nueva API: runtime.getContexts()

La nueva API de runtime.getContexts() te permite recuperar información sobre los contextos activos asociados con tus extensiones. Por ejemplo, puedes usarlo para verificar si hay un documento fuera de la pantalla activo:

const existingContexts = await chrome.runtime.getContexts({});
const offscreenDocument = existingContexts.find(
    (c) => c.contextType === 'OFFSCREEN_DOCUMENT'
  );

Nuevo motivo fuera de la pantalla: GEOLOCATION

Se agregó geolocation como otro motivo válido para usar un documento fuera de la pantalla. Consulta nuestra guía sobre cómo usar la ubicación geográfica para obtener más información sobre cómo obtener la ubicación geográfica de la extensión con la API de Offscreen.

chrome.action.setBadgeText()

Se actualizó action.setBadgeText para abordar una incoherencia entre Manifest V2 y Manifest V3. Si pasas una cadena vacía o null a action.setBadgeText, se borrará el texto de la insignia de la pestaña especificada y se usará de forma predeterminada el texto de la insignia global.

action.setBadgeText({tabId: tabId, text: ''});

Resumen: otro paso hacia Manifest V3

Con la mejora de la compatibilidad con el tiempo de vida de Service Worker y la API actualizada de TabCapture, seguimos avanzando en nuestro objetivo de cerrar la brecha de funciones entre Manifest V2 y V3. Consulta nuestra página de problemas conocidos para conocer el estado actual.