mozilla

Versionen vergleichen

Externes Debugging mit Firefox for Android

Versionsänderungen

Version 531513:

Version 531513 von popeye007 am

Version 544217:

Version 544217 von mkohler am

Titel:
Remotely debugging Firefox for Android
Remotely debugging Firefox for Android
Adressname:
Tools/Remote_Debugging/Firefox_for_Android
Tools/Remote_Debugging/Firefox_for_Android
Inhalt:

Version 531513
Version 544217
n8      This guide explains how to use <a href="/en-US/docs/Mozillan8      Diese Anleitung erklärt, wie man <a href="/en-US/docs/Mozil
>/Firefox_OS/Firefox_OS_usage_tips/Remote_debugging">remote debugg>la/Firefox_OS/Firefox_OS_usage_tips/Remote_debugging">remote debu
>ing</a> to inspect or debug code running in <a href="/en-US/docs/>gging</a> verwendet, um Code unter <a href="/en-US/docs/Mozilla/F
>Mozilla/Firefox_for_Android">Firefox for Android</a> over USB.>irefox_for_Android">Firefox for Android</a> über USB zu inspizier
 >en und zu debuggen.
n14      This guide's split into two parts: the first part, "Prerequn14      Diese Anleitung ist in zwei Teile aufgeteilt: im ersten Tei
>isites" covers stuff you only need to do once, while the second p>l, "Voraussetzungen", werden die Voraussetzungen erklärt, welche 
>art, "Connecting", covers stuff you need to do each time you conn>aber nur einmal durchgeführt werden müssen. Im zweiten Teil, "Ver
>ect the device.&nbsp;>binden", wird erklärt, wie man zum Gerät verbindet. Dieser zweite
 > Teil muss immer wieder durchgeführt werden.
n17      Prerequisitesn17      Voraussetzungen
n20      First, you'll need:n20      Um zu beginnen, benötigen Sie folgendes:
n23      <li>a desktop or laptop computer with Firefox running on itn23      <li>einen Computer oder Laptop mit Firefox
n25      <li>an Android device <a href="https://support.mozilla.org/n25      <li>ein Android-Mobilgerät mit Firefox for Android installi
>en-US/kb/will-firefox-work-my-mobile-device" title="https://suppo>ert&nbsp;
>rt.mozilla.org/en-US/kb/will-firefox-work-my-mobile-device">capab 
>le of running Firefox for Android</a> with Firefox for Android ru 
>nning on it 
n27      <li>a USB cable to connect the two devicesn27      <li>ein USB-Kabel, um das Mobilgerät mit dem Computer zu ve
 >rbinden
n31      ADB setupn31      ADB Installation
n34      Next, you'll need to get the desktop and the Android devicen34      Als nächstes müssen Sie das Mobilgerät und den Computer so 
> talking to each other using the <a href="https://developer.andro>einrichten, dass die beiden miteinander kommunizieren können. Daf
>id.com/tools/help/adb.html" title="https://developer.android.com/>ür wird das <a href="https://developer.android.com/tools/help/adb
>tools/help/adb.html">adb</a> command-line tool.>.html" title="https://developer.android.com/tools/help/adb.html">
 >adb</a> Kommandozeilen-Programm verwendet.
n37      On the Android devicen37      Auf dem Android-Mobilgerät
n41        <a href="http://developer.android.com/guide/developing/den41        <a href="http://developer.android.com/guide/developing/de
>vice.html#setting-up" title="http://developer.android.com/guide/d>vice.html#setting-up" title="http://developer.android.com/guide/d
>eveloping/device.html#setting-up">Enable USB debugging (step 2 of>eveloping/device.html#setting-up">USB Debugging aktivieren (nur S
> this link only)</a>.>chritt 2 von diesem Link)</a>.
n43      <li>Attach the device to the desktop via USB.n43      <li>Schliessen Sie das Mobilgerät über USB an den Computer 
 >an
