Come faccio a visualizzare un'icona di estensione della pagina di Chrome nella barra degli indirizzi?

Question

Sto provando a creare un'estensione per Chrome che appare come un'icona nella barra degli indirizzi che, quando si fa clic, imposta contenteditable = true su tutti gli elementi della pagina, e quindi quando viene fatto clic nuovamente li riporta a contenteditable = false.

Tuttavia, sto cadendo al primo ostacolo ... L'icona non viene nemmeno visualizzata nella barra degli indirizzi.

Ecco il mio file manifesto:

{ 
    "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" 
    ] 
} 

ed ecco lo script caret.js:

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

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

}); 

Questo è il mio primo tentativo di un interno, quindi è abbastanza probabilmente un errore newbie, ma io apprezzare davvero qualsiasi aiuto o consiglio!

Answer 1

Ok, risulta avevo bisogno di usare chrome.pageAction.show(tab.id);, il che significava che avevo bisogno di ottenere l'ID della scheda corrente, che si ottiene con:

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

    chrome.pageAction.show(tab.id); 


}); 

MA si scopre non è possibile utilizzare chrome.tabs all'interno di uno script di contenuto, quindi ho dovuto passare a utilizzare una pagina di sfondo, invece.

Answer 2

My answer to this other question fornisce la soluzione. Cordiali saluti, il secondo problema di codice osservato in quella risposta è rilevante anche per il tuo codice: vuoi che l'icona appaia per tutte le pagine, quindi dovresti usare browser_action, non page_action. O funzionerà, ma l'utilizzo di un'azione di pagina su ogni pagina va contro le convenzioni e rende l'esperienza dell'utente meno coerente.

Answer 3

ho fatto questo:

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

Answer 4

Ho avuto un problema simile, qui sono i passi che ho seguito per risolverlo:

ho modificato il mio manifest.json per includere il seguente:

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

Quindi ho inserito il seguente codice nel mio script in background:

// 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 documentazione per questa può essere trovato qui ... https://developer.chrome.com/extensions/declarativeContent

Answer 5

Questo non è più possibile, come di ultima release.

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