Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Usare l'App Manager

L'app manager è uno strumento disponibile nella versione per Desktop di Firefox. Fornisce molti strumenti utili per aiutarti a testare , sviluppare e debuggare, direttamente dal tuo browser, applicazioni web HTML5 su Firefox OS phone e Firefox OS simulator.

L'App Manager è composto da:

  • Un Apps panel, che gestise le applicazioni locali (codice sorgente di app situate sul tuo computer) e app esterne in hosting. Avrai la possibilità di creare pacchetti e installare le tue app su un device fisico o su un simulatore e farne il debug usando il Toolbox
  • Un Device panel, che mostra informazioni sull'apparato collegato incluse: la verisone di Firefox OS instalata, i permessi necessari per usare le device APIs sull'apparato e le app installate
  • Toolboxes, che sono dei di strumenti di sviluppo (web console, inspector, debugger, etc.) che possono essere connessi ad una app in esecuzione attraverso il "Apps panel" al fine di eseguire operazioni di debug

Setup rapido:

Questa sezione è progettata per portarti "up and running" il più velocemente possibile;; se avessi bisogno di informazioni più dettagliate puoi andare alla sezione Device and system configuration  e ominciare da quel punto. Vedi anche la sezione Troubleshooting se hai problemi e cerchi aiuto.

  1. Controlla di avere Firefox Desktop 26+ installato
  2. Apri l'App Manager (nella barra degli indirizzi, scrivi about:app-manager)
  3. Se non possiedi un terminale fisico:
    1. Installa il Firefox OS Simulator
    2. Nella toolbar, in basso dell'App Manager's, fai click su Start Simulator, poi fai click sul nome del simulatore installato, che dovrebbe apparire.
  4. Se hai un apparato fisico:
    1. Assicurari che il terminale abbia la versione di Firegox OS maggiore di 1.2+
    2. Su Windows assicurati di aver installato i drivers forniti dal costruttore del telefono
    3. Nelle impostazioni del tuo apparato, disabilita il Blocco dello Schermo (Settings > Screen Lock) e abilita il Debug Remoto (Settings > Device information > More information > Developer)
    4. Installa lo ADB Helper add-on su Firefox Desktop
    5. Connetti il tuo apparato al tuo computer con un cavo USB
    6. Dovresti vedere il nome del tuo apparato nella barra in basso dell'App Manager. Fai click sopra di esso.
  5. La barra in basso dovrebbe visualizzare la scritta: "Connected to: xxx"
  6. Fai click su Apps panel e aggiungi una app (packaged or hosted)
  7. Il pulsante Refresh convalida la tua applicazione e la installa sul Simulatore/Apparato
  8. Il pulsante Debug connette gli strumenti di sviluppo all'applicazione in esecuzione
  9. Vedi la sezione Troubleshooting se hai problemi e cerchi aiuto.

Configurazione del sistema e dell'Apparato

La prima cosa che devi fare quando usi l'App Manager è assicurarti che il tuo sistema e il tuo telefono siano configurati conrrettamente. Questa sezione ti guiderà attraverso passo per passo attraverso le configurazioni necessarie.

Firefox 1.2+ necessario

Assicurati che sul tuo apparato sia installato Firefox OS 1.2/Boot2Gecko 1.2 o superiore. Per controllare quale versione di Firefox OS sia installato sul terminale, Settings > Device Information > Software.

Se non hai una versione sufficentemente aggiornata, devi installare una nightly build di Firefox 1.2+, oppure configurarne e compilarne una da solo dal codice sorgente.

Builds disponibili:

Per compilare da solo la dua distribuzione di Firefox OS 1.2+, segui le istruzioni che trovi a Building and installing Firefox OS, incominciando da Firefox OS build prerequisites.

Debug remoto

Devi, poi, abilitare il debug remoto in Firefox OS. Per farlo, vai in Settings > Device information > More information > Developer e spunta la casella il Remote Debugging.

ADB o ADB helper

Il processo usa il Android Debug Bridge (ADB) per mantenere la connessione e la comunicazione tra apparato e computer. Ci sono due modalità di funzionamento per ADB:

  • Permettere a Firefox di gestire ADB (recommandato). Installa lo ADB Helper add-on. Ciò rende il processo piu facile. Con questo componente installato, non c'è bisogno di installare lo ADB, e non c'è bisogno di digitare il comando adb forward : tutto è gestito dall'add-on.

    Download ADB Helper Add-on
  • Usare ADB manualmente. Devi averlo instalato sul tuo computer: fai il download e installa adb come spiegato in Installing ADB. Dovrai abilitare il port forwarding digitando i seguenti comandi nel terminale:
    adb forward tcp:6000 localfilesystem:/data/local/debugger-socket
    Dovrai eseguire digitare tale comando ogni volta che il telefono è disconnesso e riconnesso oppure riavviato.

Nota: Non è necessario eseguire questo comando se installi ADB Helper Add-on.

Connettere il tuo apparato all'App Manager

