Novità di DevTools (Chrome 150)

Matthias Rohmer

Data di pubblicazione: 30 giugno 2026

Chrome 150 offre un debug della memoria migliorato in DevTools per gli agenti, migliora l'assistenza AI con altri widget e introduce funzionalità di modifica complete per le regole CSS @container e @function.

DevTools per gli agenti

Nelle release recenti fino a v1.4.0, Chrome DevTools per gli agenti ha ampliato notevolmente le funzionalità di debug e automazione del browser agentico.

Le principali funzionalità e i miglioramenti dalla release precedente includono:

• Suite di debug della memoria (--experimentalMemory): gli agenti ora possono acquisire e analizzare direttamente gli snapshot dell'heap V8 per diagnosticare le perdite di memoria JavaScript e analizzare le gerarchie di conservazione degli oggetti.
• Gestione delle estensioni di Chrome (--categoryExtensions): gli agenti possono gestire i cicli di vita delle estensioni (installazione, disinstallazione, ricaricamento, elenco) e acquisire i log della console dei service worker in background per la diagnostica.
• Competenze degli agenti in bundle: la directory skills/ ora viene pubblicata direttamente nella distribuzione del pacchetto npm, consentendo agli agenti client MCP di scoprire ed eseguire automaticamente flussi di lavoro di navigazione e debug specializzati.
• Ottimizzazioni di token e output: la limitazione delle dimensioni degli screenshot all'origine riduce il consumo di token e il supporto sperimentale TOON (Token-Oriented Object Notation) ottimizza la formattazione dei dati strutturati.
• Navigazione e contesto migliorati: list_pages ora include i titoli delle pagine insieme agli URL e agli ID di destinazione per una migliore selezione del contesto multi-scheda, mentre le opzioni di configurazione allowedUrlPattern e blockedUrlPattern applicano una sicurezza rigorosa dell'ambito di navigazione.

Per gli aggiornamenti più recenti su DevTools per gli agenti e per contribuire, visita il repository GitHub.

Informazioni più approfondite nell'assistenza AI

Il riquadro Assistenza AI continua a evolversi, fornendo maggiori dettagli nelle procedure dettagliate dell'agente. Nove widget aggiuntivi ora includono dati dai riquadri Lighthouse, Rete, Sorgenti e Prestazioni. I widget ti aiutano a comprendere meglio i dati utilizzati da Gemini quando chiama gli strumenti dell'agente per recuperare eventi di rendimento, contenuti delle risorse, richieste di rete e altro ancora.

Problemi di Chromium: 460763995

Supporto completo per la modifica di altre regole at-CSS

La scheda Stili nel riquadro Elementi offre nuove funzionalità di creazione per le funzionalità CSS moderne:

• Modifica in-place della regola @container rule editing: ora puoi modificare direttamente i nomi dei contenitori e le condizioni di query nelle regole CSS @container rules, consentendo una sperimentazione senza interruzioni con i design di query dei contenitori reattivi.
• Modifica della regola CSS @function:è stato aggiunto il supporto completo per la modifica delle regole CSS @function personalizzate.
• Modifica della regola @counter-style: è stato aggiunto il completamento automatico del codice per le proprietà list-style-type, collegandole direttamente alle definizioni @counter-style corrispondenti.
• Comprimi le regole inattive: una nuova impostazione delle preferenze ti consente di comprimere le regole di stile CSS inattive, mantenendo il riquadro Stili focalizzato rigorosamente sugli stili attivi.

Problemi di Chromium: 507611251, 41491726, 480080406, 351662727, 514846131

Punti di interruzione deduplicati e supporto delle mappe di origine ricorsive in Sorgenti

Il riquadro Sorgenti offre una maggiore precisione del debug nelle pipeline di build moderne complesse:

• Deduplicazione logica dei punti di interruzione: i marcatori dei punti di interruzione nella gutter ora vengono deduplicati tra i bundle di suddivisione del codice e i modelli compilati SSR/client utilizzando la mappatura della posizione risolta più vicina. In questo modo si evitano indicatori di punti di interruzione duplicati durante il debug del codice condiviso tra più blocchi o ambienti.
• Ricorsivo EvalOrigin e mappe di origine nidificate: il debugger ora supporta strutture EvalOrigin ricorsive e catene di traduzione nidificate nelle mappe di origine, garantendo tracce dello stack e comportamenti di esecuzione passo passo accurati nei flussi di lavoro di compilazione in più fasi.
• Scorciatoia da tastiera Vai alla riga: è stata aggiunta ALT + G come scorciatoia da tastiera aggiuntiva per la navigazione "Vai alla riga" nell'editor, per evitare conflitti con la nuova scorciatoia Gemini in Chrome.
• Formattazione degli attributi di importazione: è stato aggiornato il parser Acorn sottostante per supportare la formattazione di stampa di alta qualità per la sintassi degli attributi di importazione JavaScript standard.

