Abra automáticamente las herramientas de desarrollador de Chrome cuando se abre una nueva pestaña / nueva ventana


251

Tengo una aplicación HTML5 que se abre en una nueva ventana haciendo clic en un enlace. Estoy un poco cansado de presionar Shift + I cada vez que quiero iniciar sesión en la comunicación de red para iniciar las herramientas de desarrollador porque siempre lo necesito. No pude encontrar una opción para mantener las Herramientas para desarrolladores siempre habilitadas en el inicio.

¿Hay alguna forma de abrir las herramientas de desarrollador automáticamente cuando se abre una nueva ventana en Chrome?


Me encantaría saber esto también. La única forma que he encontrado es editar la fuente como lo hizo este tipo: [link] groups.google.com/forum/?fromgroups=#!topic/…
zone117x

He fregado bastante, y lo más parecido que puedo encontrar es crear un nuevo Panel dentro de las herramientas de desarrollo, con una Extensión de Chrome.
TankorSmash

2
Con SendKeys con Python, puede iniciar Chrome y enviar +^jpara simular Ctrl Shift J, pero eso solo funcionaría con una nueva instancia; tendrías que ser un poco más creativo con el selenio o algo para navegar a una página determinada ...
TankorSmash

Sí, también vi esta variante, pero no es aplicable cuándo abrir las herramientas de desarrollo para cada nueva pestaña abierta.
Alexander Sirobaba

Aquí hay un tipo que modificó el código fuente para agregar esta capacidad. Parece que está desactualizado ahora, pero al menos sabemos que su solicitud es posible .
Patrick M

Respuestas:


89

ACTUALIZACIÓN 2:

Mira esta respuesta . - 2019-11-05

Ahora también puede abrir automáticamente las Herramientas para desarrolladores en ventanas emergentes si estaban abiertas desde donde las abrió. Por ejemplo, si no tiene Dev Tools abiertas y aparece una ventana emergente, no se abrirá con Dev Tools. Pero si tiene Dev Tools Open y luego hace clic en algo, la ventana emergente tendrá Dev-Tools automáticamente abierta.

ACTUALIZAR:

El tiempo ha cambiado, ahora puedes usar --auto-open-devtools-for-tabs como en esta respuesta - Wouter Huysentruit 18 de mayo a las 11:08

OP:

Jugué con la cadena de inicio para Chrome al ejecutar, pero no pude hacer que persistiera en nuevas pestañas.
También pensé en un método PATH definido que podría invocar desde prompt. Esto es posible con el comando SendKeys, pero nuevamente, solo en una nueva instancia. Y DevTools no persiste con nuevas pestañas.

Navegando por los foros de productos de Google, no parece haber una forma integrada de hacerlo en Chrome. Tendrá que usar una solución de pulsación de teclas o F12como se mencionó anteriormente.

Lo recomendé como una característica. Sé que tampoco soy el primero.


1
@ Seanny123: ¡arreglado! Si desea esto como una característica, no dude en destacar este error de Chromium: code.google.com/p/chromium/issues/detail?id=410958
phsource

1
@Chiperific, dijiste que estabas jugando alrededor de la cadena de inicio para Chrome al ejecutar, pero no pudiste hacer que persistiera en nuevas pestañas. Sin embargo, necesito este comportamiento en el inicio solo para una pestaña. ¿Puedes compartir la forma en que lo hiciste solo para una pestaña?
Martin Braun

10
El tiempo ha cambiado, ahora se puede utilizar --auto-open-devtools-for-tabscomo en esta respuesta
huysentruitw

2
Por favor considere editar su respuesta. Es obsoleto pero aún muy visible en SO.
yannick1976

44
El comando completo para OS X es (cierre primero cualquier proceso de Chrome en ejecución):/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
Lane Rettig

189

Al abrir las herramientas de desarrollador, con la ventana de herramientas de desarrollador en foco, presione F1. Esto abrirá una página de configuración. Verifique "Abrir automáticamente DevTools para ventanas emergentes".

Esto funcionó para mí.

Captura de pantalla


13
Esto funciona y es exactamente lo que pedía el OP, debe marcarse como la respuesta correcta
Rui

1
Tampoco me funciona con WebStorm. La página se abre pero no hay herramientas de desarrollo.
Mörre

3
Esto funciona, pero la opción "Conservar registros" siempre está desmarcada, y si la ventana emergente redirige no muestra solicitudes de red anteriores. ¿Alguna idea de cómo hacer que conserve los registros de forma predeterminada?
timetofly

1
Esto solo funciona para un subconjunto específico de casos, consulte bugs.chromium.org/p/chromium/issues/detail?id=410958#c87 . No es una solución general.
Lane Rettig

1
No funciona al comenzar desde VS Code con la extensión de depuración de Chome.
VanAlbert

80

Hay un interruptor de línea de comando para esto: --auto-open-devtools-for-tabs

Entonces, para las propiedades en Google Chrome, use algo como esto:

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --auto-open-devtools-for-tabs

Aquí hay un enlace útil: chromium-command-line-switches


