Novità di DevTools (Chrome 94)

Usa DevTools nella lingua che preferisci

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

Apri Impostazioni, seleziona la lingua che preferisci nel menu a discesa Preferenze > Lingua e ricarica DevTools.

Preferenze" width="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   Attiva/disattiva la barra degli strumenti del dispositivo e seleziona Nest Hub o Nest Hub Max nell'elenco dei dispositivi.

Dispositivo Nest Hub in modalità Dispositivo

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.

Prove dell'origine nella visualizzazione Dettagli frame

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.

Badge delle query contenitore CSS

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).

Inverti i filtri di rete

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.

Messaggio relativo al ritiro della barra laterale della console

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.

Intestazioni "Imposta cookie" non elaborate nella scheda Problemi e nel 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.

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

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.

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

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.

Maiusc + fai clic sull&#39;anteprima colore per cambiare il formato 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.

Descrizione comando DevTools

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 Altre a destra e seleziona Nascondi problemi simili per nasconderlo.

Menu contestuale sperimentale per nascondere il problema

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 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   Altre   > 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.

Chrome 127

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113

Chrome 112

Chrome 111

Chrome 110

Chrome 109

Chrome 108

Chrome 107

Chrome 106

Chrome 105

Chrome 104

Chrome - Guida introduttiva

Chrome - Guida introduttiva

Guida introduttiva di Chrome

Chrome 100

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Chrome 91

Chrome 90

Chrome 89

Chrome 88

Chrome 87

Chrome 86

Chrome 85

Chrome 84

Chrome 83

Chrome 82

Chrome 82 è stato annullato.

Chrome 81

Chrome 80

Chrome 79

Chrome 78

Chrome 77

Chrome 76

Chrome 75

Chrome 74

Chrome 73

Chrome 72

Chrome 71

Chrome 70

Chrome 68

Chrome 67

Chrome 66

Chrome 65

Chrome 64

Chrome 63

Chrome 62

Chrome 61

Chrome 60

Chrome 59