Benutzung des App Managers

Der App Manager besteht aus folgenden Komponenten:

• Ein Apps-Panel zur Verwaltung von lokalen Apps (Source Code ist auf dem eigenen Computer gespeichert) und Apps, die extern gehostet sind. Diese können paketiert, auf einem Gerät oder im Simulator installiert und mit Toolboxes getestet werden.
• Ein Device-Panel, welches Informationen über das verbundene Gerät, wie installierte Firefox OS Version, benötigte Rechte für die Benutzung der APIs auf dem Gerät und installierte Apps anzeigt.
• Toolboxes, die sich aus Komponenten der Entwickler-Werkzeuge zusammensetzen (Web-Konsole, Inspektor, Debugger, etc.) und über das Apps-Panel mit einer laufenden App verbunden werden können, um Debugging zu betreiben.

Schnelleinstieg:

Dieser Abschnitt soll einen möglichst schnellen Einstieg ermöglichen. Falls genauere Erklärungen benötigt werden, überspringen Sie bitte diesen Abschnitt und lesen Sie Device and system configuration. Bei Problemen könnte außerdem der Abschnitt Troubleshooting weiterhelfen.

1. Stellen Sie sicher, dass Firefox Desktop 26+ installiert ist.
2. Öffnen Sie den App Manager (tippen Sie about:app-manager in die URL-Leiste).
3. Falls kein echtes Gerät mit Firefox OS zur Verfügung steht:
   1. Installieren Sie den Firefox OS Simulator
   2. Klicken Sie auf Start Simulator in der unteren Werkzeugleiste des App Managers und anschließend auf den Namen des installierten Simulators.
4. Falls Sie ein echtes Gerät besitzen:
   1. Stellen Sie sicher, dass auf dem Gerät Firefox OS 1.2+ läuft.
   2. Wenn Sie unter Windows arbeiten, stellen Sie sicher, dass Sie die bereitgestellten Treiber Ihres Handys installiert haben.
   3. Deaktivieren Sie die Bildschirmsperre in den Einstellungen des Geräts (Settings > Screen Lock) und aktivieren Sie Remote Debugging (Settings > Device information > More information > Developer).
   4. Installieren Sie das ADB Helper Add-on in Firefox Desktop.
   5. Verbinden Sie ihr Gerät über ein USB-Kabel mit dem Computer.
   6. Der Name des Geräts sollte nun in der unteren Leiste des App Managers erscheinen. Klicken Sie den Namen an.
5. Die untere Leiste sollte anzeigen "Connected to: xxx".
6. Klicken Sie auf das Apps-Panel und fügen Sie eine App hinzu (paketiert oder gehostet).
7. Der Refresh-Button validiert Ihre App und installiert sie auf dem Simulator/Gerät.
8. Der Debug-Button verbindet die Entwickler-Tools mit der laufenden App.

Geräte- und System-Konfiguration

Bei der Benutzung des App Manager sollte man zuerst sicherstellen, dass System und Gerät korrekt konfiguriert sind. Dieser Abschnitt beschreibt alle dafür nötigen Schritte.

Firefox 1.2+ wird benötigt

Stellen Sie sicher, dass auf Ihrem Gerät Firefox OS 1.2/Boot2Gecko 1.2 oder höher läuft. Die Versionsnummer von Firefox OS wird unter Settings > Device Information > Software angezeigt.

Falls die installierte Version nicht hoch genug ist, muss je nachdem welches Gerät Sie verwenden, eine der verfügbaren Nightly-Builds von Firefox 1.2+ installiert oder eine Version selbst kompiliert werden.

Verfügbare Builds:

• Geeksphone Keon/Peak Builds (für mehr Informationen lesen Sie Updating and Tweaking your Firefox OS Developer Preview phone/Geeksphone).
• Weitere Builds folgen später.

Remote-Debugging

Als nächstes muss Remote Debugging in Firefox OS aktiviert werden. Navigieren Sie zu Settings > Device information > More information > Developer und aktivieren Sie die Checkbox bei Remote Debugging.

ADB oder ADB Helper

Über die Android Debug Bridge (ADB) wird die Verbindung und Kommunikation zwischen Gerät und Computer geregelt. Es gibt zwei Möglichkeiten ADB einzusetzen:

• Lassen Sie Firefox die Kontrolle über ADB übernehmen (empfohlen). Installieren Sie das ADB Helper Add-on, welches den Vorgang vereinfacht. Auf diese Weise brauchen Sie weder ADB installieren noch den Befehl adb forward ausführen - alles wird automatisch vom Add-on erledigt.

  Download ADB Helper Add-on
