diff options
Diffstat (limited to 'files/es/tools/browser_toolbox/index.html')
-rw-r--r-- | files/es/tools/browser_toolbox/index.html | 64 |
1 files changed, 64 insertions, 0 deletions
diff --git a/files/es/tools/browser_toolbox/index.html b/files/es/tools/browser_toolbox/index.html new file mode 100644 index 0000000000..d702370f0d --- /dev/null +++ b/files/es/tools/browser_toolbox/index.html @@ -0,0 +1,64 @@ +--- +title: Caja de Herramienta del Navegador +slug: Tools/Browser_Toolbox +tags: + - Depurador + - Firefox + - JavaScript +translation_of: Tools/Browser_Toolbox +--- +<p>La<em> Caja de Herramientas del Navegador</em> habilita la depuración de extensiones (add-ons) y del código JavaScript propio del navegador mas que simplemente páginas web como la <em><a href="https://developer.mozilla.org/en-US/docs/Tools_Toolbox">Caja de Herramienta</a></em> normal. El contexto de la <em>Caja de Herramientas del Navegador</em> es el navegador completo en lugar de simplemente una única página en una única pestaña.</p> + +<div class="note"> +<p>Nota: Si usted quiere depurar una extensión especifica que no es reiniciable o basado en SDK entonces pruebe el <em><a href="/en-US/Add-ons/Add-on_Debugger">"Depurador de Extensiones</a></em>". Para extensiones que no son ninguna de las dos, use la Caja de Herramientas del Navegador.</p> +</div> + +<p id="Enabling_the_Browser_Toolbox" style="line-height: 30px; font-size: 2.14286rem;">Habilitando la Caja de Herramientas del Navegador</p> + +<div> +<p>La <em>Caja de Herramientas del Navegador</em> no esta habilitada por defecto. Para habilitarla necesita marcar las casillas de configuración "Habilitar depuración chrome y de extensiones" y "habilitar depuración remota".</p> + +<p>Para hacer esto, abra la <a href="https://developer.mozilla.org/en-US/docs/Tools/Tools_Toolbox">Configuración de Caja de Herramientas</a> en <em>Herramientas del Desarrollador</em>, vaya a la sección "<a href="https://developer.mozilla.org/en-US/docs/Tools/Tools_Toolbox#Advanced_settings">Configuración Avanzada</a>", y marque en las opciones "Habilitar navegador chrome y caja de herramientas de depuración de extensiones" y "Habilitar depuración remota".</p> + +<p><img alt="Developer Tools Settings" src="https://mdn.mozillademos.org/files/11125/enable-browser-toolbox.png" style="display: block; height: 923px; margin-left: auto; margin-right: auto; width: 900px;"></p> +</div> + +<h2 id="Abriendo_la_Caja_de_Herramienta_del_Navegador"><span style="font-size: 2.14285714285714rem;">Abriendo la Caja de Herramienta del Navegador</span></h2> + +<p><span style="line-height: 1.5;">Abra la caja de Herramientas del navegador a través del botón menú</span><span style="line-height: 1.5;"> </span><img alt="new fx menu" class="frameless wiki-image" src="https://support.cdn.mozilla.net/media/uploads/gallery/images/2014-01-10-13-08-08-f52b8c.png" style="line-height: 1.5;" title=""><span style="line-height: 1.5;"> y los ítems del menú "Desarrollador" y "Caja de Herramientas del Navegador".</span><span style="line-height: 1.5;"> </span></p> + +<p><span style="line-height: 1.5;">A partir de Firefox 39, puede abrirlo con la combinación de teclas </span><kbd>Ctrl</kbd> + <kbd>Alt</kbd> +<kbd>Shift</kbd> + <kbd>I</kbd> . ( <kbd>Cmd</kbd> + <kbd>Opt</kbd> +<kbd>Shift</kbd> + <kbd>I</kbd> en una Mac).</p> + +<p><span style="line-height: 1.5;">Se le presentará una caja de dialogo como esta (la cual puede ser removida configurando la propiedad </span><code style="font-style: normal; line-height: 1.5;">"devtools.debugger.prompt-connection</code><span style="line-height: 1.5;">" a falso):</span></p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/11119/browser-toolbox-warning.png" style="display: block; height: 326px; margin-left: auto; margin-right: auto; width: 600px;">Clíque OK, y la <em>Caja de Herramientas del Navegador</em> abrirá en su propia ventana:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/11121/browser-toolbox.png" style="display: block; height: 649px; margin-left: auto; margin-right: auto; width: 900px;">Estará habilitado para inspeccionar la ventana XUL del navegador y ver y depurar, todos los archivos JavaScript cargados por el propio navegador y por las extensiones que están corriendo. En conjunto tendrá acceso a las siguientes herramientas del desarrollador:</p> + +<ul> + <li><a href="/en-US/docs/Tools/Debugger">Depurador</a> (<em>Nota: Si quiere depurar una extensión específica que no es reiniciable o basada en SDK entonces pruebe <a href="/en-US/Add-ons/Add-on_Debugger">Depurador de Extensiones</a>.)</em></li> + <li><a href="/en-US/docs/Tools/Browser_Console">Consola</a></li> + <li><a href="/en-US/docs/Tools/Style_Editor">Editor de Estilo</a></li> + <li><a href="/en-US/docs/Tools/Profiler">Rendimiento</a></li> + <li><a href="/en-US/docs/Tools/Network_Monitor">Monitor de Red</a></li> + <li><a href="/en-US/docs/Tools/Scratchpad">Borrador</a></li> + <li><a href="/en-US/docs/Tools/Page_Inspector">Inspector de Página</a></li> +</ul> + +<h2 id="Depurando_chrome_y_a_cerca_de_páginas">Depurando chrome: y a cerca de: páginas</h2> + +<p>A partir de Firefox 37 en adelante, usted puede depurar chrome: y a cerca de: páginas usando el <a href="/en-US/docs/Tools/Debugger">Depurador </a>normal, justo como si fueran páginas con contenido ordinario.</p> + +<h2 id="Seleccionando_un_documento">Seleccionando un documento</h2> + +<p>En la Caja de Herramienta normal, hay un <a href="/en-US/docs/Tools/Working_with_iframes">botón en la barra de herramienta habilitándolo a usted para seleccionar "iframes" específicos en el documento</a>. A partir de Firefox 40 en adelante el mismo botón aparece en la caja de herramientas del navegador también, pero éste lista todas las ventanas de contenido y de nivel mas alto de chrome como así también cualquier "iframes" que contengan. Esto lo habilita a usted a inspeccionar documentos en ventanas individuales de chrome y ventanas emergentes, como así también en pestañas de contenido.</p> + +<p>Por ejemplo, aquí se tiene lo que la ventana emergente de selección de marco lista cuando hay dos ventanas de navegador abiertas, una con una pestaña de contenido, y otra con dos:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/11117/browser-toolbox-iframes.png" style="display: block; height: 652px; margin-left: auto; margin-right: auto; width: 900px;"></p> + +<p> </p> + +<p> </p> + +<p> </p> |