Novità di DevTools (Chrome 117)

Sofia Emelianova
Sofia Emelianova

Miglioramenti al riquadro Rete

Esegui l'override dei contenuti web in locale ancora più velocemente

La funzionalità override locali è ora semplificata, così puoi simulare facilmente le intestazioni delle risposte e i contenuti web delle risorse remote dal riquadro Rete senza accedervi.

Per eseguire l'override dei contenuti web, apri il riquadro Rete, fai clic con il tasto destro del mouse su una richiesta e seleziona Esegui l'override dei contenuti.

Le opzioni di override nel menu a discesa di una richiesta.

Se hai configurato gli override locali ma li hai disattivati, DevTools li attiva. Se non li hai ancora configurati, DevTools ti chiede di farlo nella barra delle azioni in alto. Seleziona una cartella in cui archiviare gli override e consenti l'accesso a DevTools.

Seleziona una cartella e consenti l'accesso nella barra delle azioni in alto.

Una volta configurate le sostituzioni, DevTools ti indirizza a Sources (Origini) > Overrides (Sostituzioni) > Editor per consentirti di eseguire l'override dei contenuti web.

Tieni presente che le risorse sostituite sono indicate con Salvato. nel riquadro Rete. Passa il mouse sopra l'icona per vedere cosa è stato ignorato.

Un'icona di override accanto a una richiesta nel riquadro Rete.

Problemi di Chromium: 1465785, 1470532, 1469359.

Eseguire l'override dei contenuti delle richieste XHR e di recupero

Ora puoi sostituire il contenuto delle richieste XHR e fetch, oltre alle intestazioni delle risposte. Con questi override, puoi simulare le risposte dell'API per eseguire il debug della tua pagina web anche se il backend e l'API non sono ancora pronti.

Attualmente DevTools supporta gli override dei contenuti per i seguenti tipi di richieste: immagini (ad esempio avif, png), caratteri, recupero e XHR, script (css e js) e documenti (html). DevTools ora disattiva l'opzione Override content per i tipi non supportati.

Problemi di Chromium: 792101, 1469776.

Nascondere le richieste di estensioni di Chrome

Per aiutarti a concentrarti sul codice che crei e a filtrare le richieste irrilevanti inviate dalle estensioni che potresti aver installato in Chrome, il riquadro Rete riceve un nuovo filtro.

Per filtrare tutte le richieste inviate agli URL chrome-extension://, seleziona Casella di controllo. Nascondi URL delle estensioni.

Gli URL delle estensioni sono nascosti nella tabella delle richieste.

Problemi di Chromium: 1257885, 1458803.

Codici di stato HTTP leggibili

Il codice di stato nell'intestazione della richiesta ora mostra un testo leggibile accanto ai codici di stato HTTP, in modo da poter capire più rapidamente cosa è successo alla richiesta.

Prima e dopo la visualizzazione dei codici di stato HTTP leggibili.

Puoi anche passare il mouse sopra il codice di stato nella tabella delle richieste per visualizzare lo stesso testo.

Problema di Chromium: 1153956.

Formattare le risposte per i sottotipi JSON

La scheda Risposta per una richiesta con un sottotipo MIME application/[subtype]+json (ad esempio ld+json, hal+json e altri) ora analizza correttamente la risposta e ti consente di formattarla.

Prima e dopo l'analisi di un sottotipo application/json in un'anteprima della risposta di rete.

Problema di Chromium: 406900.

Rendimento: visualizza le modifiche alla priorità di recupero per gli eventi di rete

Il riquadro Rendimento ora mostra due campi di priorità nel Riepilogo di un evento nella traccia Rete: Priorità iniziale e Priorità (finale), anziché un solo campo Priorità. Con questo campo aggiuntivo ora puoi vedere se la priorità di recupero dell'evento cambia e modificare l'ordine dei download. Per saperne di più, consulta Ottimizzare il caricamento delle risorse con l'API Fetch Priority.

Prima e dopo la visualizzazione delle modifiche alla priorità di recupero.

Inoltre, puoi trovare le stesse informazioni nella colonna Priorità del riquadro Rete, con l'impostazione Righe di richieste di grandi dimensioni attivata.Casella di controllo.

La colonna Priorità nel riquadro Rete.

Problemi di Chromium: 1463901, 1380964.

Impostazioni delle origini attivate per impostazione predefinita: ripiegamento del codice e visualizzazione automatica dei file

L'opzione Impostazioni. Impostazioni > Preferenze > Casella di controllo. Raggruppamento del codice è ora attiva per impostazione predefinita. Questa opzione consente di comprimere i blocchi di codice.

Per comprimere un blocco di codice, passa il mouse sopra il numero di riga accanto all'inizio del blocco e fai clic sull'icona di compressione Comprimi.. Fai clic su {...} per espandere di nuovo il blocco.

Inoltre, l'opzione Impostazioni. Impostazioni > Preferenze > Casella di controllo. Mostra automaticamente i file nella barra laterale è ora abilitata per impostazione predefinita.

Questa impostazione fa sì che l'albero dei file in Origini > Pagina selezioni il file corrente aperto nell'Editor quando cambi scheda.

Problemi di Chromium: 1459193, 1336599.

Debug migliorato dei problemi relativi ai cookie di terze parti

Nel tentativo di contribuire a creare un web più privato e in parallelo con gli aggiornamenti di altri browser, Chrome ha introdotto l'iniziativa Privacy Sandbox. Questa iniziativa migliora radicalmente la privacy sul web e può sostenere un web sano supportato dalla pubblicità in modo da rendere obsoleti i cookie di terze parti. Privacy Sandbox prevede una cronologia di ritiro graduale per consentirti di adattarti comodamente ai cambiamenti.

Puoi già testare il comportamento di Chrome dopo l'eliminazione graduale dei cookie di terze parti. Per farlo, esegui Chrome dalla riga di comando con il flag --test-third-party-cookies-phaseout. Per scoprire cosa fa questo flag, consulta Debug dei cookie.

Indipendentemente dal modo in cui esegui Chrome (con o senza il flag), la scheda Problemi ora ha la casella di controllo Casella di controllo. Includi problemi relativi ai cookie di terze parti attivata per impostazione predefinita per tutti i nuovi utenti di Chrome e, di conseguenza, segnala:

  • Un avviso di modifica che causa interruzioni relativo al ritiro imminente.
  • Problemi relativi ai cookie di terze parti.

Se vuoi visualizzare gli avvisi relativi ai cookie in merito all'imminente ritiro in qualità di utente Chrome esistente, assicurati di selezionare questa casella di controllo.

Per eseguire il test, esamina i cookie in questa pagina demo.

Problemi relativi ai cookie di terze parti segnalati nella scheda Problemi.

Inoltre, il filtro Casella di controllo. Cookie di risposta bloccati nel riquadro Rete è stato riformulato per indicare chiaramente che mostra solo i cookie di risposta bloccati.

La casella di controllo è selezionata e mostra solo le richieste con cookie di risposta bloccati.

Problemi di Chromium: 1458839, 1462693,