Novità di DevTools (Chrome 94)

Jecelyn Yeen

Usa DevTools nella lingua che preferisci

Chrome DevTools ora supporta più di 80 lingue, consentendoti di lavorare nella tua lingua preferita.

Apri Impostazioni, quindi seleziona la tua lingua preferita in Preferenze > Menu a discesa Lingua e ricarica DevTools.

Preferenze" larghezza="800" altezza="494">

Problema relativo a Chromium: 1163928

Nuovi dispositivi Nest Hub nell'elenco Dispositivi

Ora puoi simulare le dimensioni di Nest Hub e Nest Hub Max nella modalità Dispositivo.

Fai clic su Attiva/disattiva la barra degli strumenti dei dispositivi   e seleziona Nest Hub o Nest Hub Max nell'elenco dei dispositivi.

Problema relativo a Chromium: 1223525

Prove dell'origine nella visualizzazione Dettagli frame

Ora puoi ottenere informazioni sulle prove dell'origine di un sito nella visualizzazione dei dettagli del frame nel riquadro Applicazione.

Le prove dell'origine consentono di accedere a una funzionalità nuova o sperimentale per creare funzionalità che gli utenti possono provare per un periodo di tempo limitato prima che la funzionalità venga resa disponibile per tutti.

Apri una pagina con prove dell'origine (ad es. pagina demo). Nel riquadro Applicazione, scorri verso il basso fino alla sezione Frame e seleziona il frame superiore.

Problema relativo a Chromium: 607555

Badge per le nuove query contenitore CSS

Accanto agli elementi container (gli elementi predecessori che soddisfano i criteri delle regole at-rule di @container) viene aggiunto un nuovo badge container. Fai clic sul badge per attivare/disattivare la visualizzazione di un overlay del contenitore scelto e di tutti i relativi discendenti di query sulla pagina.

Problema relativo a Chromium: 1146422

Nuova casella di controllo per invertire i filtri di rete

Utilizza la nuova casella di controllo Inverti per invertire i filtri nel riquadro Rete.

Ad esempio, puoi digitare "status-code: 404" per filtrare le richieste di rete con stato 404. Seleziona la casella di controllo Inverti per annullare il filtro (mostra tutte le richieste di rete senza stato 404).

Problema relativo a Chromium: 1054464

Ritiro imminente della barra laterale della console

La barra laterale della console verrà rimossa per favorire lo spostamento dell'interfaccia utente del filtro sulla barra degli strumenti. Hai dubbi o feedback? Comunicacelo con lo strumento Issue Tracker.

Problema relativo a Chromium: 1232937

Visualizza intestazioni Set-Cookie non elaborate nella scheda Problemi e nel riquadro Rete

DevTools ora visualizza le intestazioni Set-Cookie non elaborate nella scheda Problemi.

In precedenza, DevTools non mostrava i cookie con formato non corretto (intestazione Set-Cookie errata) nel riquadro Rete. Con il nuovo filtro response-header-set-cookie aggiunto nel riquadro Rete, gli utenti possono filtrare la risposta dell'intestazione Set-Cookie non elaborata. DevTools collega le intestazioni Set-Cookie non elaborate della scheda Problemi al riquadro Rete.

Problema relativo a Chromium: 1179186

Mostrare in modo coerente le funzioni di accesso native come proprietà proprie nella console.

Ora la console mostra le funzioni di accesso native come proprie proprietà in modo coerente.

Ad esempio, durante la valutazione dell'espressione new Int8Array([1, 2, 3]) nella console, le funzioni di accesso native come length, byteOffset non vengono visualizzate nell'anteprima. Con questo ultimo aggiornamento, le funzioni di accesso native vengono mostrate nell'anteprima e i valori vengono valutati con estrema attenzione all'espansione.

Problemi relativi a Chromium: 1076820, 1199247

Analisi corrette dello stack degli errori per gli script in linea con #sourceURL

DevTools ora risolve gli script incorporati con #sourceURL correttamente e mostra le analisi dello stack degli errori appropriate per il debug.

In precedenza, DevTools mostrava una posizione errata per gli script incorporati con #sourceURL, in relazione al documento circostante anziché al tag <script> di apertura.

Problemi relativi a Chromium: 1183990, 578269

Modificare il formato del colore nel riquadro Calcolato

Ora puoi modificare il formato del colore di qualsiasi elemento nel riquadro Elaborato premendo Maiusc e facendo clic sull'anteprima del colore.

Problema relativo a Chromium: 1226371

Sostituisci le descrizioni comando personalizzate con descrizioni comando HTML native

DevTools ora adotta le descrizioni comando HTML native in tutti i componenti. DevTools è passato molto tempo a implementare la descrizione comando personalizzata a causa della mancanza di stile di una descrizione comando HTML nativa.

Purtroppo, gestire un'implementazione di descrizione comando personalizzata è complicato e riscontriamo regolarmente bug complicati.

Dopo aver ponderato nuovamente i vantaggi delle implementazioni personalizzate, abbiamo riscontrato che le descrizioni comando HTML native sono sufficienti per DevTools e che l'adozione delle descrizioni comando evita un'ampia varietà di problemi per i nostri utenti.

Problema relativo a Chromium: 1223391

[Sperimentale] Nascondi problemi nella scheda Problemi

Attiva l'esperimento del menu Nascondi problemi per nascondere i problemi nella scheda Problemi. In questo modo, puoi concentrarti sulle questioni importanti che ti interessano.

Nella scheda Problema, passa il mouse sopra un problema, fai clic sul menu del problema a destra e seleziona Nascondi problemi simili per nasconderlo.

Problema relativo a Chromium: 1175722

Scaricare i canali in anteprima

Prendi in considerazione l'utilizzo di Chrome Canary, Dev o Beta come browser di sviluppo predefinito. Questi canali in anteprima ti consentono di accedere alle funzionalità più recenti di DevTools, testare le API delle piattaforme web all'avanguardia e 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 utilizzando 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.

Novità di DevTools

Un elenco di tutto ciò che è stato trattato nella serie Novità di DevTools.