• Benutzen Sie ADB manuell. Hierfür muss ADB auf dem Computer installiert sein - downloaden und installieren Sie adb (genauer erläutert unter: Installieren von ADB). Damit die Verbindung funktioniert, muss die Port-Weiterleitung mit folgendem Terminal-Befehl aktiviert werden:

  adb forward tcp:6000 localfilesystem:/data/local/debugger-socket

  Der Befehl muss nach jedem Neustart des Telefons oder Aus- und wieder Einstecken erneut ausgeführt werden.

Verbinden des Geräts mit dem App Manager

Nachdem alles konfiguriert wurde, ist es nun an der Zeit, das Gerät mit dem Computer zu verbinden und den App Manager zu starten:

1. Verbinden Sie das Gerät via USB mit dem Computer.
2. Deaktivieren Sie Screen lock auf dem Gerät, indem Sie zu Settings > Screen Lock navigieren und die Checkbox bei Lock Screen deaktivieren. Dieses Vorgehen ist sehr ratsam, da die Verbindung abbricht, sobald sich die Bildschirmsperre aktiviert.
3. Starten Sie den App Manager — klicken Sie in der Menüleiste von Firefox Desktop Extras > Web-Entwickler > App Manager an oder tippen Sie about:app-manager in die URL-Leiste.
4. An der Unterseite des App Manager Tabs sehen Sie nun eine Anzeige für den Verbindungsstatus (siehe Screenshot unten). Es sollte nun möglich sein das Gerät durch einen Klick auf den "Connect to localhost:6000" Button zu verbinden.
5. Falls die Verbindung erfolgreich hergestellt wurde, erscheint eine Frage auf dem Gerät: "An incoming request to permit remote debugging connection was detected. Allow connection?". Bestätigen Sie mit dem OK-Button (evtl. müssen Sie den Power-Button am Gerät betätigen, damit Sie die Frage sehen können). Der Verbindungsstatus in der Leiste sollte dann "Connected to B2G" und einen Disconnect-Button zum Abbruch der Verbindung anzeigen.

Firefox OS Simulator Add-on

Steht kein echtes Gerät zur Verfügung, das mit dem App Manager benutzt werden kann, kann es dennoch zusammen einem Firefox OS Simulator Add-on ausprobiert werden. Installieren Sie hierzu einen Simulator, passend für Ihr Betriebssystem (mehrere Versionen verfügbar, es ist ratsam alle zu installieren, für maximale Flexibilität):

Simulator installieren

Nach der Installation des Simulators/der Simulatoren gehen Sie auf about:app-manager und klicken Sie in der Verbindungsstatus-Leiste unten den "Start Simulator"-Button. Daraufhin erscheinen drei weitere Buttons:

• "Firefox OS 1.2" ... etc (oder ähnliches): Der Button ganz links zeigt den Namen der installieten Version des Simulators an. Klicken Sie hier, um die Verbindung mit dem Simulator aufzubauen.
• "Add": der mittlere Button verweist auf die Links zur Installation der Simulatoren in diesem Artikel zum Hinzufügen neuer Simulatoren (Firefox OS 1.2, Firefox OS 1.3, ...).
• "Cancel": Der Button mit der rechten Hand bricht die Verbindung ab.

Apps-Panel

Da nun alles soweit funktionert, wird nun die Funktionalität des App Managers beschrieben, beginnend mit dem Apps Panel. Von hier aus können Sie eine bereits existierende App importieren, auf Ihr Gerät übertragen und debuggen:

• Für die Installation einer lokalen App, klicken Sie auf das Plus neben "Add Packaged App"-Label und wählen Sie über den Datei-Auswahldialog den Ordner aus, in dem die App gespeichert ist.
• Um eine extern gehostete App zu installieren, geben Sie die vollständige URL zur Manifest-Datei der App in das Textfeld in der "Add Hosted App" Box ein und klicken Sie den Plus-Button.

Ist dieser Schritt gelungen, sollten auf der rechten Seite des Fensters Informationen über die App angezeigt werden:

Manifest Editor

Mit Firefox 28 und später findet sich im Apps Panel ein Editor für das App-Manifest:

Debugging

Ein Klick auf "Update" überträgt (installiert) die App auf das Gerät. Mit einem Klick auf "Debug"  wird eine Toolbox mit der App verbunden, womit die App getestet werden kann:

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:

Fehler

Falls eine App nicht erfolgreich hinzugefügt werden konnte - zum Beispiel weil die angegebene URL nicht korrekt ist oder ein gepackter App-Ordner ausgewählt wurde - wird dennoch ein Eintrag für die App hinzugefügt, dieser enthält jedoch Fehlermeldungen.

