Novidades do DevTools (Chrome 108)

Jecelyn Yeen

Dicas para propriedades CSS inativas

O DevTools agora identifica estilos CSS que são válidos, mas não têm efeito visível. No painel Styles, o DevTools esmaece as propriedades inativas. Passe o cursor sobre o ícone ao lado dela para entender por que a regra não tem efeito visível.

Dicas para propriedades CSS inativas.

Problema do Chromium: 1178508

Detectar automaticamente seletores XPath e de texto no painel Gravador

O painel Gravador agora é compatível com seletores XPath e de texto. Comece a gravar um fluxo do usuário, e o gravador escolherá automaticamente o XPath e o menor texto exclusivo de um elemento como seletor, se disponíveis.

Seletores XPath e de texto no painel Gravador.

Problemas do Chromium: 1327206,1327209

Percorrer expressões separadas por vírgulas

Agora é possível percorrer expressões separadas por vírgulas durante a depuração. Isso melhora a capacidade de depuração do código minificado.

Percorra as expressões separadas por vírgulas.

Antes, o DevTools só oferecia permissão para percorrer expressões separadas por ponto e vírgula.

Dado o código abaixo,

function foo() {}

function bar() {
  foo();
  foo();
  return 42;
}

Os transpiladores e minimizadores podem transformá-los em expressões separadas por vírgulas.

function bar(){return foo(),foo(),42}

Isso cria confusão durante a depuração, porque o comportamento da etapa é diferente entre código minificado e criado. É ainda mais confuso usar mapas de origem para depurar o código minificado em termos do código original, já que o desenvolvedor analisa os pontos e vírgulas (que foram transformados em vírgulas pelo conjunto de ferramentas), mas o depurador não para neles.

Problema do Chromium: 1370200

Configuração aprimorada da lista de ignorados

Acesse Configurações > Lista de ignorados. O DevTools melhora o design para ajudar você a configurar as regras para ignorar um único script ou padrão de scripts.

A guia "Lista de ignorados".

Problema do Chromium: 1356517

Destaques diversos

Estas são algumas correções importantes nesta versão:

  • Preencha automaticamente o nome da propriedade CSS no painel Estilos ao pressionar a barra de espaço. (1343316).
  • Remova a rolagem automática na localização atual do painel Elemento. (1369734).

Fazer o download dos canais de visualização

Use o Chrome Canary, Dev ou Beta como seu navegador de desenvolvimento padrão. Esses canais de pré-visualização dão acesso aos recursos mais recentes do DevTools, testam APIs modernas da plataforma Web e encontram problemas no seu site antes que os usuários o façam!

Entrar em contato com a equipe do Chrome DevTools

Use as opções a seguir para discutir os novos recursos e mudanças na postagem ou qualquer outro assunto relacionado ao DevTools.

  • Envie uma sugestão ou feedback pelo site crbug.com.
  • Para informar um problema do DevTools, use Mais opções   Mais   > Ajuda > Informar problemas do DevTools no DevTools.
  • Tuíte em @ChromeDevTools.
  • Deixe comentários nos vídeos do YouTube sobre as novidades do DevTools ou nos vídeos do YouTube com dicas sobre o DevTools.

Novidades no DevTools

Uma lista de tudo que foi abordado na série Novidades no DevTools.

Chrome 127

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113

Chrome 112

Chrome 111

Chrome 110

Chrome 109

Chrome 108

Chrome 107

Chrome 106

Chrome 105

Chrome 104

Chrome 103

Chrome 102

Introdução ao Chrome

Chrome 100

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Chrome 91

Chrome 90

Chrome 89

Chrome 88

Chrome 87

Chrome 86

Chrome 85

Chrome 84

Chrome 83

Chrome 82

O Chrome 82 foi cancelado.

Chrome 81

Chrome 80

Chrome 79

Chrome 78

Chrome 77

Chrome 76

Chrome 75

Chrome 74

Chrome 73

Chrome 72

Chrome 71

Chrome 70

Chrome 68

Chrome 67

Chrome 66

Chrome 65

Chrome 64

Chrome 63

Chrome 62

Chrome 61

Chrome 60

Chrome 59