Una acción es lo que sucede cuando un usuario hace clic en el ícono de la barra de herramientas, que se suele llamar ícono de acción para tu extensión. Una acción invoca una función de extensión con la API de Action o abre una ventana emergente. En esta página, se muestra cómo invocar una función de extensión. Para usar una ventana emergente, consulta Cómo agregar una ventana emergente.
Registra la acción
Para usar la API de chrome.action, agrega la clave "action" al archivo de manifiesto de la extensión. Consulta la sección del manifiesto de la referencia de la API de chrome.action para obtener una descripción completa de las propiedades opcionales de este campo.
manifest.json:
{
"name": "My Awesome action Extension",
...
"action": {
...
}
...
}
Responde a la acción
Registra un controlador onClicked para cuando el usuario haga clic en el ícono de acción. Este evento no se activa si se registra una ventana emergente en el archivo manifest.json.
service-worker.js:
chrome.action.onClicked.addListener((tab) => {
chrome.action.setTitle({
tabId: tab.id,
title: `You are on tab: ${tab.id}`});
});
Cómo activar la acción de manera condicional
La API de chrome.declarativeContent te permite habilitar el ícono de acción de la extensión en función de la URL de la página o cuando los selectores CSS coinciden con los elementos de la página. Cuando el ícono de acción de una extensión está inhabilitado, el ícono se inhabilita. Si el usuario hace clic en el ícono inhabilitado, aparecerá el menú contextual de la extensión.
Insignia de acción
Las insignias son fragmentos de texto con formato que se colocan sobre el ícono de acción para indicar, por ejemplo, el estado de la extensión o que el usuario debe realizar acciones. Para demostrarlo, el ejemplo de Agua para beber muestra una insignia con la palabra "ACTIVADA" para indicarle al usuario que estableció una alarma correctamente y no muestra nada cuando la extensión está inactiva. Las insignias pueden tener hasta cuatro caracteres.
Llama a chrome.action.setBadgeText() para establecer el texto de la insignia y el color de fondo llamando a chrome.action.setBadgeBackgroundColor()`.
service-worker.js:
chrome.action.setBadgeText({text: 'ON'});
chrome.action.setBadgeBackgroundColor({color: '#4688F1'});
Información sobre la herramienta
Registra la información sobre la herramienta en el campo "default_title" debajo de la clave "action" en el archivo manifest.json.
manifest.json:
{
"name": "Tab Flipper",
...
"action": {
"default_title": "Press Ctrl(Win)/Command(Mac)+Shift+Right/Left to flip tabs"
}
...
}
También puedes llamar a action.setTitle()` para configurar o actualizar la información sobre la herramienta. Si no se establece, se mostrará el nombre de la extensión.