Bei dieser Ansicht ist es auch möglich, eine installierte App zu deinstallieren. Halten Sie hierfür den Mauszeiger über den Namen oder die Beschreibung der jeweiligen App auf der linken Seite und klicken Sie den X-Button an. Die App wird dadurch jedoch nicht vom Gerät entfernt. Um dies zu tun, muss das Gerät selbst benutzt werden.

Device-Panel

Im Tab unter Device werden Informationen zum verbundenen Gerät angezeigt. Von dem Fenster "Installed Apps" aus können die Apps auf dem Gerät gestartet und gedebuggt werden.

Das Fenster "Permissions" zeigt die benötigten Rechte für verschiedene Web-APIs des Geräts:

Abschließend können Sie einen Screenshot mit dem Bildschirminhalt des Geräts erstellen, indem Sie den Screenshot-Button anklicken. Der Screenshot wird dann in einem neuen Tab in Firefox geöffnet und kann von dort aus gespeichert oder verworfen werden.

Debuggen von zertifizierten Apps

Bis dato können nur Geräte, welche mit einem Development-Build von Firefox OS 1.2 laufen, für das Debuggen von zertifizierten Apps benutzt werden. Falls auf ihrem Gerät ein Development-Build installiert ist, können Sie das Debuggen von zertifzierten Apps erlauben, indem Sie die Einstellung devtools.debugger.forbid-certified-apps in ihrem Firefox-Profil auf false setzen. Gehen sie hierfür wie folgt vor:

1. Geben Sie auf ihrem Computer den folgenden Befehl in ein Terminal/Konsole ein, um über die Shell auf das Dateisystem des Geräts zuzugreifen:

   adb shell

   Daraufhin sollte sich der Prompt zu root@android ändern.

2. Als nächstes stoppen sie B2G mit dem Befehl:

   stop b2g

3. Wechseln Sie mit folgenden Befehl zum Profilordner:

   cd /data/b2g/mozilla/*.default/

4. Und fügen Sie mit folgendem Befehl eine Zeile für die Einstellung in die Datei prefs.js ein:

   echo 'user_pref("devtools.debugger.forbid-certified-apps", false);' >> prefs.js

5. Nachdem die Datei bearbeitet und gespeichert wurde, starten Sie B2G erneut:

   start b2g

6. Verlassen Sie das Android-Dateisystem mit der Eingabe des Befehls exit. Damit kehren Sie zum normalen Terminal-Prompt zurück.

7. Stellen Sie nun eine Verbindung mit dem App Manger her. Die zertifizierten Apps sollten nun angezeigt werden.

Running custom builds in the App Manager

You can run custom B2G Desktop and Gaia builds in the App Manager via the simulator. Read Running custom Firefox OS/Gaia builds in the App Manager for more details.

Fehlerbehandlung

Falls das Gerät nicht gefunden wird:

• Lesen Sie den Abschnitt Device and system configuration sorgfältig und überprüfen Sie, ob alle Schritte korrekt durchgeführt wurden:
• Läuft auf dem Gerät mindestens Firefox OS 1.2?
• Fehlen Apps? Ist Debuggen von zertifizierten Apps aktiviert?
• Ist "Remote Debugging" in den Einstellungen des Telefons aktiviert?
• Falls Sie das ADB Helper add-on nicht verwenden:
  • Wurde der Befehl adb forward erfolgreich ausgeführt?
• Falls Sie das ADB Helper add-on verwenden und das Gerät in der unteren Leiste nicht angezeigt wird:
  • Falls Sie Linux als Betriebssystem einsetzen, vergewissern Sie sich dass udev korrekt konfiguriert ist.
  • Falls Sie Windows als Betriebssystem einsetzen, stellen Sie sicher, dass die benötigten Treiber installiert sind.
• You can also enable verbose logging to gather diagnostics:
  • Use about:config to set the pref "[email protected].console.logLevel" to the string value "all"
  • Disable and re-enable the ADB Helper add-on from the add-ons manager, or restart Firefox
  • Open the App Manager again
  • In the Browser Console, you should now see additional output lines that mention "adbhelper"
  • If you see them but aren't sure what they mean, stop by the #devtools room on IRC or file a bug with the log output
• See "???????" instead of the device name on Linux? You have permissions issues. Make sure to setup udev correctly.
• Ist die Bildschirmsperre deaktiviert?

Die Verbindung des Geräts mit dem App Manager funktioniert nicht oder der Simulator kann nicht gestartet werden? Lassen Sie es uns wissen oder schreiben Sie einen Bugreport.