Abrir automaticamente as ferramentas de desenvolvedor do Chrome quando uma nova guia / nova janela for aberta

251

Eu tenho o aplicativo HTML5 que abre em uma nova janela clicando em um link. Estou um pouco cansado de pressionar Shift + I toda vez que quero registrar a comunicação em rede para iniciar as ferramentas do desenvolvedor, porque sempre preciso disso. Não consegui encontrar uma opção para manter as Ferramentas do desenvolvedor sempre ativadas na inicialização.

Existe alguma maneira de abrir as ferramentas do desenvolvedor automaticamente quando uma nova janela é aberta no Chrome?

Alexander Sirobaba
fonte
Eu adoraria saber disso também. A única maneira que encontrei é editar a fonte como esse cara fez: [link] groups.google.com/forum/?fromgroups=#!topic/…
zone117x
Eu vasculhei bastante, e a coisa mais próxima que posso encontrar é criar um novo painel dentro das ferramentas de desenvolvimento, com uma extensão do Chrome.
TankorSmash
2
Usando SendKeys com Python, você pode iniciar o Chrome e enviar +^jpara simular Ctrl Shift J, mas isso funcionaria apenas com uma nova instância; você teria que ficar um pouco mais criativo com selênio ou algo, a fim de navegar para uma determinada página ...
TankorSmash
Sim, eu também vi essa variante, mas ela não é aplicável quando você abre as ferramentas de desenvolvimento para cada nova guia aberta.
Alexander Sirobaba
Aqui está um cara que modificou o código fonte para adicionar esse recurso. Parece estar desatualizado agora, mas pelo menos sabemos que sua solicitação é possível .
Patrick M

Respostas:

89

ATUALIZAÇÃO 2:

Veja esta resposta . - 2019-11-05

Agora você também pode abrir automaticamente as Ferramentas do desenvolvedor nos pop-ups, caso estejam abertas de onde você as abriu. Por exemplo, se você não tiver o Dev Tools aberto e aparecer um pop-up, ele não será aberto com o Dev Tools. Mas se você tiver o Dev Tools Open e clicar em algo, o pop-up terá o Dev-Tools automaticamente aberto.

ATUALIZAR:

O tempo mudou, agora você pode usar --auto-open-devtools-for-tabs como nesta resposta - Wouter Huysentruit 18 de maio às 11:08

OP:

Eu brinquei com a string de inicialização do Chrome na execução, mas não consegui persistir em novas guias.
Também pensei em um método PATH definido que você poderia invocar a partir do prompt. Isso é possível com o comando SendKeys, mas novamente, apenas em uma nova instância. E o DevTools não persiste em novas guias.

Navegando nos Fóruns dos Produtos do Google, não parece haver uma maneira integrada de fazer isso no Chrome. Você precisará usar uma solução de pressionamento de tecla ou F12conforme mencionado acima.

Eu o recomendei como um recurso. Eu sei que também não sou a primeira.

Chiperific
fonte
1
@ Seanny123: corrigido! Se você quiser isso como um recurso, sinta-se à vontade para marcar
phsource
1
@Chiperific, você disse que estava brincando com a sequência de inicialização do Chrome na execução, mas não conseguiu que ela persista em novas guias. Eu preciso desse comportamento na inicialização para apenas uma guia, no entanto. Você pode compartilhar a maneira como fez isso em apenas uma guia?
Martin Braun
10
O tempo mudou, agora você pode usá-lo --auto-open-devtools-for-tabscomo nesta resposta
huysentruitw 18/16
2
Por favor, considere editar sua resposta. É obsoleto, mas ainda muito visível no SO.
yannick1976
4
O comando completo do OS X é (saia primeiro de qualquer processo em execução no Chrome):/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
Lane Rettig
189

Ao abrir as ferramentas do desenvolvedor, com a janela das ferramentas do desenvolvedor em foco, pressione F1. Isso abrirá uma página de configurações. Marque a opção "Abrir automaticamente o DevTools para pop-ups".

Isso funcionou para mim.

Captura de tela

Santo
fonte
13
Isso funciona e é exatamente o que o OP estava pedindo, deve ser marcado como a resposta certa
Rui
1
Também não funciona para mim com o WebStorm. A página é aberta, mas não há ferramentas de desenvolvimento.
Morre
3
Isso funciona, mas a opção "Preservar logs" está sempre desmarcada e, se o pop-up redirecionar, não mostra solicitações de rede anteriores. Alguma idéia de como fazê-lo preservar os logs por padrão?
horário de 5/06
1
Isso funciona apenas para um subconjunto específico de casos, consulte bugs.chromium.org/p/chromium/issues/detail?id=410958#c87 . Não é uma solução geral.
Pista Rettig
1
Não funciona ao iniciar do VS Code com extensão de depuração do Chome.
VanAlbert
80

Há uma opção de linha de comando para isso: --auto-open-devtools-for-tabs

Portanto, para as propriedades no Google Chrome, use algo como isto:

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

Aqui está um link útil: chromium-command-line-switches

