Firefox Debug Mobile browser

Https://developer.mozilla.org/en-US/docs/Tools/Remote_Debugging/Firefox_for_Android

In this article

1. Prerequisites
   1. ADB Setup
      1. On the Android device
      2. On the desktop
   2. Enable Remote Debugging
      1. Firefox for Android and earlier
      2. Firefox for Android and later
      3. On the desktop
2. Connecting
   1. 1. On the desktop
      2. On the Android device
      3. On the desktop

This guide explains how to use the remote debugging to inspect or debug code running Infirefox for Android over USB.

This guide's split into and Parts:the first part, "Prerequisites" covers stuff if you have need to do once and while the second Part, ' connecting ', covers stuff you need to do each time connect the device.

Prerequisites

First, you ' ll need:

• A desktop or laptop computer with Firefox running on it
• An Android device capable of running Firefox for Android with Firefox for Android running on it
• A USB cable to connect the devices

ADB Setup

Next, you'll need to get the desktop and the Android device talking to each of the other using the ADB command-line tool.

On the Android device

• Enable USB Debugging (step 2 of this link only).
• Attach the device to the desktop via USB.

On the desktop

• Install the correct version of the Android SDK for your device.
• Using the Android SDK, install the Android Platform Tools.
• Android Platform Tools installs adb in the ' platform-tools ' directory under the directory which you installed the Andro ID SDK. Make sure the ' platform-tools ' directory is in your path.

To check it worked, open up a command shell on the desktop and type:

ADB devices

You should see some output like:

List of Devices attached51800f220f01564 device

(The long hex string would be different.)

If you did, then have adb found your device and you ' ve successfully set up ADB.

Enable Remote Debugging

Next, you need to enable remote debugging on both the Android device and the desktop.

Firefox for Android and earlier

To enable remote debugging on the device and you need to set the devtools.debugger.remote-enabled preference to true .

Go about:config to on Firefox for Android, type ' devtools ' into the search box and press the search key. You'll see all the devtools preferences. Find the devtools.debugger.remote-enabled preference, and press "Toggle".

Firefox for Android and later

On the Firefox for Android and later, there's a menu item to enable remote debugging. Open the menu, select "Settings", then "Developer Tools" (on some Android devices your may need to select ' More ' to see the "Settings" option). Check the "Remote Debugging" box:

The browser would display a notification reminding you to set up port forwarding, which we'll do later on.

On the desktop

On the desktop, remote debugging are enabled by a setting in the Toolbox. Open the Toolbox, click the "Settings" button in the toolbar, and check "Enable remote Debugging" In the Settings tab:

If you ' re using a version of Firefox older than, you'll need to restart the browser for the setting to take effect.

You'll then see a new option in the Web Developer menu labeled "Connect ...":

Connecting

Now you can connect the remote debugging tools to the device. First, attach the device to the desktop with a USB cable, if you haven ' t already.

On the desktop

Go to a command prompt, and type:

ADB forward tcp:6000 tcp:6000

(If you ' ve changed the value of the Android device uses for a debugging port, you'll need to adjust this accordingly.)

For Firefox OS, type:

ADB forward tcp:6000 Localfilesystem:/data/local/debugger-socket

You'll need to reissue this command each time you physically attach desktop and device with the USB cable.

Then go to the Web Developer menu on Firefox, and select "Connect ...". You'll see a page that looks like this:

Unless you ' ve changed the port numbers, choose 6000 and press the "Connect" button.

On the Android device

Next you'll see a dialog on the Android device asking your to confirm the connection:

Press "OK". The desktop waits for a few seconds-give you time-to-acknowledge this dialog:if it times out, just press ' Connect ' in The desktop dialog again.

On the desktop

Next, the desktop shows you a dialog so looks something like this:

This is asking whether you want to debug Web content running in a browser tab, or to debug the browser code itself.

• You'll see one entry under "Available Remote tabs" For each open tab, and clicking it'll attach the debugging tools to t He web content hosted by that tab. If you want to debug your Web content, you ll choose the relevant Content tab.
• You'll see one entry under "Available Remote Processes": This is the browser process itself. You'll choose this option if your want to debug the browser ' s own code.

Let's choose to attach to the mozilla.org website. The Toolbox would open in it own window, attached to the Mozilla Firefox for Android tab that ' s currently hosting mozilla.org:

The Toolbox, and the tools it hosts, work in just the same-as they do when attached to local content.

Attachments by

File	Size	Date	attached
Remote-debugger-about-config-toggle	95831 bytes	2013-08-01 15:36:19	Wbamberg
Remote-debugging-connect-menuitem	81023 bytes	2013-08-01 17:15:16	Wbamberg
Remote-debugging-deskopt-connect	85186 bytes	2013-08-01 17:20:07	Wbamberg
Remote-debugging-device-connect	167472 bytes	2013-08-01 17:26:11	Wbamberg
Remote-debugging-deskopt-select-target	90358 bytes	2013-08-01 19:41:30	Wbamberg
Remote-debugging-console	124892 bytes	2013-08-01 20:35:29	Wbamberg
Remote-debugging-debugger	266637 bytes	2013-08-01 20:35:45	Wbamberg
Remote-debugger-toolbox-settings	123586 bytes	2013-08-01 23:09:18	Wbamberg
Remote-debugging-device-enable	45182 bytes	2013-08-02 09:37:26	Wbamberg
Remote-debugging-overview	394293 bytes	2013-08-02 12:25:02	Wbamberg