From 1109132f09d75da9a28b649c7677bb6ce07c40c0 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:45 -0500 Subject: initial commit --- .../debugging_over_a_network/index.html | 10 ++ .../firefox_para_android/index.html | 132 ++++++++++++++++++ files/es/tools/remote_debugging/index.html | 147 +++++++++++++++++++++ 3 files changed, 289 insertions(+) create mode 100644 files/es/tools/remote_debugging/debugging_over_a_network/index.html create mode 100644 files/es/tools/remote_debugging/firefox_para_android/index.html create mode 100644 files/es/tools/remote_debugging/index.html (limited to 'files/es/tools/remote_debugging') diff --git a/files/es/tools/remote_debugging/debugging_over_a_network/index.html b/files/es/tools/remote_debugging/debugging_over_a_network/index.html new file mode 100644 index 0000000000..3eae277997 --- /dev/null +++ b/files/es/tools/remote_debugging/debugging_over_a_network/index.html @@ -0,0 +1,10 @@ +--- +title: Debugging over a network +slug: Tools/Remote_Debugging/Debugging_over_a_network +translation_of: 'Tools/about:debugging#Connecting_over_the_Network' +--- +
+

{{draft}}

+
+ +

Coming soon...

diff --git a/files/es/tools/remote_debugging/firefox_para_android/index.html b/files/es/tools/remote_debugging/firefox_para_android/index.html new file mode 100644 index 0000000000..497d026a34 --- /dev/null +++ b/files/es/tools/remote_debugging/firefox_para_android/index.html @@ -0,0 +1,132 @@ +--- +title: Depuración remota en Firefox para Android +slug: Tools/Remote_Debugging/Firefox_para_Android +translation_of: Tools/Remote_Debugging/Firefox_for_Android +--- +

Esta guía explica como usar la depuración remota para inspeccionar o depurar código funcionando en Firefox para Android conectado por USB.

+ +

+ +

Esta guía se divide en dos partes: la primera parte, "Requisitos previos" cubre la materia que solo hay que hacer una vez, mientras que la segunda parte, "Conectando", cubre la materia que hay que hacer cada vez que conectas el dispositivo. 

+ +

Requisitos previos

+ +

Primero, lo que necesitará:

+ + + +

Configuración ADB

+ +

A continuación, necesitarás que el ordenador de sobremesa y el dispositivo Android hablen entre si utilizando la herramienta de la línea de comandos del adb.

+ +

En el dispositivo Android

+ + + +

En el ordenador de sobremesa

+ + + +

Para comprobar que funciona, abre en tu ordenador de sobremesa la aplicación que te deja escribir comandos en línea del sistema operativo y teclea:

+ +
adb devices
+ +

Deberías ver una respuesta parecida a esta:

+ +
List of devices attached
+51800F220F01564 device
+
+ +

(La cadena de texto hexadecimal será diferente.)

+ +

Si obtienes ésto, entonces adb ha encontrado tu dispositivo y has configurado correctamente el ADB.

+ +

Habilitar la depuración remota

+ +

A continuación, tienes que activar la depuración remota en el ordenador de sobremesa y en el dispositivo Android.

+ +

Firefox versión 24 y anteriores para Android

+ +

Para habilitar la depuración remota en el dispositivo, tienes que ajustar la preferencia devtools.debugger.remote-enabled al valor true.

+ +

Introduce la dirección about:config en Firefox para Android, escribe "devtools" dentro del cuadro de búsqueda y pulsa la tecla Search. Verás todas las preferencias de DevTools. Busca la preferencia devtools.debugger.remote-enabled preference, y pulsa "Toggle".

+ +

+ +

Firefox versión 25 y posteriores para Android

+ +

En Firefox v.25 y posteriores para Android, hay un elemento de menú para habilitar la depuración remota. Abre el menú, selecciona "Settings", luego "Developer tools" (en algunos dispositivos Android puede que necesites seleccionar "More" para ver la opción "Settings"). Marca la casilla "Remote debugging":

+ +

+ +

El navegador mostrará una notificación para recordarte que debes configurar el redireccionamiento de puertos, lo cuál haremos más adelante.

+ +

En el ordenador de sobremesa

+ +

En el ordenador, la depuración remota se habilita  a través de un ajuste en la caja de herramientas. Abre la caja de herramientas, haz clic en el botón "Settings"  de la barra de herramientas, y marca "Enable remote debugging" en la pestaña de Settings:

