Novità di DevTools (Chrome 113)

Sofia Emelianova
Sofia Emelianova
GitHub
Jecelyn Yeen

Esegui l'override delle intestazioni delle risposte di rete

Ora puoi ignorare le intestazioni delle risposte nel riquadro Rete. In precedenza, per sperimentare le intestazioni della risposta HTTP, era necessario accedere al server web.

Con gli override delle intestazioni di risposta, puoi prototipare localmente le correzioni per varie intestazioni, tra cui:

Per ignorare un'intestazione, vai a Rete > Intestazioni > Intestazioni della risposta, passa il mouse sopra il valore di un'intestazione, fai clic su Modifica. e modificalo.

Errore CORS corretto mediante l'override di un'intestazione.

Puoi anche aggiungere intestazioni personalizzate.

Aggiunta di un'intestazione personalizzata.

Per modificare tutti gli override in un unico posto, modifica il file .headers in Sorgenti > Override. Qui puoi anche fare clic su Aggiungi regola di override per eseguire l'override di più richieste utilizzando caratteri jolly (*).

Modifica di tutti gli override.

Problema di Chromium: 1288023.

Miglioramenti del debug di Nuxt, Vite e Rollup

Per aiutarti a individuare più rapidamente i problemi durante il debug, la traccia dello stack avanzata ora nasconde i frame provenienti da origini generate da Nuxt 3.3 o versioni successive. DevTools ignora questi frame:

La traccia dello stack prima e dopo l'attivazione dell'elenco di ignorati di terze parti.

Per apportare questi miglioramenti, i team di DevTools, Nuxt, Vite e Rollup hanno collaborato per adottare l'estensione della mappa di origine x_google_ignoreList:

Il team di DevTools desidera esprimere la propria gratitudine ai team di Nuxt, Vite e Rollup per aver reso possibile questa funzionalità. Apprezziamo il tuo impegno e la tua collaborazione, che sono stati essenziali per il successo di questa implementazione. Grazie ancora per i tuoi contributi.

Miglioramenti CSS in Elementi > Stili

Proprietà e valori CSS non validi

Per aiutarti a diagnosticare più rapidamente i problemi CSS, il riquadro Stili ora sbarra:

  • Un'intera dichiarazione CSS (proprietà e valore) quando la proprietà CSS non è valida.
  • Solo il valore quando la proprietà CSS è valida, ma il valore non è valido.

Nome della proprietà non valido e valore della proprietà non valido.

Il team di DevTools desidera esprimere la propria gratitudine a Yisi(一丝) per l'implementazione di questo miglioramento.

Link ai fotogrammi chiave nella proprietà abbreviata dell'animazione

La proprietà CSS abbreviata animation ora contiene link alle regole @@keyframes corrispondenti, in modo da poter navigare più velocemente nel riquadro Stili.

Link ai fotogrammi chiave nella proprietà abbreviata dell'animazione.

Problema di Chromium: 1420656.

Nuova impostazione della console: completamento automatico con Invio

A partire dalla versione precedente (112), puoi configurare la console di DevTools in modo che applichi un suggerimento di completamento automatico quando premi Enter.

Per impostazione predefinita, per accettare un suggerimento di completamento automatico, puoi premere Tab o Arrow right. Per completare automaticamente anche con Enter, attiva Impostazioni. Impostazioni > Console > Casella di controllo. Accetta suggerimento di completamento automatico con Invio.

La casella di controllo corrispondente in Impostazioni.

Inoltre, il testo di un'altra impostazione è ora più intuitivo: Casella di controllo. Tratta la valutazione del codice come azione dell'utente.

Problema di Chromium: 1276960.

Il menu dei comandi mette in evidenza i file creati

La finestra di dialogo di apertura rapida nel menu dei comandi ora disattiva i file di terze parti ignorati per dare maggiore risalto ai file che hai creato.

Uno script ignorato nella finestra di dialogo di apertura rapida prima e dopo la modifica.

Problema di Chromium: 1424345.

Ritiro del Profiler di JavaScript: seconda fase

Già a partire da Chrome 58, il team di DevTools aveva pianificato di ritirare il profiler JavaScript e di invitare gli sviluppatori Node.js e Deno a utilizzare il riquadro Prestazioni per profilare le prestazioni della CPU JavaScript.

La versione 113 di DevTools inizia la fase 2 della deprecazione in quattro fasi del profiler JavaScript. Durante questa fase, puoi comunque aprire il riquadro, ma la sua UI non è più disponibile.

Per profilare le prestazioni della CPU, fai clic su Vai al riquadro Prestazioni.

Ritiro del profiler JavaScript.

Problema di Chromium: 1354548.

Punti salienti vari

Di seguito sono riportate alcune correzioni degne di nota in questa release:

  • È stato corretto un bug che causava la gestione errata dei nomi delle variabili con caratteri Unicode nella stampa in formato leggibile nel riquadro Origini (1425055).
  • La scheda Problemi ha aggiunto un nuovo messaggio per i problemi di compilazione automatica relativi ai valori HTML non standard (1399414).

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 funzionalità più recenti di DevTools, testare le API della piattaforma web all'avanguardia e trovare problemi sul tuo sito prima che lo facciano i tuoi utenti.

Contatta il team di Chrome DevTools

Utilizza le seguenti opzioni per discutere delle nuove funzionalità, degli aggiornamenti o di qualsiasi altro argomento relativo a DevTools.

Novità di DevTools

Un elenco di tutti gli argomenti trattati nella serie Novità di DevTools.