diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:41:45 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:41:45 -0500 |
commit | 1109132f09d75da9a28b649c7677bb6ce07c40c0 (patch) | |
tree | 0dd8b084480983cf9f9680e8aedb92782a921b13 /files/es/tools/about_colon_debugging | |
parent | 4b1a9203c547c019fc5398082ae19a3f3d4c3efe (diff) | |
download | translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.gz translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.bz2 translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.zip |
initial commit
Diffstat (limited to 'files/es/tools/about_colon_debugging')
-rw-r--r-- | files/es/tools/about_colon_debugging/index.html | 255 |
1 files changed, 255 insertions, 0 deletions
diff --git a/files/es/tools/about_colon_debugging/index.html b/files/es/tools/about_colon_debugging/index.html new file mode 100644 index 0000000000..d79402d197 --- /dev/null +++ b/files/es/tools/about_colon_debugging/index.html @@ -0,0 +1,255 @@ +--- +title: 'acerca:depurado' +slug: 'Tools/about:debugging' +tags: + - Debugger + - Depurado + - Depurado remoto + - Remote debugging + - 'about:debugging' +translation_of: 'Tools/about:debugging' +--- +<p>{{ToolsSidebar}}</p> + +<p>La página about:debugging proporciona un lugar desde el que puede adjuntar las herramientas de desarrollador de Firefox a varios objetivos de depuración. Por el momento, admite tres tipos principales de objetivos: complementos que no requieren reinicio (<em>restartless add-ons</em>), pestañas y trabajadores.</p> + +<h2 id="Abrir_la_página_aboutdebugging">Abrir la página about:debugging</h2> + +<p>Hay dos formas de abrir el <code>about:debugging</code>:</p> + +<ul> + <li>Escriba about:debugging en la barra de URL de Firefox.</li> + <li>En el menú Herramientas> Desarrollador web, haga clic en Depuración remota.</li> +</ul> + +<p>Cuando about:debugging se abre, en el lado izquierdo verá una barra lateral con dos opciones e información sobre su configuración de depuración remota:</p> + +<dl> + <dt>Configuración</dt> + <dd> + <p>Use la pestaña Configuración para configurar la conexión a su dispositivo remoto.</p> + </dd> +</dl> + +<dl> + <dt>Este Firefox</dt> + <dd>Proporciona información sobre las extensiones temporales que ha cargado para la depuración, las extensiones que están instaladas en Firefox, las pestañas que tiene abiertas actualmente y los trabajadores de servicios que se ejecutan en Firefox.</dd> +</dl> + +<p><img alt="" src="https://mdn.mozillademos.org/files/16650/about_debugging_setup.png" style="border: 1px solid black; display: block; height: 751px; margin: 0px auto; width: 918px;"></p> + +<p>Si su página <code>about:debugging</code> es diferente de la que se muestra aquí, vaya a <code>about:config</code>, busque y establezca la opción <code>devtools.aboutdebugging.new-enabled</code> en true.</p> + +<h2 id="Pestaña_Configuración">Pestaña Configuración</h2> + +<h3 id="Conectarse_a_un_dispositivo_remoto">Conectarse a un dispositivo remoto</h3> + +<p>Firefox admite la depuración a través de USB con dispositivos Android, utilizando la página about:debugging.</p> + +<p>Antes de conectarte:</p> + +<ol> + <li>Habilite la configuración de desarrollador en su dispositivo Android.</li> + <li>Habilite la depuración de USB en la configuración del desarrollador de Android.</li> + <li>Habilite la depuración remota a través de USB en la Configuración avanzada en Firefox en el dispositivo Android.</li> + <li>Conecte el dispositivo Android a su computadora con un cable USB.</li> +</ol> + +<p>Si su dispositivo no aparece en el lado izquierdo de la página <code>about:debugging</code>, intente hacer clic en el botón <strong>Actualizar dispositivos</strong>.</p> + +<p><strong>Si aún no aparece,</strong> puede deberse a que el enlace entre su dispositivo Android y su computadora aún no está autorizado. Primero asegúrese de haber instalado <a href="https://developer.android.com/studio/command-line/adb">Android Debug Bridge</a> de Android Tools en su computadora para que pueda conectarse a su dispositivo. A continuación, deshabilite todas las configuraciones de depuración ya activadas y repita los pasos descritos anteriormente. Su dispositivo debe mostrar una ventana emergente para autorizar a su computadora a conectarse a él; acepte esto y luego haga clic en el botón Actualizar dispositivos nuevamente. El dispositivo debería aparecer.</p> + +<div class="blockIndicator note"> +<p><strong>Nota: </strong>No necesita instalar el SDK completo de Android Studio. Solo se necesita adb.</p> +</div> + +<p>Para comenzar una sesión de depuración, primero abra la página que desea depurar y luego haga clic en Conectar al lado del nombre del dispositivo para abrir una conexión. Si la conexión fue exitosa, ahora puede hacer clic en el nombre del dispositivo para cambiar a una pestaña con información sobre el dispositivo.</p> + +<p><img alt="Screenshot of the debugging page for an Android device" src="https://mdn.mozillademos.org/files/16915/device_information.png" style="border: 1px solid black; display: block; margin: 0 auto;"></p> + +<p>La información en esta página es la misma que la información en la pestaña <strong>Este Firefox</strong>, pero en lugar de mostrar información para su computadora, muestra la información para el dispositivo remoto con la adición de una sección de <strong>Pestañas</strong> con una entrada para cada una de las pestañas abiertas en el dispositivo remoto.</p> + +<p>Nota: Si la versión de Firefox en su dispositivo es una versión anterior (o más) a la versión de su computadora, es posible que vea un mensaje como el siguiente:</p> + +<p><img alt="The connected browser has an old version (68.2.0). The minimum supported version (69.0a1). This is an unsupported setup and may cause DevTools to fail. Please update the connected browser." src="https://mdn.mozillademos.org/files/16917/version_warning.png" style="display: block; margin: 0 auto;"></p> + +<p>En Firefox 76 y superior, el mensaje puede tener el siguiente aspecto:<img alt="This version of Firefox cannot debug Firefox for Android (68). We recommend installing Firefox for Android Nightly on your phone for testing. More details" src="https://mdn.mozillademos.org/files/17171/fxand-68-error.png" style="height: 64px; width: 675px;"></p> + +<p>En la imagen de abajo, hay tres pestañas abiertas: <strong>Network or cache Recipe</strong>, <strong>Nightly Home</strong>, y <strong>About Nightly</strong>. Para depurar el contenido de una de estas pestañas, haga clic en el botón Inspeccionar junto a su título. Cuando lo haga, las Herramientas para desarrolladores se abrirán en una nueva pestaña.</p> + +<p><img alt="Screenshot showing the remote debugging window, with the editable URL bar" src="https://mdn.mozillademos.org/files/17317/remote-debugger-w-URL-buttons.png" style="border: 1px solid black; display: block; height: 471px; margin: 0px auto; width: 1014px;"></p> + +<p>Ademas de la lista habitual de herramientas, tambien puede ver información sobre el dispositivo al que está conectado, incluido que está conectado (en este ejemplo) a través de USB, a Firefox Preview, en un Pixel 2, así como el título del página que está depurando y la dirección de la página.</p> + +<p>A partir de Firefox 78, la barra de URL es editable, por lo que puede cambiar la URL utilizada por el navegador en el dispositivo remoto. También puede volver a cargar la página haciendo clic en el botón Reload junto a la barra de URL (a partir de 79), navegar hacia atrás o hacia adelante en el historial de navegación con los botones Atrás y Adelante.</p> + +<h3 id="Conectando_a_través_de_la_red">Conectando a través de la red</h3> + +<p>Puede conectarse a un servidor de depuración de Firefox en su red o en su máquina de depuración utilizando la configuración de Ubicación de red de la página about:debugging.<img alt="" src="https://mdn.mozillademos.org/files/16942/network_location.png" style="display: block; margin: 0px auto;"></p> + +<p>Ingrese la ubicación y el puerto en el que se ejecuta el servidor del depurador. Cuando lo haga, se agregará a la lista de ubicaciones de red junto con los dispositivos, como se muestra a continuación:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/16943/connect_network_location.png" style="display: block; margin: 0 auto;"></p> + +<h2 id="Este_Firefox">Este Firefox</h2> + +<p>La pestaña <strong>Este Firefox</strong> combina las características de Extensiones, Pestañas y Trabajadores en una sola pestaña con las siguientes secciones:</p> + +<dl> + <dt>Extensiones Temporales</dt> + <dd>Muestra una lista de las extensiones que ha cargado utilizando el botón Cargar complemento temporal.</dd> + <dt>Extensiones</dt> + <dd>Esta sección enumera información sobre las extensiones que ha instalado en su sistema.</dd> + <dt>Trabajadores de servicios, trabajadores compartidos y otros trabajadores</dt> + <dd>Hay tres secciones en esta página que tratan sobre los trabajadores de servicios, trabajadores compartidos y otros trabajadores.</dd> +</dl> + +<p><img alt="" src="https://mdn.mozillademos.org/files/16654/about_debugging_this_firefox.png" style="border: 1px solid black; display: block; height: 867px; margin: 0px auto; width: 1138px;"></p> + +<p>Si las extensiones internas aparecen en la lista de esta página depende de la configuración de la preferencia devtools.aboutdebugging.showHiddenAddons. Si necesita ver estas extensiones, navegue hasta about:config y asegúrese de que la preferencia esté establecida en true.</p> + +<h2 id="Extensiones">Extensiones</h2> + +<h3 id="Cargando_una_extensión_temporal">Cargando una extensión temporal</h3> + +<p>Con el botón <strong>Cargar complemento temporalmente</strong> puede cargar temporalmente una extensión web desde un directorio en el disco. Haga clic en el botón, navegue hasta el directorio que contiene el complemento y seleccione su archivo de manifiesto. La extensión temporal se muestra debajo del encabezado <strong>Extensiones temporales</strong>.</p> + +<p>No tiene que empaquetar o firmar la extensión antes de cargarlas. La extensión permanecerá instalada hasta que reinicie Firefox.</p> + +<p>Las principales ventajas de este método, en comparación con la instalación de un complemento desde un XPI, son:</p> + +<ul> + <li>No tiene que reconstruir un XPI y reinstalarlo cuando cambia el código del complemento;</li> + <li>Puede cargar un complemento sin firmarlo y sin necesidad de deshabilitar signing.</li> +</ul> + +<p>Una vez que haya cargado una extensión temporal, puede ver información sobre ella y realizar operaciones.</p> + +<p><img alt="Screenshot of the debugging information panel for a temporary extension" src="https://mdn.mozillademos.org/files/16652/temporary_extension.png" style="display: block; height: 322px; margin: 0 auto; width: 680px;"></p> + +<p>Puede usar los siguientes botones:</p> + +<dl> + <dt>Inspeccionar</dt> + <dd>Carga la extensión en el depurador.</dd> + <dt>Reload</dt> + <dd>Vuelve a cargar la extensión temporal. Esto es útil cuando ha realizado cambios en la extensión.</dd> + <dt>Eliminar</dt> + <dd>Retira la extensión temporal.</dd> +</dl> + +<p>Se muestra otra información sobre la extensión:</p> + +<dl> + <dt>Ubicación</dt> + <dd>La ubicación del código fuente de la extensión en su sistema local.</dd> + <dt>ID de extensión</dt> + <dd>La ID temporal asignada a la extensión.</dd> + <dt>UUID interno</dt> + <dd>El UUID interno asignado a la extensión.</dd> + <dt>Manifiesto de la URL</dt> + <dd>Si hace clic en el enlace, el manifiesto de esta extensión se carga en una nueva pestaña.</dd> +</dl> + +<h3 id="Actualización_de_una_extensión_temporal">Actualización de una extensión temporal</h3> + +<p>Si instala una extensión de esta manera, ¿qué sucede cuando actualiza la extensión?</p> + +<ul> + <li>Si cambia los archivos que se cargan a pedido, como las <a href="https://wiki.developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_scripts">secuencias de comandos</a> de contenido o <a href="https://wiki.developer.mozilla.org/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Browser_actions_2">ventanas emergentes</a>, los cambios que realice se recogen automáticamente y los verá la próxima vez que se cargue la secuencia de comandos de contenido o se muestre la ventana emergente.</li> + <li>Para otros cambios, haga clic en el botón <strong>Recargar</strong>. Esto hace lo que dice: + <ul> + <li>Recarga las secuencias de comandos persistentes, como los <a href="https://wiki.developer.mozilla.org/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Background_scripts">background scripts</a></li> + <li>Analiza el archivo manifest.json nuevamente, por lo que los cambios a los permisos, <code><a href="https://wiki.developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/content_scripts">content_scripts</a></code>, <code><a href="https://wiki.developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> o cualquier otra llave surtirán efecto</li> + </ul> + </li> +</ul> + +<h3 id="Extensiones_instaladas">Extensiones instaladas</h3> + +<p>Las extensiones instaladas permanentemente se enumeran en la sección Extensiones. Para cada extensión Ud. verá algo como lo siguiente:</p> + +<p><img alt="Screenshot of the debugging information panel for an installed extension" src="https://mdn.mozillademos.org/files/16651/installed_extension.png" style="display: block; margin: 0 auto;"></p> + +<p>El botón <strong>Inspeccionar </strong>y los campos <strong>ID de extensión</strong> y <strong>UUID interno</strong> son los mismos que para las extensiones temporales.</p> + +<p>Al igual que sucede con las extensiones cargadas temporalmente, el enlace junto a la URL del manifiesto abre el manifiesto cargado en una nueva pestaña.</p> + +<div class="note"> +<p><strong>Nota: </strong>Se recomienda que use la caja de herramientas del navegador, no el depurador de complementos, para depurar extensiones web. Vea <a href="https://wiki.developer.mozilla.org/en-US/Add-ons/WebExtensions/Debugging">Depuración de WebExtensions</a> para todos los detalles.</p> +</div> + +<p>La sección Complementos en about:debugging enumera todas las extensiones web que están instaladas actualmente. Al lado de cada entrada hay un botón etiquetado <strong>Inspeccionar</strong>.</p> + +<div class="blockIndicator note"> +<p><strong>Nota:</strong> esta lista puede incluir complementos que vienen preinstalados con Firefox.</p> +</div> + +<p>Si hace clic en Inspeccionar, el depurador de complementos comenzará en una nueva pestaña.</p> + +<p>Consulte la página del <a href="https://wiki.developer.mozilla.org/en-US/docs/Mozilla/Add-ons/Add-on_Debugger">depurador de complementos</a> para ver todas las cosas que puede hacer con esta herramienta.</p> + +<h2 id="Workers">Workers</h2> + +<p>Esta sección muestra todos los Workers que tienes registrados en tu Firefox, clasificados de la siguiente manera:</p> + +<ul> + <li>Todos los <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API">Service workers</a> registrados</li> + <li>Todos los <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/SharedWorker">Shared workers</a> registrados</li> + <li>Otros workers, incluidos <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/ChromeWorker">Chrome Workers</a> y Dedicated Workers</li> +</ul> + +<p>Puede conectar las herramientas de desarrollador a cada trabajador y enviar notificaciones push a los trabajadores del servicio.</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/16657/about_debugging_workers.png" style="border: 1px solid black; display: block; height: 642px; margin-left: auto; margin-right: auto; width: 567px;"></p> + +<h3 id="Estado_trabajador_de_servicio">Estado trabajador de servicio</h3> + +<p>La lista de trabajadores de servicio muestra el estado del trabajador de servicio en su <a href="https://developers.google.com/web/fundamentals/instant-and-offline/service-worker/lifecycle">ciclo de vida</a>. Son posibles tres estados:</p> + +<ul> + <li>Registro: cubre todos los estados entre el registro inicial del trabajador del servicio y su control de las páginas. Es decir, subsume los estados de instalación, activación y espera.</li> + <li>En ejecución: el trabajador de servicio se está ejecutando actualmente. Está instalado y activado, y actualmente maneja eventos.</li> + <li>Detenido: el trabajador de servicio está instalado y activado, pero ha finalizado después de estar inactivo.</li> +</ul> + +<p><img alt="Screenshot of the debugging panel for a service worker that is in the Running state" src="https://mdn.mozillademos.org/files/16659/sample_service_worker.png" style="display: block; height: 237px; margin-left: auto; margin-right: auto; width: 556px;"></p> + +<p>Esta sección utiliza una demostración simple de ServiceWorker, alojada en <a href="https://serviceworke.rs/push-simple/">https://serviceworke.rs/push-simple/</a>.</p> + +<div class="note"> +<p><strong>Nota: </strong>Desde Firefox 79 en adelante, puede acceder a información similar sobre los Service Workers registrados en un dominio en particular yendo al <a href="/es/docs/">panel de Aplicación</a> de Firefox DevTools.</p> +</div> + +<h3 id="Dar_de_baja_a_los_trabajadores_del_servicio">Dar de baja a los trabajadores del servicio</h3> + +<p>Haga clic en el botón Cancelar registro para cancelar el registro del trabajador de servicio.</p> + +<h3 id="Envío_de_eventos_push_a_service_workers">Envío de eventos push a service workers</h3> + +<p>Para depurar notificaciones push, puede establecer un punto de interrupción en el detector de <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/PushEvent">eventos push</a>. Sin embargo, también puede depurar notificaciones push localmente, sin necesidad del servidor. Haga clic en el botón Push para enviar un evento push al trabajador del servicio.</p> + +<h3 id="Trabajadores_de_servicio_no_compatibles">Trabajadores de servicio no compatibles</h3> + +<div> +<p>Se muestra un mensaje de advertencia en la parte superior de la pestaña Este Firefox si los trabajadores del servicio son incompatibles con la configuración actual del navegador y, por lo tanto, no se pueden usar ni depurar.</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/16655/worker_warning.png" style="display: block; height: 44px; margin: 0px auto; width: 551px;"></p> +</div> + +<p>Los trabajadores de servicio pueden no estar disponibles si la preferencia <code>dom.serviceWorkers.enable</code> está configurada como false en <code>about:config</code>.</p> + +<h2 id="Conexión_a_Firefox_para_Android_68">Conexión a Firefox para Android 68</h2> + +<p>Las versiones de Firefox para Android que se basan en la versión 68 no se pueden depurar desde las versiones de escritorio de Firefox 69 o posteriores, debido a la diferencia en las versiones de lanzamiento. Hasta el momento en que Firefox para Android se actualice a una versión principal más reciente, en sincronización con Firefox de escritorio, debe usar una de las siguientes versiones de Firefox para Android:</p> + +<ul> + <li><span style=""><a href="https://play.google.com/store/apps/details?id=org.mozilla.fenix">Firefox preview</a>, si su escritorio Firefox es la versión principal o Developer Edition</span></li> + <li><a href="https://play.google.com/store/apps/details?id=org.mozilla.fenix">Firefox para Android Nightly</a></li> +</ul> + +<p><span style="">Si prefiere realizar la prueba con la versión principal de Firefox para Android (es decir, según la versión 68), puede hacerlo con la <a href="https://support.mozilla.org/en-US/kb/switch-to-firefox-extended-support-release-esr">versión de soporte extendido (ESR)</a> de Firefox para escritorio, que también se basa en la versión 68.</span></p> + +<p>Tenga en cuenta queen <code>about:debugging</code> la depuración no está habilitada de forma predeterminada en Firefox ESR. Para habilitarlo, abra el <a href="https://support.mozilla.org/en-US/kb/about-config-editor-firefox">Editor de configuración</a> (<code>about:config</code>) y establezca <code>devtools.aboutdebugging.new-enabled</code> en true.</p> + +<p>Si utilizó una versión superior de Firefox antes de instalar Firefox ESR, se le pedirá que cree un nuevo perfil de usuario para proteger sus datos de usuario. Para obtener más información, consulte <a href="https://support.mozilla.org/en-US/kb/dedicated-profiles-firefox-installation#w_what-happens-to-my-profile-if-i-downgrade-to-a-previous-version-of-firefox">¿Qué sucede con mi perfil si cambio a una versión anterior de Firefox?</a></p> |