Problemi di Chromium: 493674242, 485142682, 480172712, 491167992

Protezione della sicurezza e dell'origine incrociata in DevTools

Come molti altri prodotti software, di recente abbiamo assistito a un aumento dei report sulla sicurezza, molti dei quali sono stati trovati con l'aiuto dell'AI. Il team esamina e corregge costantemente questi problemi per mantenere la sicurezza di DevTools:

• Protezioni Self-XSS per le espressioni live: sono state aggiunte finestre di dialogo di avviso Self-XSS e meccanismi di protezione durante la creazione di espressioni live nella Console.
• Elenchi consentiti di navigazione e verifica della riproduzione del Registratore: Il Registratore ora applica elenchi consentiti di navigazione rigorosi per impedire la navigazione verso pagine con privilegi elevati, oltre a una verifica rigorosa dell'origine dell'estensione nelle sezioni di riproduzione.
• Restrizioni di override di rete delle estensioni: gli override di rete gestiti dalle estensioni ora applicano rigorosamente i criteri host runtime_blocked_hosts.
• Costruzione sicura di @font-face:è stata eseguita la refactoring della generazione delle regole @font-face utilizzando l'API CSSStyleSheet e la stringificazione sicura degli URL per impedire l'iniezione di CSS tramite gli URL dei dati.

Altri punti forti

Una raccolta di miglioramenti e correzioni di bug minori in questa release:

• Prestazioni: è stata corretta l'inflazione delle dimensioni di trasferimento di TraceTree per le richieste di rete memorizzate nella cache forzando le dimensioni di trasferimento a 0 byte per gli hit della cache identificati.
• Prestazioni: sono stati aggiornati i formattatori di rendimento per supportare i dati del campo deviceScope del Report sull'esperienza utente di Chrome (CrUX) facoltativo.
• Prestazioni: è stato attivato lo scorrimento orizzontale nelle tabelle dell'albero delle chiamate per evitare il troncamento con i puntini di sospensione degli URL dei file lunghi.
• Prestazioni: è stata corretta la corruzione dello stato DOM e del rendering non funzionante nella barra laterale Informazioni su più file di traccia.
• Prestazioni: è stata eseguita la migrazione del monitoraggio dell'invalidazione della sequenza temporale e delle impostazioni della modalità di debug dai flag sperimentali alle impostazioni standard di DevTools.
• Rete: è stato ripristinato il ridenominazione errato delle colonne per ripristinare la colonna Ha override ed è stata corretta la logica di ordinamento per gli override di intestazione e contenuti.
• Rete: è stato corretto lo stile CSS attr() nelle barre a cascata di Server-Timing in modo che i colori generati per riga vengano visualizzati correttamente.
• Rete: è stata corretta la generazione del comando Copia come cURL per i cookie senza nome.
• Applicazione: sono stati collegati gli elementi di archiviazione locale e di sessione nel riquadro Applicazione utilizzando la nuova infrastruttura StorageAgent.
• Applicazione: è stata corretta la precedenza dello stato Caricamenti speculativi in modo che gli URL che hanno esito positivo sia per il recupero che per il prerendering vengano visualizzati con precisione come "prerenderizzati".
• Applicazione: sono stati visualizzati i suggerimenti relativi al valore esatto in byte nelle colonne delle visualizzazioni degli snapshot dell' heap.
• Problemi: è stato visualizzato il tipo di problema BackUINavigationWouldSkipAd ogni volta che la navigazione indietro avrebbe ignorato le voci degli annunci.
• Problemi: è stato aggiunto il supporto per la visualizzazione dei problemi relativi alle richieste di verifica dell'indirizzo email (EmailVerificationRequestIssue).
• Lighthouse: è stata aggiunta una casella di controllo della categoria Navigazione agentica (disattivata per impostazione predefinita) nel riquadro di configurazione di Lighthouse ed è stato aggiornato il motore Lighthouse in bundle alla versione v13.3.0.

Problemi di Chromium: 518021339, 40908621, 517519019, 487755345, 505284391, 465915378, 512908993, 40543651

Miglioramenti all'accessibilità

Chrome 150 offre diversi miglioramenti agli annunci dello screen reader, alle strutture dei widget e alla semantica ARIA in DevTools:

• Sono stati migliorati gli annunci dello screen reader durante la selezione delle schede e la navigazione nelle sezioni all'interno della scheda Stili.
• Sono stati aggiunti suggerimenti descrittivi sulle icone di chiusura delle finestre di dialogo e sono stati consentiti gli attributi ARIA details e description nei suggerimenti.
• Sono stati applicati ruoli menuitem ARIA rigorosi agli elementi del menu contestuale per migliorare la navigazione per le tecnologie assistive.

Problemi di Chromium: 510013788