Novidades do DevTools (Chrome 119)

Sofia Emelianova
Sofia Emelianova
GitHub

Melhoramos a seção @property em Elementos > Estilos

Regra @property editável

Agora você pode editar o @property CSS at-rule na seção correspondente em Elementos > Painel Styles.

O antes e o depois de tornar a regra de propriedade editável.

Problema do Chromium: 1471123.

Foram relatados problemas com regras @property inválidas

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

Problemas com a regra de propriedade informados na guia "Problemas".

Problema do Chromium: 1473283.

Lista de dispositivos a serem emulados atualizada

As strings do user agent em Configurações. Settings > Os dispositivos foram atualizados para refletir o uso médio de navegadores e sistemas operacionais. Agora você pode emular mais dispositivos atualizados no modo dispositivo.

O antes e depois de atualizar a lista de dispositivos.

Problema do Chromium: 1479733.

JSON in-line de estilo atraente em tags de script no Source

O painel Sources agora oferece suporte para a formatação de JSON inline em tags HTML <script> para facilitar a depuração.

O JSON in-line antes e depois da formatação na tag do script.

Problemas do Chromium: 406900, 1473875.

Preencher campos particulares automaticamente no console

Agora você pode preencher automaticamente campos particulares quando eles são avaliados fora do escopo da turma no Console.

O antes e o depois de oferecer suporte ao preenchimento automático para um campo de classe particular fora do escopo da classe.

Problemas do Chromium: 1483848, 1381806.

Lighthouse versão 11.1.0

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

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

Problemas do Chromium: 772558.

Melhorias de 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 Fontes.

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

Problemas do Chromium: 1485257, 1486643 e 1485263.

Descontinuação do Web SQL

A página Application > A seção 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 futura remoção.

O aviso de descontinuação do Web SQL.

Para mais informações, consulte Como suspender o uso 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 "Aplicativo" > Manifesto

A página Application > A seção Manifesto 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 essa mudança e por outras melhorias nos avisos do manifesto que fizemos na versão anterior.

Problema do Chromium: 1476656.

Destaques diversos

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

  • Elementos:
    • Amostras da função de tempo de animação não são exibidas para propriedades CSS de longa duração sob as de abreviação expansível (1149182).
    • O preenchimento automático de contain-intrinsic-* agora não fornece o valor único incorreto de auto porque deveria ser auto <length> (1480415).
    • O suporte a propriedades -webkit-* descontinuadas e inválidas foi removido (1086089, 1030765).
  • Pontos de interrupção: foi corrigido o bug em que a caixa de diálogo de edição do ponto de interrupção desapareceva quando o tipo dele mudava (1485782).
  • Desempenho:
    • O erro de análise de cor durante o registro de performance foi corrigido (1480205).
    • Correção do bug com a LCP que não era mostrada 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 contexto incorreto de execução de script para extensões (1275331).

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é-lançamento 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.
  • Informe um problema do DevTools usando Mais opções   Mais > Ajuda > Relate problemas no 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.