Debugging Firefox für Android mit dem WebIDE

Dieser Artikel beschreibt wie man die Firefox Developer Tools mit Firefox für Android unter Firefox 36 oder höher verbindet.

Seit einer langen Zeit ist es möglich die Firefox Developer Tools mit Firefox für Android zum Debuggen einer mobilen Website zu verbinden. Bis jetzt war dies ein sehr komplexer und fehleranfälliger Prozess. Seit Firefox 36 ist der Prozess einfacher: Teilweise muss man garnicht nicht mehr mit dem ADB Tool arbeiten. Jetzt arbeitest du mit dem WebIDE, welches für dich im Hintergrund mit ADB arbeitet.

Um mit dem WebIDE zu arbeiten, benötigst du mindestens Firefox 36 auf deinem PC oder Laptop und Firefox 35 auf deinem mobilen Gerät. Wenn du mit älteren Versionen arbeitest siehe dir bitte den Artikel Developer Tools mit Firefox für Android verbinden an.

 

Diese Anleitung besteht aus zwei Teilen. Der erste Teil beschreibt die zu treffenden Vorbereitungen, die nur einmal zu tätigen sind, der zweite Teil beschreibt das Verbinden, dies wird jedes Mal nötig sein.

Vorbereitungen

Zuerst brauchst du:

  • Einen PC oder Laptop mit laufendem Firefox 36 oder höher
  • Ein Android-Gerät mit laufendem Firefox für Android 35 oder höher
  • Ein USB-Kabel um beide Geräte zu verbinden

ADB Helper (ADB Helfer)

Dein Desktop-Firefox benötigt zudem das ADB Helper-AddOn in Version 0.7.1 oder höher. Dieses AddOn sollte mit dem ersten Öffnen des WebIDE automatisch installiert werden. Um die installierte Version zu prüfen, gib bitte about:addons in die Adressbar deines Browsers ein, dort sollte ADB gelistet werden.

Wenn ADB Helper nicht in Version 0.7.1 oder höher installiert ist, wähle bitte "Zusätzliche Komponenten verwalten" im "Projekte"-Menü. Dort sollte unter "Zusätzliche Komponenten" ein Eintrag für ADB Helper dabei sein.

Klicke auf "Deinstallieren" und dann auf "Installieren", das AddOn sollte nun in der aktuellen Version vorliegen.

Das Android-Gerät einrichten

Ersteinmal muss das USB-Debugging aktiviert werden, folge dazu den Schritten 2 und 3 dieser Anleitung.

Als nächstes muss Externes Debugging in Firefox für Android aktiviert werden. Öffne den Browser und das darin enthaltene Menü, wähle "Einstellungen" und dann "Entwicklerwerkzeuge" (auf manchen Android-Geräten muss der "Mehr"-Button gedrückt werden, um die Einstellungen aufrufen zu können). Aktiviere die "Externes Debugging über USB"-Checkbox:

Möglicherweise zeigt der Browser eine Nachricht an, dass Port Forwarding aktiviert werden soll, diese kann ignoriert werden.

Verbinden

Schließe das Gerät mit dem USB-Kabel an deinen PC oder Laptop an, öffne das WebIDE und wähle in der rechten Sidebar bzw. im Menü "Umgebung" unter "USB-Geräte" dein Gerät aus:

Auf dem Gerät wird nun eine Warnmeldung angezeigt:

Deutsch: Eine eingehende Anfrage möchte eine externe Debugging-Verbindung erstellen. Ein externes Gerät kann die komplette Kontrolle über deinen Browser erlangen! Erlauben? / OK - Abbrechen - Deaktivieren

Klicke auf "OK". In der linken Sidebar bzw. im Menü "Öffne App" werden nun alle geöffneten Tabs angezeigt.

Wähle einen Tab aus, um die Developer Tools zu öffnen:

Nun solltest du in der Lage sein die Firefox Developer Tools mithilfe von Externem Debugging zu bedienen. Sieh dir die Seite über Externes Debugging für mehr Informationen an.

Schlagwörter des Dokuments und Mitwirkende

 Mitwirkende an dieser Seite: Micky261, Tokala1990, Caroma102, hansd78, chap21, Basu8179, Andreas1978
 Zuletzt aktualisiert von: Micky261,