Novidades do DevTools (Chrome 119)

Sofia Emelianova
Sofia Emelianova

Seção @property aprimorada em Elementos > Estilos

Regra @property editável

Agora é possível editar a @property regra CSS at na seção correspondente do painel Elementos > Estilos.

Antes e depois de tornar a regra de propriedade editável.

Problema do Chromium: 1471123.

Problemas com regras @property inválidas são informados

A guia Problemas agora informa problemas com declarações inválidas nas regras @property.

Um problema com a regra de propriedade informado na guia "Problemas".

Problema do Chromium: 1473283.

Lista de dispositivos a serem emulados atualizada

As strings do agente do usuário em Configurações. Configurações > Dispositivos foram atualizadas para refletir o uso médio de navegadores e sistemas operacionais. Agora é possível emular mais dispositivos atualizados no modo de dispositivo.

Antes e depois da atualização da lista de dispositivos.

Problema do Chromium: 1479733.

Mostrar JSON inline em tags de script em "Fonte bonita"

O painel Origens agora oferece suporte à impressão em JSON inline em tags HTML <script> para facilitar a depuração.

O JSON inline antes e depois da formatação na tag de script.

Problemas do Chromium: 406900, 1473875.

Preenchimento automático de campos particulares no console

Agora é possível fazer preenchimento automático de campos de classe privados ao avaliá-los fora do escopo da classe no Console.

O antes e o depois do suporte à autopreenchimento para o campo de classe particular fora do escopo da classe.

Problemas do Chromium: 1483848, 1381806.

Lighthouse 11.1.0

O painel Lighthouse agora executa o Lighthouse 11.1.0. Consulte a lista completa de mudanças.

Para aprender os conceitos básicos de uso do painel Lighthouse nas DevTools, consulte Lighthouse: otimizar a velocidade do site.

Problemas do Chromium: 772558.

Melhorias na acessibilidade

Os leitores de tela vão ler o seguinte:

  • Avisos e erros no console.
  • O texto na caixa de diálogo Você confia neste código? ao colar o código no Console ou em Origens.

Além disso, o painel App corrigiu problemas de contraste com links no modo de alto contraste.

Problemas do Chromium: 1485257, 1486643, 1485263.

Descontinuação do Web SQL

A seção Application > Web SQL será removida no Chrome 123 porque a API Web SQL Database não é mais mantida. Esta versão adiciona um aviso à seção sobre a remoção.

O aviso de descontinuação do Web SQL.

Para mais informações, consulte Como descontinuar e remover o Web SQL.

Problemas do Chromium: 1485966.

Manifesto"" id="manifest-aspect-ratio" tabindex="-1">Validação da proporção da captura de tela em "Application > Manifest"

A seção Application > Manifest agora verifica se as capturas de tela do seu app da Web com o mesmo formato (wide ou narrow) têm a mesma proporção.

Um aviso sobre a proporção incorreta de capturas de tela com o mesmo formato.

Para mais informações, consulte Depurar Progressive Web Apps e Adicionar um manifesto de app da Web.

A equipe do DevTools agradece a Alexey Rodionov por fazer essa mudança e outras melhorias no aviso do manifesto na versão anterior.

Problema do Chromium: 1476656.

Destaques diversos

Confira algumas correções e melhorias importantes desta versão:

  • Elementos:
    • As amostras de função de tempo de animação não são mostradas para propriedades CSS longas nas abreviações expandíveis (1149182).
    • O preenchimento automático para contain-intrinsic-* agora não fornece o valor único incorreto de auto, porque ele precisa ser auto <length> (1480415).
    • O suporte a propriedades -webkit-* descontinuadas e inválidas foi removido (1086089, 1030765).
  • Pontos de interrupção: corrigimos o bug que fazia a caixa de diálogo de edição de pontos de interrupção desaparecer quando o tipo de ponto de interrupção era alterado (1485782).
  • Performance:
    • O erro de análise de cores durante a gravação de desempenho foi corrigido (1480205).
    • Correção do bug em que o LCP não aparecia na faixa Timings (1487136).
  • Rede: a coluna Definir cookies agora mostra o número correto de cookies definidos, excluindo os bloqueados (1486903).
  • As extensões do DevTools agora são carregadas após a navegação para um host não bloqueado (1476264).
  • Correção do bug com o contexto de execução de script incorreto para extensões (1275331).

Fazer o download dos canais de visualização

Use o Chrome Canary, Dev ou Beta como navegador de desenvolvimento padrão. Esses canais de visualização dão acesso aos recursos mais recentes do DevTools, permitem testar APIs de plataforma da Web de última geração e ajudam a encontrar problemas no seu site antes que os usuários.

Entre em contato com a equipe do Chrome DevTools

Use as opções a seguir para discutir os novos recursos, atualizações ou qualquer outra coisa relacionada ao DevTools.

Novidades no DevTools

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