Acciones de extensión en Manifest V3

Simeon Vincent
Simeon Vincent

Desde el lanzamiento de las extensiones de Chrome, la plataforma ha permitido a los desarrolladores exponer extensiones directamente en la IU de Chrome de nivel superior mediante acciones. Una acción es un botón de ícono que puede abrir una ventana emergente o activar algunas funcionalidades de la extensión. Históricamente, Chrome admitía dos tipos de acciones, acciones del navegador y acciones de la página; Manifest V3 cambió esto consolidando sus en una nueva API de chrome.action.

Un breve historial de las acciones de extensión

Si bien chrome.action es nuevo en Manifest V3, la funcionalidad básica que proporciona se remonta al cuando las extensiones establecieron por primera vez en enero de 2010. El primer estable de la plataforma de extensiones de Chrome admite dos tipos diferentes de acciones: navegador acciones y de página.

Las acciones del navegador permitieron que los desarrolladores de extensiones mostraran un ícono "en la barra de herramientas principal de Google Chrome, a la derecha de la barra de direcciones" (fuente) y les ofreció a los usuarios una forma sencilla para activar la funcionalidad de extensiones en cualquier página. Por otro lado, las acciones de la página estaban destinadas a "representar acciones que se pueden realizar en la página actual, pero que no se aplican a todas las páginas" (fuente).

En el cuadro multifunción, aparecerá una acción de la página (izquierda), que indicará que la extensión puede realizar alguna acción en esta página. Una acción del navegador (derecha) está siempre visible.

En otras palabras, las acciones del navegador brindaban a los desarrolladores de extensiones una superficie de IU persistente en el navegador. mientras que las acciones de la página solo aparecían cuando la extensión podía realizar alguna acción útil en la página actual.

Ambos tipos de acciones eran opcionales, de modo que el desarrollador de la extensión podía optar por proporcionar acciones, una acción de la página o una acción del navegador (no se permite especificar varias acciones).

Aproximadamente seis años después, Chrome 49 introdujo un nuevo paradigma de IU para las extensiones. Para ayudar usuarios comprenden qué extensiones tenían, Chrome comenzó a mostrar todas las extensiones activas al a la derecha del cuadro multifunción. Los usuarios podrían “desbordarse” al menú de Chrome si así lo deseaban.

Los íconos de extensión ocultos aparecerán en el Menú de Chrome.

Para mostrar un ícono para cada extensión, esta actualización también introdujo dos cambios importantes en cómo se comportaron las extensiones en la IU de Chrome. Primero, todas las extensiones comenzaron a mostrar iconos en la barra de herramientas. Si la extensión no tuviera un ícono, Chrome generaría uno automáticamente para ella. Segundo, las acciones de la página se movieron a la barra de herramientas junto a las acciones del navegador y tuvieron la posibilidad de diferenciarlos entre la palabra "programa" y "ocultar" estados.

Una acción de página inhabilitada (izquierda) se renderiza como una imagen en escala de grises en la barra de herramientas, mientras que una habilitada (derecha) aparece con todo color.

Este cambio permitió que las extensiones de acción de la página siguieran funcionando según lo esperado, pero también disminuyó la función de las acciones de la página a lo largo del tiempo. Uno de los efectos del rediseño de la IU fue que las acciones de la página se correctamente incluidas en las acciones del navegador. Como todas las extensiones aparecían en la barra de herramientas, los usuarios llegaron a esperas que, si haces clic en el ícono de la barra de herramientas de una extensión, se invoque la extensión y las acciones del navegador se convirtió en una interacción cada vez más importante para las extensiones de Chrome.

Cambios en Manifest V3

La IU y las extensiones de Chrome siguieron evolucionando en los años posteriores a la IU de extensiones de 2016. rediseño, pero las acciones del navegador y de la página permanecieron prácticamente sin cambios. Es decir, al menos hasta comenzamos a planificar cómo modernizar la plataforma de extensiones con Manifest V3.

Estaba claro para el equipo de extensiones que las acciones del navegador y de la página eran cada vez más distinción sin significado. Y, peor aún, las sutiles diferencias de comportamiento dificultaban que los desarrolladores determinar cuál usar. Nos dimos cuenta de que podíamos abordar estos problemas al combinar y de página en una sola "acción".

Ingresa la API de Action. chrome.action es más directamente análogo a chrome.browserAction, pero tiene algunas diferencias notables.

Primero, chrome.action presenta un método nuevo llamado getUserSettings(). Este método ofrece a los desarrolladores de extensiones una forma de verificar si el usuario fijó la acción de su extensión en barra de herramientas.

let userSettings = await chrome.action.getUserSettings();
console.log(`Is the action pinned? ${userSettings.isOnToolbar ? 'Yes' : 'No'}.`);

"getUserSettings" puede parecer un nombre un poco inusual para esta funcionalidad en comparación con, por ejemplo, "isPinned", pero el historial de acciones de Chrome muestra que la IU del navegador cambia más rápido que las APIs de extensiones. Por lo tanto, nuestro objetivo con esta API es exponer las preferencias del usuario relacionadas con las acciones en interfaces genéricas para minimizar la deserción de API en el futuro. También permite que otros proveedores de navegadores expongan conceptos de IU específicos del navegador en el objeto UserSettings que muestra este .

En segundo lugar, el ícono y el estado habilitado/inhabilitado de la acción de una extensión pueden controlarse con el Declarative Content API. Esto es importante porque permite que las extensiones reaccionen a la navegación del usuario comportamiento sin acceder al contenido o incluso a las URLs de las páginas que visitan. Por ejemplo, ver cómo una extensión puede habilitar su acción cuando el usuario visita páginas en example.com.

// Manifest V3
chrome.runtime.onInstalled.addListener(() => {
  chrome.declarativeContent.onPageChanged.removeRules(undefined, () => {
    chrome.declarativeContent.onPageChanged.addRules([
      {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
            pageUrl: {hostSuffix: '.example.com'},
          })
        ],
        actions: [new chrome.declarativeContent.ShowAction()]
      }
    ]);
  });
});

El código anterior es casi idéntico a lo que haría una extensión con una acción de la página. El único La diferencia es que, en Manifest V3, usamos declarativeContent.ShowAction en lugar de declarativeContent.ShowPageAction en Manifest V2.

Por último, los bloqueadores de contenido pueden usar setExtensionActionOptions) para mostrar la cantidad de solicitudes bloqueadas por la extensión en una pestaña determinada. Esta capacidad es importante porque permite bloqueadores de contenido para mantener informados a los usuarios finales sin exponer los metadatos de navegación potencialmente sensibles a la extensión.

Conclusión

Una de las principales motivaciones para Manifest V3 fue modernizar la plataforma de extensiones de Chrome. En muchos lo que significó cambiar a tecnologías nuevas, pero también simplificar nuestra plataforma de API. y ese era nuestro objetivo.

Espero que esta publicación haya ayudado a aclarar este rincón particular de la plataforma Manifest V3. Para para obtener más información sobre cómo el equipo de Chrome aborda el futuro de las extensiones del navegador, consulta la Las páginas Visión de la plataforma y Descripción general de Manifest V3 en nuestra documentación para desarrolladores. También puedes conversar sobre las extensiones de Chrome con otros desarrolladores en el chromium-extensions del Grupo de Google.