Novidades no DevTools: novembro de 2026

Matthias Rohmer

Publicado em: 20 de outubro de 2026

O Chrome 155 e o Chrome 156 foram lançados para o canal estável em outubro, trazendo um novo conjunto de recursos de depuração e criação para seu navegador em novembro: inspeção de estilo CSS no DevTools para agentes, um editor interativo de position-area para posicionamento de âncoras CSS em Elementos e diagnóstico de manifesto de instalação da Web e procedência de anúncios em Aplicativo. Também é possível detectar variáveis de contexto inativas em Memória, inspecionar avisos de pré-carregamento de dicas iniciais e substituições persistentes em Rede e navegar pelas linhas do tempo com mais facilidade em Desempenho.

DevTools para agentes

O servidor MCP do Chrome DevTools adiciona inspeção de estilo CSS, suporte a arquivos de configuração e análise de trace em blocos para agentes de programação:

• Inspeção de estilo CSS: inspecione estilos calculados e correspondentes com a ferramenta get_css_styles, que oferece suporte à paginação (pageSize e pageIdx) e formata regras correspondentes, regras herdadas, pseudoelementos, regras @keyframes e @ (@position-try, @property e @function).
• Arquivo de configuração e controles de caminho: gerencie as flags do servidor com um arquivo de configuração dedicado, configure raízes de sistemas de arquivos personalizadas e use --allow-unrestricted-paths por padrão na CLI.
• Análise de buffer de trace em blocos: analise gravações de desempenho grandes com um analisador de buffer de trace em blocos e um buffer de trace padrão de 1,2 GB. O DevTools também define o escopo das instâncias do mecanismo de trace por análise para evitar vazamentos de memória.
• Processamento de caixas de diálogo e persistência do console: processe automaticamente as caixas de diálogo do JavaScript acionadas durante as ações das Ferramentas de inserção de texto e preserve o histórico de mensagens do console em navegações no mesmo documento.
• Atualização do menu: clique em Acessar o Chrome DevTools para agentes no menu principal do DevTools para abrir as instruções de configuração.

Saiba mais no repositório chrome-devtools-mcp.

Elementos: editor visual de position-area, seleção de âncora implícita e atualizações de criação de CSS

O painel Elementos apresenta ferramentas visuais para o posicionamento de âncoras CSS e expande a inspeção de CSS:

• Editor visual de position-area: clique na amostra inline ao lado de uma declaração position-area na guia Estilos para selecionar visualmente as regiões da grade de âncora, configurar eixos simultaneamente ou individualmente, alternar a palavra-chave self e encurtar palavras-chave sem eixo.
• Seleção de âncora implícita em adornos de popover: clique com o botão direito do mouse em um adorno de popover na árvore do DOM quando um elemento tiver várias âncoras implícitas para inspecionar e pular para qualquer elemento de âncora associado.
• Sobreposição de caixa de posicionamento de âncora: inspecione as caixas de margem, preenchimento, borda e conteúdo do bloco de contenção modificado por inserção (IMCB, na sigla em inglês) diretamente na sobreposição da janela de visualização ao depurar elementos posicionados por âncora.
• wrap-reverse no editor do Flexbox: alterne flex-wrap: wrap-reverse diretamente no editor visual do Flexbox na guia Estilos.
• Estilos CSS inativos para @starting-style e regras herdadas: inspecione regras @starting-style inativas e seções Inherited from com estados de expansão e recolhimento manuais preservados nas atualizações.
• Propriedades personalizadas com vários traços e preenchimento automático de classes: inspecione e edite propriedades personalizadas de CSS que começam com três ou mais traços (como ---theme-color) e filtre as classes já aplicadas das sugestões de preenchimento automático de Adicionar nova classe.

Problemas do Chromium: 553335561, 438724570, 413061413, 397184392, 539424116, 533783988

Aplicativo: diagnósticos do manifesto de instalação da Web, procedência do anúncio e atualizações da tabela de armazenamento

Os painéis Aplicativo e Problemas adicionam diagnósticos para manifestos de instalação na Web, procedência de scripts de anúncios e inspeção de armazenamento:

