Questa pagina è stata tradotta dall'API Cloud Translation.

Novità di DevTools, Chrome 127

Sofia Emelianova

Ispezionare il posizionamento degli ancoraggi CSS nel riquadro Elementi

Per semplificare il debug della funzionalità di posizionamento di ancoraggio, la scheda Stili ora collega gli identificatori di ancoraggio espliciti e gli ancoraggi impliciti ai relativi nodi.

Prima e dopo aver collegato ancoraggi espliciti e impliciti.

Inoltre, il valore dell'attributo popovertarget ora si collega al relativo elemento popover nel DOM.

Il prima e dopo il collegamento di popovertarget al relativo elemento popover.

Problema relativo a Chromium: 289900232, 330306231.

Miglioramenti al riquadro Origini

Questa versione introduce diversi miglioramenti al riquadro Origini.

Opzione "Non mettere mai in pausa qui" migliorata

L'opzione "Non mettere mai in pausa qui" consente di evitare che il Debugger venga messo in pausa più volte sulla stessa riga. In questo modo è più facile lavorare con punti di interruzione non pertinenti che si attivano ripetutamente. Questa versione migliora questa funzionalità e ora funziona per:

Eccezioni o promesse di rifiuto delle funzioni integrate.
"Annullamento" dei punti di interruzione per violazioni di DOM, fetch/XHR e CSP.
Smontaggio di Wasm.

Guarda il flusso di lavoro in azione:

Problema relativo a Chromium: 40924349.

Nuovi listener di eventi di aggancio di scorrimento

L'elenco Origini > Punti di interruzione listener di eventi > Controllo ottiene due listener correlati a scroll-snap: scrollsnapchange e scrollsnapchanging. Questi eventi si attivano quando fai scorrere il contenitore di scorrimento in un modo che lo farebbe agganciare a un nuovo elemento.

I listener di eventi relativi a prima e dopo l'aggiunta di scroll-snap.

Problema relativo a Chromium: 40286359.

Miglioramenti al riquadro Rete

Questa versione introduce diversi miglioramenti al riquadro Rete.

Preimpostazioni di limitazione della rete aggiornate

Nel riquadro Rete vengono aggiornati i predefiniti aggiornati per la limitazione: i nuovi modelli 4G veloce e 3G veloce sono stati rinominati 4G lento e 3G lento è stato rinominato 3G. Questa opzione si allinea meglio con i predefiniti di Lighthouse.

Le preimpostazioni di limitazione della rete prima e dopo l'aggiornamento.

Problema relativo a Chromium: 342406608.

Informazioni sul service worker in campi personalizzati del formato HAR

Quando esporti il log di rete in formato HAR, ora puoi vedere le informazioni relative ai service worker, incluse le tempistiche, come campi personalizzati (precedenti da trattini bassi). Ad esempio, potresti trovare i seguenti nuovi campi nel log:

...
"response": {
  ...
  "_fetchedViaServiceWorker": true,
  "_responseCacheStorageCacheName": "V1",
  "_serviceWorkerResponseSource": "cache-storage"
}
...
"timings": {
  ...
  "_workerStart": -1,
  "_workerReady": -1,
  "_workerFetchStart": -1,
  "_workerRespondWithSettled": -1
}
...

Problema relativo a Chromium: 342406608.

Invia e ricevi eventi WebSocket nel riquadro Prestazioni

Analogamente agli altri eventi WebSocket, il riquadro Prestazioni ora acquisisce gli eventi Invia messaggi WebSocket e Ricevi messaggi WebSocket e li mostra nell'analisi del rendimento. Ad esempio:

L'evento "Ricevi messaggio WebSocket" acquisito nell'analisi delle prestazioni.

Problema relativo a Chromium: 40286129.

Varie in evidenza

Di seguito sono riportate alcune correzioni e miglioramenti degni di nota in questa release:

Accessibilità: gli screen reader ora annunciano i contenuti dei messaggi nella console quando scorri il log con i tasti Freccia su e Freccia giù (344484979).
Fonti:
- Pagina: l'opzione di menu Salva con nome ora salva i file di moduli Wasm come binari wasm validi anziché come testo Base64 (40784130).
- Stack di chiamate: è stato rimosso il suffisso (async) dalle descrizioni dei frame di chiamata asincroni e ne è stata modificata l'evidenziazione da corsivo a grassetto (343750870).
Memoria: è stato rimosso il InternalNodes non necessario a dimensione zero dal Riepilogo dello snapshot dell'heap (340200025).
Rete: è stato corretto un bug che impediva l'anteprima dei contenuti delle risposte in streaming per le richieste appena avviate, ma che non ricevevano ancora un evento responseReceived (338340752).
Rendimento:
- Statistiche selettore: è stata aggiunta una descrizione comando esplicativa per la colonna %-of-Slow-Path-Non-Matches (324282954).
- Modalità di configurazione dei canali: il pulsante Termina configurazione canali è stato spostato in basso a destra (345256274).
Console: è stato corretto un bug che mostrava più messaggi identici nella console durante la navigazione con la cache back-forward (40894153).
Impostazioni: sono state aggiunte icone di aiuto accanto a tutte le schede (330213867).

Scaricare i canali in anteprima

Prendi in considerazione l'utilizzo di Chrome Canary, Dev o Beta come browser di sviluppo predefinito. Questi canali di anteprima ti consentono di accedere alle ultime funzionalità di DevTools, di testare le API delle piattaforme web all'avanguardia e di individuare i problemi sul tuo sito prima che lo facciano gli utenti.

Contattare il team di Chrome DevTools

Utilizza le seguenti opzioni per discutere delle nuove funzionalità e modifiche nel post o di qualsiasi altra informazione relativa a DevTools.

Inviaci un suggerimento o un feedback tramite crbug.com.
Segnala un problema di DevTools usando Altre opzioni > Guida > Segnala un problema di DevTools in DevTools.
Invia un tweet all'indirizzo @ChromeDevTools.
Lascia commenti sulle novità nei video di YouTube di DevTools o nei video di YouTube dei suggerimenti di DevTools.