Scopri in che modo DevTools riduce la digitazione grazie al completamento automatico della console più intelligente, come modificare le regole @keyframe
direttamente nel riquadro Stili, come divertirti con le variabili personalizzate CSS e come unirti al lato oscuro.
Un completamento automatico più intelligente nella tua console
Se sei come me e molti altri, digita un comando nella console per eseguire il debug della tua app, vederla non funzionante, eseguire l'iterazione e digitarla ancora e ancora. Per aiutarti, stiamo completando automaticamente le dichiarazioni complete che hai digitato in precedenza, ad esempio:
Modificare direttamente le regole @keyframe nel riquadro Stili
Quando abbiamo introdotto lo strumento di controllo delle animazioni e l'editor di easing in DevTools, erano limitati alle transizioni perché non abbiamo mai mostrato animazioni CSS basate su @keyframe
nel riquadro Stile. Sono felice di dire che ora è una cosa del passato, quindi scatenati! Guarda il nostro tweet video per un'anteprima.
Supporto delle proprietà CSS personalizzate
I CSS presentano molte funzioni avanzate, tra cui le variabili personalizzate, che verranno lanciate con Chrome 49. Ci siamo assicurati di includere il supporto completo in DevTools, quindi se hai già usato variabili in Sass, prova quelle native, che ti consentono di modificare all'istante le proprietà nel riquadro Stili e aggiornare immediatamente gli elementi dipendenti.
Un tema scuro per DevTools
Alla fine abbiamo ceduto a una richiesta che abbiamo sentito decine di volte negli ultimi due anni: ora puoi scegliere il lato oscuro in DevTools. Vai alle impostazioni di DevTools, imposta il tema scuro e goditi il momento. Direi che questo è ancora in versione beta, poiché in gran parte vengono generati automaticamente, quindi se noti aree che potrebbero essere migliorati, non esitare a comunicarcelo.
Il meglio del resto
- Il riquadro a scomparsa della console ora si comprime automaticamente quando fai clic sulla scheda Console completa.
- La struttura dei file in Sorgenti è stata migliorata con nuove icone e nuove funzionalità di raggruppamento
Come sempre, facci sapere cosa ne pensi tramite Twitter o nei commenti qui sotto e invia i bug a crbug.com/new.
Al prossimo mese!
Paul Bakaus e il team DevTools