• Diagnóstico de manifesto da Web Install: inspecione erros de manifesto da Web Install (navigator.install e <install>) no painel Problemas, incluindo falhas de busca, erros de sintaxe, valores start_url inválidos, nomes ou IDs ausentes e manifestos ausentes, com links diretos para o arquivo de manifesto afetado.
• Documentação de métricas e colunas de procedência do anúncio: confira a nova coluna Procedência do anúncio na seção Anúncios do painel Aplicativo para ver se um script de anúncio correspondeu a uma cadeia de scripts ancestral ou a uma regra de lista de filtros, além de dicas de documentação e links Saiba mais sobre métricas de anúncios.
• Ergonomia da tabela de cookies e do IndexedDB: expanda objetos aninhados na grade de dados do IndexedDB com alturas de linha dinâmicas que preservam sua posição de rolagem e exclua as linhas selecionadas na tabela de cookies usando o teclado ou o menu de contexto.

Problemas do Chromium: 333795265, 553428200, 514957134, 555304817, 555304814, 562142155

Rede: avisos de pré-carregamento de dicas iniciais e substituições persistentes

O painel Rede refina os diagnósticos de dicas iniciais, as substituições locais e os fluxos de trabalho de cabeçalho personalizado:

• Aviso de pré-carregamento de dicas antecipadas quando o cache está desativado: confira um aviso na seção de cabeçalhos Dicas antecipadas quando as respostas 103 Early Hints incluírem links de pré-carregamento enquanto a opção Desativar cache estiver ativa, explicando por que o Chrome ignora esses pré-carregamentos.
• Substituições locais persistentes e colunas de cabeçalho personalizadas: disponibilize substituições locais do corpo de resposta em navegações nas páginas, mantenha as configurações de coluna de cabeçalho de solicitação e cabeçalho de resposta personalizadas e a ordem de classificação em recargas e copie payloads de solicitação brutos truncados do menu de contexto.

Problemas do Chromium: 548701038, 559925510, 563542902, 556269542, 377410082

Memória: detecção de campo de contexto inativo em instantâneos de alocação heap

O painel Memória agora detecta variáveis de fechamento não usadas que permanecem retidas nos contextos de execução do V8. O DevTools analisa os metadados de escopo do V8 incorporados em instantâneos de alocação heap para correlacionar closures com objetos Context compartilhados. Em seguida, ela destaca os campos de contexto inativos mantidos ativos por closures de longa duração irmãos quando nenhum closure ativo os acessa, classificados por impacto na memória.

Problemas do Chromium: 497855658

Desempenho: navegação mais suave na linha do tempo e estado da árvore de chamadas preservado

O painel Performance oferece uma navegação mais responsiva no Flame Chart e preserva o contexto de análise em todos os painéis:

• Navegação mais suave na linha do tempo: o zoom, a panorâmica e o arrasto do minimapa da linha do tempo não têm mais atrasos.
• Árvore de chamadas e estado de baixo para cima preservados: alterne entre os painéis do DevTools sem perder os nós expandidos, a seleção ou a posição de rolagem nas guias Árvore de chamadas e De baixo para cima.

Problemas do Chromium: 553831653, 561396590

Outros destaques

O Chrome 155 e o Chrome 156 também incluem as seguintes melhorias nos painéis do DevTools:

• Sensores: substitua navigator.cpuPerformance diretamente do novo controle Nível de desempenho da CPU no painel Sensores ou deixe que ele reflita as predefinições de limitação de CPU ativas. (Problemas do Chromium: 449760252, 526856234, 526857820)
• Modo de dispositivo: mantenha as preferências de escala e ajuste automático de zoom por dispositivo emulado e mantenha a substituição de Save-Data ao alternar a barra de ferramentas do dispositivo. (Problemas do Chromium: 561306841, 555160483)
• Seletor de cores: confira sugestões de cores de contraste da APCA para texto claro em fundos escuros e converta cores fora da gama em oklab() e oklch() sem valores NaN. (Problemas do Chromium: 560325669, 558821258)
• Acessibilidade: identifique os botões de filtro de expressão regular ativos com um ponto indicador sem cor, ouça os nomes das propriedades de fonte anunciados por leitores de tela na Visão geral do CSS e navegue com anéis de foco do teclado aprimorados e visibilidade de alto contraste em todos os painéis. (Problemas do Chromium: 556764882, 555848535, 555599825, 553804654)

Problemas do Chromium: 449760252, 526856234, 526857820, 561306841, 555160483, 560325669, 558821258, 556764882, 555848535, 555599825, 553804654