Ferramentas para Desenvolvedores do Microsoft Edge (EdgeHTML)

Observação

O novo Microsoft Edge é criado usando o Chromium e começa na versão 75. Para obter mais informações, Baixe o novo Microsoft Edgee experimente as novas ferramentas de desenvolvedor do Microsoft Edge \ (Chromium ).

As Ferramentas para Desenvolvedores do Microsoft Edge (EdgeHTML) são criadas com o TypeScript, da plataformasoftware livre, otimizadas para fluxos de trabalho front-end modernos, e agora disponíveis como umaplicativo autônomo Windows 10 na Microsoft Store!

Para saber mais sobre os recursos mais recentes, confira DevTools na atualização mais recente do Windows 10 (EdgeHTML 18).

Ferramentas principais

Ferramentas para Desenvolvedores do Microsoft Edge (EdgeHTML)

Ferramentas para Desenvolvedores do Microsoft Edge (EdgeHTML)

As Ferramentas para Desenvolvedores do Microsoft Edge (EdgeHTML) incluem:

  • Um painel de [Elementos][DevtoolsGuideEdgehtml|::ref2::|] para editar HTML e CSS, inspecionar propriedades de acessibilidade, exibir ouvintes de eventos e definir pontos de interrupção de mutação do DOM.
  • Um [Console][DevtoolsGuideEdgehtml|::ref3::|] para exibir e filtrar mensagens de log, inspecionar objetos JavaScript e nós do DOM e executar o JavaScript no contexto da janela ou quadro selecionado.
  • Um [Depurador][DevtoolsGuideEdgehtml|::ref4::|] para percorrer o código, definir inspeções e pontos de interrupção, editar seu código ao vivo e inspecionar o armazenamento da Web e os caches de cookies
  • Um painel de[Rede][DevtoolsGuideEdgehtml|::ref5::|]para monitorar e inspecionar solicitações e respostas do cache da rede e do navegador
  • Um painel de [Desempenho][DevtoolsGuideEdgehtml|::ref6::|] para criar um perfil de tempo e recursos do sistema necessários para o seu site
  • Um painel de [Memória][DevtoolsGuideEdgehtml|::ref7::|] para medir o uso dos recursos de memória e comparar os instantâneos da pilha em diferentes estados de tempo de execução do código
  • Um painel de[Armazenamento][DevtoolsGuideEdgehtml|::ref8::|] para inspecionar e gerenciar seu armazenamento na Web, IndexedDB, cookies e dados de cache
  • Um painel de Profissionais de Serviço para gerenciar e depurar seus profissionais de serviço.
  • Um painel de [Emulação][DevtoolsGuideEdgehtml|::ref9::|] para testar o seu site com diferentes perfis de navegador, resoluções de tela e coordenadas de localização do GPS

Continue enviando seus comentários e solicitações de recursos!

Dica

Teste no Microsoft Edge (EdgeHTML) gratuitamente em qualquer navegador.
A equipe do Microsoft Edge criou uma parceria com o BrowserStack para fornecer testes gratuitos e automatizados no Microsoft Edge.

Aplicativo da Microsoft Store

As Ferramentas para Desenvolvedores do Microsoft Edge (EdgeHTML) estão disponíveis agora como um aplicativo autônomo Windows 10 da Microsoft Store, além da experiência de ferramentas do navegador (F12). Com a versão da loja, há um painel de seletor para anexar a abrir destinos de página locais e remotos e um layout com guias para alternar entre instâncias das DevTools.

Depuração local

Para depurar uma página localmente, basta iniciar o aplicativo Microsoft Edge DevTools. O painel Local do seletor exibirá todos os processos de conteúdo ativos do EdgeHTML, incluindo as guias de navegação abertas do Edge, PWAs (WWAHost.exe processos) em funcionamento e controles do WebView. Selecione seu destino desejado para anexar e abrir uma nova instância da guia do DevTools.

Painel local do aplicativo DevTools

Painel local do aplicativo DevTools

Depuração remota

O aplicativo Microsoft Edge DevTools introduz o suporte básico para depurar páginas em um computador remoto por meio do nosso novo Protocolo DevTools. A versão mais recente vem com o acesso remoto à funcionalidade central no [Depurador][DevtoolsGuideEdgehtml|::ref10::|], nos[Elementos][DevtoolsGuideEdgehtml|::ref11::|] (para operações somente leitura) e nos painéis do[Console][DevtoolsGuideEdgehtml|::ref12::|]. O depurador remoto está limitado ao Microsoft Edge (EdgeHTML) executando hosts da área de trabalho, com suporte para outros hosts EdgeHTML e dispositivos com Windows 10 chegando nas versões futuras.

Para começar, confira a seção de documentos Protocolo DevToolsdoMicrosoft Edge DevTools.

Painel remoto do aplicativo DevTools

Painel remoto do aplicativo DevTools

Atalhos gerais

Importante

Todos os atalhos foram verificados na versão mais recente do Windows.
Se não for possível usar um atalho, atualize sua cópia do Windows.

Esses atalhos controlam a janela principal do DevTools e devem funcionar em todas as ferramentas.

Ação Atalho
Mostrar/Ocultar DevTools (abre para o último painel exibido) F12, Ctrl+Shift+I
Alternar encaixe (Desencaixar/Abaixo/Direita) Ctrl+Shift+D
Abrir arquivo Ctrl+P, Ctrl+O
Mostrar código-fonte HTML não editável no depurador Ctrl+U
Mostrar/ocultar Console na parte inferior de qualquer outra ferramenta Ctrl+`
Alternar para Elementos (explorador do DOM) Ctrl+1
Alternar para Console Ctrl+2
Alternar para Depurador Ctrl+3
Alternar para Rede Ctrl+4
Alternar para Desempenho Ctrl+5
Alternar para Memória Ctrl+6
Alternar para Emulação Ctrl+7
Documento de Ajuda F1
Próxima ferramenta Ctrl+F6
Guia anterior Ctrl+Shift+F6
Ferramenta anterior (do histórico) Ctrl+Shift+[
Próxima ferramenta (do histórico) Ctrl+Shift+]
Próximo subquadro F6
Subquadro anterior Shift+F6
Próxima correspondência na caixa de pesquisa F3
Correspondência anterior na caixa de pesquisa Shift+F3
Procurar na caixa de pesquisa Ctrl+F
Focalizar o console na parte inferior Alt+Shift+I
Iniciar o DevTools para o Console Ctrl+Shift+J
Atualizar a página Ctrl+Shift+F5, Ctrl+R

Observação

Se você estiver depurando e pausar em um ponto de interrupção, a ação Atualizar a página retoma o tempo de execução primeiro.

Privacidade Jurídica

Envie seus comentários para ajudar a melhorar o Microsoft Edge \ (EdgeHTML) DevTools para você! Basta abrir as ferramentas (F12) e selecionar o botão Enviar comentários.

Torne-se um Participante do Programa Windows Insider para visualizar os recursos mais recentes que estão chegando à DevTools. Use o aplicativo Hub do Windows Feedback para publicar, votar, acompanhar e obter suporte para sugestões gerais e problemas do Windows.