¿Cómo hago para que aparezca el ícono de la Página de extensión de Chrome en la barra de direcciones?

Question

Estoy intentando construir una extensión de Chrome que aparece como un icono en la barra de direcciones que, cuando hace clic, establece contenteditable = true en todos los elementos de la página y luego, al hacer clic nuevamente, vuelve a contenteditable = false.

Sin embargo, me estoy cayendo en el primer obstáculo ... El icono ni siquiera aparece en la barra de direcciones.

Aquí está mi archivo de manifiesto:

{ 
    "name": "Caret", 
    "version": "1.0", 
    "description": "Allows you to edit the content on any webpage", 
    "page_action": { 
    "default_icon": "icon.png" 
    }, 
    "content_scripts": [ 
    { 
     "matches": ["http://*/*"], 
     "js": ["jquery.js", "caret.js"] 
    } 
    ], 
    "permissions" : [ 
    "tabs" 
    ] 
} 

y aquí está el guión caret.js:

chrome.browserAction.onClicked.addListener(function(Tab) { 

    $("*").attr("contenteditable",true); 

}); 

Este es mi primer intento de una extensión, por lo que es muy probablemente un error de novato, pero Realmente agradecería cualquier ayuda o consejo!

Answer 1

Ok, resulta que necesitaba usar chrome.pageAction.show(tab.id);, lo que significaba que necesitaba para obtener el ID de la pestaña actual, que se consigue con:

chrome.tabs.getSelected(null, function(tab) { 

    chrome.pageAction.show(tab.id); 


}); 

PERO resulta que no se puede utilizar chrome.tabs dentro de un script de contenido, así que tuve que cambiar a usar una página de fondo en su lugar.

Answer 2

My answer to this other question da la solución. FYI, el segundo problema de código anotado en esa respuesta también es relevante para su código: desea que el ícono aparezca para todas las páginas, por lo que debe usar browser_action, no page_action. Cualquiera de los dos funcionará, pero usar una acción de página en cada página va en contra de la convención y hace que la experiencia del usuario final sea menos consistente.

Answer 3

me hizo esto:

chrome.tabs.onUpdated.addListener(function(id, info, tab){ 
    if (tab.url.toLowerCase().indexOf("contratado.me") > -1){ 
    chrome.pageAction.show(tab.id); 
    } 
}); 

Answer 4

tuve un problema similar, aquí están los pasos que hemos seguido para resolverlo:

alteré mi manifest.json para incluir lo siguiente:

{ 
    "background": { 
    "scripts": ["background.js"], 
    "persistent":false 
    }, 
    "page_action": { 
    "default_icon": "logo.png", 
    "default_title": "onhover title", 
    "default_popup": "popup.html" 
    } 
} 

Luego inserté el siguiente código en mi script de fondo:

// When the extension is installed or upgraded ... 
    chrome.runtime.onInstalled.addListener(function() { 
     // Replace all rules ... 
     chrome.declarativeContent.onPageChanged.removeRules(undefined, function() { 
     // With a new rule ... 
     chrome.declarativeContent.onPageChanged.addRules([ 
      { 
      // That fires when on website and has class 
      conditions: [ 
       new chrome.declarativeContent.PageStateMatcher({ 
       pageUrl: { hostContains: 'myurl', schemes: ['https', 'http'] }, 
       css: [".cssClass"] 
       }) 
      ], 
      // And shows the extension's page action. 
      actions: [ new chrome.declarativeContent.ShowPageAction() ] 
      } 
     ]); 
     }); 
    }); 

La documentación de esto se puede encontrar aquí ... https://developer.chrome.com/extensions/declarativeContent

Answer 5

Esto ya no es posible a partir de la última versión.

Chrome extension page action appearing outside of address bar

https://groups.google.com/a/chromium.org/forum/#!searchin/chromium-extensions/upcoming/chromium-extensions/7As9MKhav5E/dNiZDoSCCQAJ