+ +

+ +
Si estás utilizando una versión de Firefox anterior a la 27, tendrás que reiniciar el navegador para que se aplique la nueva configuración.
+ +

Verás una nueva opción en el menú "Web Developer" con la etiqueta  "Connect...":

+ +

+ +

Conectarse

+ +

Ahora puedes conectar la herramienta de depuración remota con el dispositivo. En primer lugar, conecta el dispositivo al ordenador con un cable USB, si no lo has hecho todavía.

+ +

En el ordenador de sobremesa

+ +

Ve al símbolo del sistema y teclea:

+ +
adb forward tcp:6000 tcp:6000
+ +

(Si has cambiado el valor que el dispositivo Android usa para el puerto de depuración, deberás modificarlo a este valor.)

+ +

Para Firefox OS, teclea:

+ +
adb forward tcp:6000 localfilesystem:/data/data/org.mozilla.firefox/firefox-debugger-socket
+ +

Tendrás que volver a ejecutar este comando cada vez que conectes físicamente el ordenador de sobremesa y el dispositivo con el cable USB.

+ +

A continuación, ve al menú Web Developer del Firefox, y selecciona  "Connect...". Verás una página parecida a ésta:

+ +

Si no has cambiado los números de puerto, elige 6000 y pulsa el botón 'Connect'.

+ +

En el dispositivo Android

+ +
+
A continuación verás un cuadro de diálogo en el dispositivo Android que pide que  confirmes la conexión:
+
+ +

Haz click en "OK". El ordenador de sobremesa espera unos segundos para darte tiempo para que confirmes en el cuadro de diálogo: si se agota el tiempo de espera, solo tienes que volver a hacer click en "Connect" en el cuadro de diálogo del ordenador de sobremesa.

+ +

En el ordenador de sobremesa

+ +

A continuación, el ordenador te muestra un cuadro de diálogo parecido a este:

+ +

Te pregunta si quieres depurar el contenido de la web que se ejecuta en alguna pestaña del navegador, o depurar el código del propio navegador.

+ + + +

Elegimos conectarnos al sitio web mozilla.org.  Se abrirá una ventana con la Caja de herramientas, vinculada a la pestaña del Firefox para Android que muestra el sito de mozilla.org:

+ +

+ +

La caja de herramientas y las herramientas que contiene, funcionan de la misma manera que lo hacen cuando están conectadas a un contenido local.

diff --git a/files/es/tools/remote_debugging/index.html b/files/es/tools/remote_debugging/index.html new file mode 100644 index 0000000000..4164a78241 --- /dev/null +++ b/files/es/tools/remote_debugging/index.html @@ -0,0 +1,147 @@ +--- +title: Depurado Remoto +slug: Tools/Remote_Debugging +translation_of: Tools/Remote_Debugging +--- +

You can use the Firefox developer tools on your desktop to debug code running remotely: in a different process on the same device or on a completely different device. To do this you use Firefox to attach the Toolbox to the remote process, and the Toolbox is then launched in its own window. At the moment the following tools support remote debugging:

+ + + +

This guide explains how to get set up to debug code running in Firefox for Android over USB. The other main application for remote debugging is to debug code running in the Firefox OS Simulator, but that's covered separately, in the Firefox OS Simulator documentation.

+ +

+ +

This guide's split into two parts: the first part, "Prerequisites" covers stuff you only need to do once, while the second part, "Connecting", covers stuff you need to do each time you connect the device. 

+ +

Prerequisites

+ +

First, you'll need:

+ + + +

ADB setup

+ +

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

+ +

On the Android device

+ + + +

On the desktop

+ + + +

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 attached
+51800F220F01564 device
+
+ +

(The long hex string will be different.)

+ +

If you do, then adb has 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 24 and earlier

+ +

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

+ +

Go to about:config in 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 25 and later

+ +

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

+ +

+ +

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

+ +

On the desktop

+ +

On the desktop, remote debugging is 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:

+ +

Restart the browser, and you'll 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 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 you to confirm the connection:

+ +

Press "OK". The desktop waits for a few seconds to 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 that 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.

+ + + +

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

+ +

+ +

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

+
+ +

 

+ +

 

-- cgit v1.2.3-54-g00ecf