Novità di DevTools (Chrome 108)

Jecelyn Yeen

Suggerimenti per le proprietà CSS non attive

DevTools ora identifica gli stili CSS validi, ma che non hanno alcun effetto visibile. Nel riquadro Stili, DevTools nasconde in dissolvenza le proprietà non attive. Passa il mouse sopra l'icona accanto alla regola per capire perché la regola non ha alcun effetto visibile.

Problema relativo a Chromium: 1178508

Rileva automaticamente XPath e selettori di testo nel riquadro Registratore

Il riquadro Registratore ora supporta i selettori XPath e di testo. Inizia a registrare un flusso utente e il registratore sceglierà automaticamente l'XPath e il testo univoco più breve di un elemento come selettore, se disponibile.

Problemi relativi a Chromium: 1327206,1327209

Visualizzazione delle espressioni separate da virgole

Ora puoi esplorare espressioni separate da virgole durante il debug. Ciò migliora la possibilità di debug del codice minimizzato.

In precedenza, DevTools supportava solo i passaggi per le espressioni separate da punto e virgola.

Dato il codice riportato di seguito,

function foo() {}

function bar() {
  foo();
  foo();
  return 42;
}

I transpiler e i minificatori possono trasformarli in espressioni separate da virgole.

function bar(){return foo(),foo(),42}

Questo crea confusione durante il debug perché il comportamento dei passaggi è diverso tra codice minimizzato e creato. È ancora più difficile quando si utilizzano mappe di origine per eseguire il debug del codice minimizzato in termini di codice originale, in quanto lo sviluppatore sta quindi osservando i punti e virgola (che erano dietro le quinte trasformati in virgole dalla toolchain), ma il debugger non si ferma a questi.

Problema relativo a Chromium: 1370200

Impostazione dell'elenco Ignora migliorata

Vai a Impostazioni > Elenco di persone da ignorare. DevTools migliora la progettazione per aiutarti a configurare le regole in modo da ignorare un singolo script o pattern di script.

Problema relativo a Chromium: 1356517

Varie in evidenza

Di seguito sono riportate alcune importanti correzioni di questa release:

• Nome della proprietà CSS di completamento automatico nel riquadro Stili quando premi la barra spaziatrice. (1343316)
• Rimuovi lo scorrimento automatico nel breadcrumb del riquadro Elemento. (1369734)

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.