1
Esto definitivamente funciona y probablemente debería marcarse como respuesta aceptada ahora. Comprobé cromo Version 50.0.2661.102 Ubuntu 15.10 (64-bit)y lo abrí asíchromium-browser --auto-open-devtools-for-tabs
Olga

66
Esto no funciona en Windows 7 Versión 51.0.2704.103 m
PetroCliff

77
El comando completo para OS X es (cierre primero cualquier proceso de Chrome en ejecución):/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
Lane Rettig el

2
No funcionó en la versión 59.0.3071.115 (versión oficial) (64 bits)
Gustavo Straube

Funciona en mi caso de uso a diferencia de la respuesta de Saint.
Markus Barthlen

28

En una Mac: Salga de Chrome, luego ejecute el siguiente comando en una ventana de terminal:

open -a "Google Chrome" --args --auto-open-devtools-for-tabs

Para aclarar: esto abre Chrome con la auto-open-devtools-for-tabsbandera establecida. Salir de Chrome y volver a abrirlo usando el acceso directo de la aplicación normal abrirá Chrome sin el indicador establecido. Si desea un acceso directo para abrir Chrome con este conjunto de indicadores sin tener que abrir una ventana de terminal, puede crear un flujo de trabajo en Automator, agregar un elemento "Ejecutar script de Shell" y pegar el script anterior. Guardar el flujo de trabajo como una aplicación creará una aplicación en la que se puede hacer clic. Vea esta respuesta en otro hilo: stackoverflow.com/a/281455/1512790
Rick Gladwin el

17

En la configuración de Chrome DevTools, habilita:

En Red -> Conservar registro en DevTools -> Abrir automáticamente DevTools para ventanas emergentes


La mejor respuesta OMI
Chase Miller

2
buena respuesta pero explicada para Linux: vaya a la consola del desarrollador. Ve al menú de hamburguesas. haga clic en configuración (o f1). en la sección de red verifique preservar registro en la sección devtools, compruebe que las ventanas emergentes se abran automáticamente para ventanas emergentes
JDPeckham el

9

F12 es más fácil que Ctrl + Shift + I


2
Si está en Windows o Linux
Gianfranco P.

1
para presionar f12 en un macbook, o profesional, debe hacer fn + f12 (extremo inferior izquierdo + extremo superior derecho), lo que no es cómodo para la mayoría de los usuarios de teclados
Seth McClaine

Funciona muy bien en Linux ... Otra razón para cambiar. Lo hice en un Mac Pro, no es perfecto, pero sigue siendo mucho mejor que el sistema operativo de Apple
Ray Foss

5

Con la ventana Herramientas para desarrolladores visible, haga clic en el icono del menú (los tres puntos verticales en la esquina superior derecha) y haga clic en Configuración .

Ajuste

En Herramientas de desarrollo , marque la opción Abrir automáticamente DevTools para ventanas emergentes

detalles de configuración


4

Vine aquí buscando una solución similar. Realmente quería ver la salida de Chrome para la carga de página desde una nueva pestaña. (un envío de formulario en mi caso) La solución que realmente utilicé fue modificar el atributo de destino del formulario para que el envío del formulario se produzca en la pestaña actual. Pude capturar la solicitud de red. ¡Problema resuelto!


4

Cualquiera que quiera hacer esto dentro de Visual Studio, este artículo del Proyecto de Código ayudará. Simplemente agregue "--auto-open-devtools-for-tabs" en el cuadro de argumentos. Funciona en 2017.


En caso de que la página de Code Project desaparezca: vaya al menú desplegable Ejecutar, seleccione Examinar con ..., Agregar ..., El programa es algo así como: C: \ Archivos de programa (x86) \ Google \ Chrome \ Application \ chrome .exe y argumentos: --auto-open-devtools-for-tabs -incognito (el incógnito es opcional)
Dustin_00

3

Si usa Visual Studio Code (vscode), usando la muy popular extensión vscode chrome debug ( https://github.com/Microsoft/vscode-chrome-debug ) puede configurar un archivo de configuración de inicio launch.jsony especificar abrir la herramienta de desarrollador durante Una sesión de depuración.

Esto launch.jsonlo uso para mis proyectos React:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome against localhost",
      "url": "http://localhost:3000",
      "runtimeArgs": ["--auto-open-devtools-for-tabs"],
      "webRoot": "${workspaceRoot}/src"
    }
  ]
}

La linea importante es "runtimeArgs": ["--auto-open-devtools-for-tabs"],

Desde vscode ahora puede escribir F5, Chrome abre su aplicación y la pestaña de la consola también.


1

Sí, hay una manera de hacerlo

  1. Haga clic derecho-> Inspeccionar-> fuentes (pestaña)

  2. Hacia su derecha habrá un "botón de ejecución de secuencia de comandos de pausa" El botón resaltado en la imagen dirigida por este enlace es el botón de ejecución del script que se puede pausar o reproducir según sea necesario.

¡Espero que ayude! Paz

  • PD: Esto es por primera vez. A partir de la segunda vez, la herramienta de desarrollo se carga automáticamente


-6

Puede abrir Dev Tools ( F12en Chrome) en una nueva ventana clicking three, vertical dotsen la esquina inferior derecha y elegir Open as Separate Window.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.