Oggi ho imparato due cose fondamentali per lo sviluppo di estensioni Mozilla Firefox: strumenti per il debugging di Javascript e dichiarazione variabili globali nel codice dell’estensione.
- Debug. Estendere le funzionalità di un’estensione di Firefox già esistente vuol dire averlo già installato nel browser e modificare gli script javascript. Per testare i vostri cambiamenti o le vostre aggiunte, purtroppo, bisogna sempre sostituire i file vecchi con i nuovi, riavviare Firefox e vedere cosa succede. Pare che non esista nessun debugger locale a questo scopo e quindi niente breakpoint. L’unica è fare nel modo grezzo, quindi inserire tante stringhe di testo in modo che vengano stampate a video durante l’esecuzione e vedere se il flusso è quello atteso. Fondamentale è la Console degli errori che, a partire da Firefox 2, trovate già inclusa in Strumenti -> Console degli errori. Per stampare stringhe nella console bisogna abilitare la funzionalità che per default non è abilitata quindi nella barra degli indirizzi di Firefox inserite
about: confige successivamente create la nuova voce
browser.dom.window.dump.enabled = true
Da ora in poi nel vostro codice potrete utilizzare la funzione
dump(“string”); che vi stamperà la stringa (string) nella console degli errori; - Variabili globali. Altra cosa fondamentale sono le variabili globali. L’interfaccia grafica di Mozilla non è nient’altro che un’insieme di file di tipo XUL (un particolare tipo di XML) e quindi le vostre estensioni, per esempio se volete creare una toolbar, saranno a loro volta dei file XUL da attaccare al browser. La vostra estensione sarà un overlay, una specie di layer da attaccare al layer browser.
Le funzionalità connesse ai pulsanti dichiarati graficamente nei file XUL sono però funzioni Javascript. Ci possono essere tantissimi file Javascript, come di fatto accade, per mantenere un pò di modularità e la cosa interessante è che le variabili globali di un’estensione sono globali per tutte le estensioni installate. Nel mio caso mi veniva utile instanziare una variabile (come un oggetto java) in modo tale che venisse istanziato solo una volta all’avvio della mia estensione e quindi visibile e utilizzabile da tutti gli altri file javascript. Per fare questo c’è da considerare che la vostra estensione avrà due file fondamentali che sono
overlay.xul e overlay.js.
Il primo definisce lo XUL della vostra estensione, quindi se la vostra estensione è una toolbar piuttosto che un nuovo menù, mentre nel file overlay.js ci sono le funzionalità utilizzate dai pulsanti del vostro XUL. overlay.js sarà il primo file Javascript che verrà chiamato all’avvio della vostra estensione e quindi è il posto giusto per istanziare un oggetto che volete venga creato solo una volta e poi utilizzato da tutti.
Quindi, dentro overlay.XUL dichiarate
<script type=”application/x-javascript” src=”helloWorld.js”/>
proprio sotto l’apertura del tag <overlay>, e soprattutto dichiaratelo PRIMA di <script type=”application/x-javascript” src=”overlay.js”/>
perchè altrimenti non funzionerà.
Ora dentro il file overlay.js dichiarate una variabile del tipo
var hello = new HelloWorld();
e questa variabile avrà uno scope globale all’interno della vostra estensione, in modo tale che la variabile hello possa essere utilizzata ovunque!
Related Posts
- Una finestra sul 2014
- My Delicious
- Fuori la mafia dallo Stato
- Click <> Touch
- Anche HP produrrá il suo tablet