David
fonte
1
Definitivamente, isso funciona e provavelmente deve ser marcado como resposta aceita agora. Verifiquei o cromo Version 50.0.2661.102 Ubuntu 15.10 (64-bit)e abriu-o assimchromium-browser --auto-open-devtools-for-tabs
Olga
6
Isso não funciona no Windows 7, versão 51.0.2704.103 m
PetroCliff 08/08
7
O comando completo para o OS X é (saia primeiro de qualquer processo em execução no Chrome):/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
Lane Rettig
2
Não funcionou na versão 59.0.3071.115 (Versão oficial) (64-bit)
Gustavo Straube
Funciona no meu caso de uso, diferentemente da resposta de Saint.
Markus Barthlen
28

No Mac: saia do Chrome e execute o seguinte comando em uma janela do terminal:

open -a "Google Chrome" --args --auto-open-devtools-for-tabs
Erin Mills
fonte
Para esclarecer: isso abre o Chrome com o auto-open-devtools-for-tabsconjunto de sinalizadores. Sair do Chrome e reabri-lo usando o atalho normal do aplicativo abrirá o Chrome sem o sinalizador definido. Se você deseja um atalho para abrir o Chrome com esse conjunto de sinalizadores sem precisar abrir uma janela do terminal, é possível criar um fluxo de trabalho no Automator, adicionar um item "Executar script de shell" e colar no script acima. Salvar o fluxo de trabalho como um aplicativo criará um aplicativo clicável. Veja esta resposta em outro tópico: stackoverflow.com/a/281455/1512790
Rick Gladwin
17

Nas configurações do Chrome DevTools, você habilita:

Em Rede -> Preservar log Em DevTools -> Abrir automaticamente o DevTools para pop-ups

Andrew Patterson
fonte
A melhor resposta IMO
Chase Miller
2
boa resposta, mas explicada para linux: Vá para o console do desenvolvedor. Vá para o menu de hambúrguer. clique em configurações (ou f1). na seção de rede, verifique preservar log. nos devtools seção de verificação devtools auto-aberto para popups
JDPeckham
9

F12 é mais fácil que Ctrl + Shift + I

Yehia
fonte
2
Se você estiver em Windows ou Linux
Gianfranco P.
1
para f12 hit em um MacBook, ou Pro você tem que fazer + f12 fn (extremo inferior esquerdo + extremo superior direito), que não é confortável para a maioria dos usuários de teclado
Seth McClaine
Funciona muito bem no linux ... Outro motivo para mudar. Fiz isso em um Mac Pro, não é perfeito, mas ainda é muito melhor que o Apple OS
Ray Foss
5

Com a janela Ferramentas do desenvolvedor visível, clique no ícone do menu (os três pontos verticais no canto superior direito) e clique em Configurações .

Configuração

Em Ferramentas de Desenvolvimento , verifique o pop-up do DevTools para abrir automaticamente opção

detalhes de configuração

luhuiya
fonte
4

Eu vim aqui procurando uma solução semelhante. Eu realmente queria ver a saída do cromo para o carregamento de página em uma nova guia. (um envio de formulário no meu caso) A solução que realmente usei foi modificar o atributo de destino do formulário para que o envio do formulário ocorresse na guia atual. Consegui capturar a solicitação de rede. Problema resolvido!

George Griffin
fonte
4

Quem quiser fazer isso dentro do Visual Studio, este artigo do Code Project ajudará. Basta adicionar "--auto-open-devtools-for-tabs" na caixa de argumentos. Funciona em 2017.

Ron Rebennack
fonte
Caso a página Code Project desapareça: você vá para o menu suspenso Execute, selecione Browse With ..., Add ..., Program é algo como: C: \ Arquivos de Programas (x86) \ Google \ Chrome \ Application \ chrome .exe e argumentos: --auto-open-devtools-for-tabs -incognito (sendo incógnito opcional)
Dustin_00
3

Se você usar o Visual Studio Code (vscode), usando a muito popular extensão de depuração do vscode chrome ( https://github.com/Microsoft/vscode-chrome-debug ), poderá configurar um arquivo de configuração de inicialização launch.jsone especificar para abrir a ferramenta de desenvolvedor durante uma sessão de depuração.

É o que launch.jsoneu uso nos meus projetos 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"
    }
  ]
}

A linha importante é "runtimeArgs": ["--auto-open-devtools-for-tabs"],

No vscode, agora você pode digitar F5, o Chrome também abre seu aplicativo e a guia do console.

vincedgy
fonte
1

Sim, existe uma maneira de você fazer isso

  1. Clique com o botão direito do mouse-> Inspecionar-> fontes (guia)

  2. Em direção à sua direita, haverá um "botão de execução do script de pausa" O botão destacado na imagem direcionada por este link é o botão de execução de script que pode ser pausado ou reproduzido conforme a necessidade.

Espero que ajude!

  • PS: Esta é a primeira vez que, a partir da segunda vez, a ferramenta de desenvolvimento carrega automaticamente
Harish
fonte
-6

Você pode abrir as Ferramentas de Desenvolvimento ( F12no Chrome) em uma nova janela, clicking three, vertical dotsno canto inferior direito, e escolher Open as Separate Window.

Belloz
fonte