n47      On the desktopn47      Auf dem Computer/Laptop
n50      <li>Install the correct version of the <a href="http://deven50      <li>Installieren Sie die passende <a href="http://developer
>loper.android.com/sdk/index.html" title="http://developer.android>.android.com/sdk/index.html" title="http://developer.android.com/
>.com/sdk/index.html">Android SDK</a> for your device.>sdk/index.html">Android SDK</a> Version für Ihr Mobilgerät.
n52      <li>Using the Android SDK, install the <a href="http://deven52      <li>Installieren die <a href="http://developer.android.com/
>loper.android.com/sdk/installing.html#components" title="http://d>sdk/installing.html#components" title="http://developer.android.c
>eveloper.android.com/sdk/installing.html#components">Android Plat>om/sdk/installing.html#components">Android Platform Tools</a> mit
>form Tools</a>.> Hilfe des Android SDK.
n54      <li>Android Platform Tools installs adb in the "platform-ton54      <li>Android Platform Tools installiert adb im "platform-too
>ols" directory under the directory in which you installed the And>ls" Ordner im Android-SDK-Installationspfad. Stellen Sie sicher, 
>roid SDK. Make sure the "platform-tools" directory is in your pat>dass der "platform-tools" Ordner in der PATH-Variable eingetragen
>h.> ist.
n58      To check it worked, open up a command shell on the desktop n58      Um dies zu testen, können Sie folgenden Befehl in&nbsp; der
>and type:> Kommandozeile eingeben:
n64      You should see some output like:n64      Nun sehen Sie eine Ausgabe analog zu folgender:
n71      (The long hex string will be different.)n71      (Die lange Hex-Zeichenkette wird verschieden sein.)
n74      If you do, then <code>adb</code> has found your device and n74      Wenn diese Ausgabe korrekt ist, wurde ADB korrekt installie
>you've successfully set up ADB.>rt und ADB konnte das Mobilgerät korrekt erkennen.
n77      Enable remote debuggingn77      Remote Debugging aktivieren
n80      Next, you need to enable remote debugging on both the Andron80      Als nächstes muss "Remote Debugging" auf dem Mobilgerät und
>id device and the desktop.> dem Computer aktiviert werden.
n83      Firefox for Android 24 and earliern83      Firefox for Android 24 und früher
n86      To enable remote debugging on the device, you need to set tn86      Um "Remote Debugging" auf dem Mobilgerät zu aktivieren, mus
>he <code>devtools.debugger.remote-enabled</code> preference to <c>s der Wert der <code>devtools.debugger.remote-enabled</code> Eins
>ode>true</code>.>tellung auf <code>true</code> gesetzt werden.
n89      Go to <code>about:config</code> in Firefox for Android, typn89      Gehen Sie nach <code>about:config</code> in Firefox for And
>e "devtools" into the search box and press the Search key. You'll>roid, tippen Sie "devtools" ins Suchfeld und drücken Sie auf den 
> see all the devtools preferences. Find the <code>devtools.debugg>Suchen-Button. Nun sehen Sie alle devtools-Einstellungen. Setzen 
>er.remote-enabled</code> preference, and press "Toggle".>Sie nun die <code>devtools Einstellung debugger.remote-enabled</c
 >ode> auf <code>true</code>, indem Sie auf "Umschalten" klicken.