Finita la configurazione , puoi collegare l'apparato al computer e far partire l'App Manager:

  1. Connetti l'apparato al computer con il cavo USB.
  2. Disabilita lo Screen lock sul tuo apparato andando in Settings > Screen Lock e togliendo lo spunto a Lock Screen . Il motivo per cui è il passaggio precedente è una buona idea poichè lo screen lock determina la disconnissione del terminale; ciò significa che non è più disponibile per il debugging.
  3. Apri l'App Manager — Su Firefox Desktop seleziona dal menu Tools > Web Developer > App Manager, o digita about:app-manager nella barra degli indirizzi.
  4. Sul fonfo della tab dell'App Manager, vedrai una barra di stato della connessione (vedi screenshot sotto). Dovresti poter connettere il tuo apparato premendo il bottone "Connect to localhost:6000".
  5. Se va tutto bene, dovrebbe comparitr una scritta sul terminale: "An incoming request to permit remote debugging connection was detected. Allow connection?". Tap the OK button (You may also have to press the power button on the phone so you can see the prompt.) The connection status bar should update to say "Connected to B2G", with a Disconnect button available to press if you want to cancel the connection.

Note that the other controls in the connection status bar allow you to connect a simulator to the App Manager, which we cover in the next section, below, and change the port that the connection happens on. If you change the port, you'll also need to enable port forwarding for this port as well, as instructed in the Enable port forwarding section, above.

Using a Firefox OS Simulator Add-on

If you haven't got a real device available to use with App Manager, you can still try it out using a Firefox OS Simulator Add-on. To start off, install the simulator with the following button (multiple versions are available; you are advised to install them all, for maximum flexibility):

Install Simulator

Once you've installed the simulator(s), you need to go to the connection status bar at the bottom of the App Manager tab, and click the "Start simulator" button. At least three buttons will appear:

  • "Firefox OS 1.3", "Firefox OS 1.2" ... etc. (or something similar): the leftmost buttons contain the names of the simulator versions you have installed. Click one to start a connection to a simulator.
  • "Add": the middle button navigates to the simulator install links in this article, so you can add more Simulators (Firefox OS 1.2, Firefox OS 1.3, ...).
  • "Cancel": the right hand button cancels the connection.

Apps panel

Now everything is working, let's review the functionality available inside the App Manager, starting with the Apps panel. From here, you can import an existing app to push onto your device and debug:

  • To install a local app, click on the plus next to the "Add Packaged App" label and use the resulting file chooser dialog to select the directory your app is contained inside.
  • To install an externally hosted app, enter the absolute URL of the app's manifest file into the text field inside the "Add Hosted App" box, then press the plus button.

Information about your app should appear on the right hand side of the window, as seen below:

Manifest editor

From Firefox 28 onwards, the Apps Panel includes an editor for the app manifest:

Debugging

Clicking on "Update" will update (install) the app on the device. Clicking on "debug" will connect a toolbox to the app, allowing you to debug its code directly:

Note: You'll enjoy playing around with the toolbox — try altering the DOM, CSS etc. and you'll see the updates reflected on the device in realtime. Such updates will be saved on the installed app code; you'll see them next time you open the app on the device.

Before Firefox 28, the tools are launched in a separate window. From Firefox 28 onwards, the tools are launched in a separate tab in the App Manager itself, alongside the Apps and Device tabs. The tab is given your app's icon so it's easy to find:

Errors

If an app was not added successfully — for example if the URL was incorrect, or you selected a packaged app folder — an entry will be added to the page for this app, but this will include error information.

You can also delete an app from this view, by hovering over the App name/description on the left of the window, and pressing the "X" button that appears in each case. This however doesn't remove the app from the device. To do that you need to manually remove the app using the device itself.

Device panel

The Device tab displays information about the connected device. From the "Installed Apps" window, apps on the device can be started and debugged.

Note: Certified Apps are not listed by default. See how to debug certified apps.

The "Permissions" window shows the required priviledges for different Web APIs on the current device:

Finally, you can take a screenshot of the current device display by clicking the "Screenshot" button. The screenshot appears in a new tab on Firefox, and from there you can save or discard it as you wish.

Debugging Certified Apps

Currently only devices running a development build of Firefox OS 1.2 are capable of debugging certified apps. If you have a development build, you can enable certified app debugging by changing the pref devtools.debugger.forbid-certified-apps to false in your profile. To do this, follow the steps below:

  1. On your computer, enter the following command in Terminal/console to enter your device's filesystem via the shell:

    adb shell

    Your prompt should change to root@android.

  2. Next, stop B2G running using the following command:

    stop b2g
  3. Navigate to the following directory:

    cd /data/b2g/mozilla/*.default/
  4. Here, update the prefs.js file with the following line:

    echo 'user_pref("devtools.debugger.forbid-certified-apps", false);' >> prefs.js
  5. After you've finished editing and saving the file, start B2G again using the following command:

    start b2g
  6. Exit the android filesystem using the exit command; this will return you to your normal terminal prompt.

  7. Next, reconnect to the App Manager and you should see certified apps appear for debugging.

Note: If you want to add this preference to your Gaia build you can run make DEVICE_DEBUG=1 reset-gaia.

Troubleshooting

If the device is not recognized:

Can't connect your device to the App Manager or start the simulator? Let us know or file a bug.

Tag del documento e collaboratori

 Hanno collaborato alla realizzazione di questa pagina: chrisdavidmills, bassam, moamahi
 Ultima modifica di: chrisdavidmills,