n95      Firefox for Android 25 and latern95      Firefox for Android 25 und später
n98      On Firefox for Android 25 and later, there's a menu item ton98      Bei Firefox for Android 24 und später gibt es einen Menü-Ei
> enable remote debugging. Open the menu, select "Settings", then >ntrag, um "Remote Debugging" zu aktivieren. Öffnen Sie das Menü, 
>"Developer tools" (on some Android devices you may need to select>wählen Sie "Einstellungen", dann "Entwicklerwerkzeuge" (auf einig
> "More" to see the "Settings" option). Check the "Remote debuggin>en Android-Geräten müssen Sie auf "Mehr" klicken, um den Einstell
>g" box:>ungen-Eintrag zu sehen). Aktivieren Sie das Kontrollkästchen bei 
 >"Remote debugging":
n104      The browser will display a notification reminding you to sen104      Der Browser zeigt nun eine Notifikation an, dass die Portwe
>t up port forwarding, which we'll do later on.>iterleitung noch aktiviert werden muss. Dies werden wir später ma
 >chen.
n106    <h4 id="On_the_desktop">n106    <h4 id="On_the_desktop_2">
107      On the desktop107      Auf dem Computer
n110      On the desktop, remote debugging is enabled by a setting inn110      Auf dem Computer wird "Remote debugging" über die Entwickle
> the Toolbox. <a href="/en-US/docs/Tools_Toolbox" title="/en-US/d>rwerkzeuge aktiviert. <a href="/en-US/docs/Tools_Toolbox" title="
>ocs/Tools_Toolbox">Open the Toolbox</a>, click the "Settings" but>/en-US/docs/Tools_Toolbox">Öffnen Sie die Entwicklerwerkzeuge</a>
>ton in the <a href="/en-US/docs/Tools_Toolbox#Toolbar" title="/en>, klicken Sie auf die "Einstellungen" Schaltfläche in der Symboll
>-US/docs/Tools_Toolbox#Toolbar">toolbar</a>, and check "Enable re>eiste und aktivieren Sie das Kontrollkästchen neben "Externes Deb
>mote debugging" in the <a href="/en-US/docs/Tools_Toolbox#Setting>ugging aktivieren":
>s" title="/en-US/docs/Tools_Toolbox#Settings">Settings</a> tab: 
n116      If you're using a version of Firefox older than 27, you'll n116      Wenn Sie Firefox 26 oder älter verwenden, müssen Sie danach
>need to restart the browser for the setting to take effect.> Firefox neu starten. Nach diesem Schritt sehen Sie im "Web-Entwi
 >ckler" Menü einen neuen Eintrag "Verbinden...":
n118    <p>n118    <div class="Note">
119      You'll then see a new option in the Web Developer menu labe119      &nbsp;
>led "Connect...": 
120    </p>120    </div>
n125      Connectingn125      Verbinden
n128      Now you can connect the remote debugging tools to the devicn128      Da Sie nun alles eingerichtet haben, können Sie den Compute
>e. First, attach the device to the desktop with a USB cable, if y>r über den "Verbinden..." Menü-Eintrag mit Ihrem Firefox for Andr
>ou haven't already.>oid verbinden. Dazu verbinden Sie zuerst Ihr Mobilgerät mit Ihrem
 > Computer, falls Sie dies nicht bereits gemacht haben.
n130    <h4 class="note" id="On_the_desktop">n130    <h4 class="note" id="On_the_desktop_3">
131      On the desktop131      Auf dem Computer
n134      Go to a command prompt, and type:n134      Öffnen Sie ein Kommandozeilen-Fenster und tippen Sie:
n140      (If you've changed the value the Android device uses for a n140      (Falls Sie den zu verwendeten Port auf dem Android-Mobilger
>debugging port, you'll need to adjust this accordingly.)>ät geändert haben, müssen Sie hier den geänderten Wert eintragen.
 >)
n143      For Firefox OS, type:n143      Für Firefox OS, tippen Sie:
n149      You'll need to reissue this command each time you physicalln149      Diesen Befehl müssen Sie immer ausführen, wenn das Mobilger
>y attach desktop and device with the USB cable.>ät über USB-Kabel an den Computer angeschlossen wird.
n152      Then go to the Web Developer menu on Firefox, and select "Cn152      Gehen Sie nun ins "Web-Entwickler" Menü und wählen Sie "Ver
>onnect...". You'll see a page that looks like this:>binden...". Sie werden folgende Seite sehen:
n155      <img alt="" src="https://mdn.mozillademos.org/files/5813/ren155      <img alt="" src="https://mdn.mozillademos.org/files/5813/re
>mote-debugging-desktop-connect.png" style="display: block; margin>mote-debugging-desktop-connect.png" style="display: block; margin
>-left: auto; margin-right: auto;">Unless you've changed the port >-left: auto; margin-right: auto;">Sofern Sie den Android-Port nic
>numbers, choose 6000 and press the "Connect" button.>ht geändert haben, wählen Sie hier 6000 und drücken auf "Verbinde
 >n".
n157    <h4 class="note" id="On_the_Android_device">n157    <h4 class="note" id="On_the_Android_device_2">
158      On the Android device158      Auf dem Android-Mobilgerät
n161      Next you'll see a dialog on the Android device asking you tn161      Nun sehen Sie auf Ihrem Mobilgerät folgende Meldung, da sic
>o confirm the connection:>h nun Firefox mit Ihrem Mobilgerät verbinden möchte.
n164      <img alt="" src="https://mdn.mozillademos.org/files/5815/ren164      <img alt="" src="https://mdn.mozillademos.org/files/5815/re
>mote-debugging-device-connect.png" style="display: block; margin->mote-debugging-device-connect.png" style="display: block; margin-
>left: auto; margin-right: auto;">Press "OK". The desktop waits fo>left: auto; margin-right: auto;">Drücken Sie auf "OK". Firefox au
>r a few seconds to give you time to acknowledge this dialog: if i>f Ihrem Computer wartet einige Sekunden, damit Sie genug Zeit hab
>t times out, just press "Connect" in the desktop dialog again.>en, auf dem Mobilgerät die Meldung zu quittieren. Wenn die Zeit n
 >icht ausreicht, können Sie nochmals auf "Verbinden" klicken.
n166    <h4 class="note" id="On_the_desktop">n166    <h4 class="note" id="On_the_desktop_4">
167      On the desktop167      Auf dem Computer
n170      Next, the desktop shows you a dialog that looks something ln170      Als nächsten sehen Sie auf Ihrem Computer folgende Anzeige:
>ike this: 
n173      <img alt="" src="https://mdn.mozillademos.org/files/5819/ren173      <img alt="" src="https://mdn.mozillademos.org/files/5819/re
>mote-debugging-desktop-select-target.png" style="display: block; >mote-debugging-desktop-select-target.png" style="display: block; 
>margin-left: auto; margin-right: auto;">This is asking whether yo>margin-left: auto; margin-right: auto;">Nun werden Sie gefragt, o
>u want to debug web content running in a browser tab, or to debug>b Sie den Code in einem Browser Tab oder den Browser selbst debug
> the browser code itself.>gen möchten.
n176      <li>You'll see one entry under "Available remote tabs" for n176      <li>Sie sehen jeweils pro geöffnetem Tab einen Eintrag unte
>each open tab, and clicking it will attach the debugging tools to>r "Verfügbare externe <span class="highlight">Tabs</span>". Sobal
> the web content hosted by that tab. If you want to debug your we>d Sie auf den gewünschten Tab klicken, wird der Debugger an den I
>b content, you'll choose the relevant content tab.>nhalt dieses Tabs angehängt. Wählen Sie diese Option, wenn Sie de
 >n Inhalt eines Tabs debuggen möchten.
n178      <li>You'll see one entry under "Available remote processes"n178      <li>Sie sehen einen Eintrag unter "Verfügbare externe Proze
>: this is the browser process itself. You'll choose this option i>sse": das ist der Browser selbst. Wählen Sie diese Option, wenn S
>f you want to debug the browser's own code.>ie den Browser selbst debuggen möchten.
n182      Let's choose to attach to the mozilla.org website. The Tooln182      Wir entscheiden uns für das Anfügen des Debuggers an die mo
>box will open in its own window, attached to the Firefox for Andr>zilla.org Webseite. Die Entwicklerwerkzeuge werden in einem eigen
>oid tab that's currently hosting mozilla.org:>en Fenster geöffnet und werden an die Webseite innerhalb von Fire
 >fox for Android angehängt:
t185      <img alt="" src="https://mdn.mozillademos.org/files/5821/ret185      <img alt="" src="https://mdn.mozillademos.org/files/5821/re
>mote-debugging-console.png" style="display: block; margin-left: a>mote-debugging-console.png" style="display: block; margin-left: a
>uto; margin-right: auto;">>uto; margin-right: auto;">Die Entwicklerwerkzeuge unterscheiden n
 >icht zwischen lokalem Inhalt und Inhalt auf anderen Geräten. Sie 
 >funktionieren in beiden Fällen identisch.<img alt="" src="https:/
 >/mdn.mozillademos.org/files/5823/remote-debugging-debugger.png" s
 >tyle="display: block; margin-left: auto; margin-right: auto;">
186    </p>
187    <p>
188      The Toolbox, and the tools it hosts, work in just the same 
>way as they do when attached to local content.<img alt="" src="ht 
>tps://mdn.mozillademos.org/files/5823/remote-debugging-debugger.p 
>ng" style="display: block; margin-left: auto; margin-right: auto; 
>"> 

Zurück zur Versionsgeschichte