Sofia Emelianova
Déboguer CSS avec Gemini
Les outils pour les développeurs Chrome disposent d'un nouveau panneau expérimental d'aide à l'IA dans lequel vous pouvez discuter avec Gemini et obtenir de l'aide pour déboguer votre CSS.
Suivez-le maintenant ! Dans le panneau Éléments, effectuez un clic droit sur un élément, puis sélectionnez Ask AI (Demander à l'IA) ou cliquez sur le bouton correspondant à côté de l'élément. Les outils de développement ouvriront le nouveau panneau Aide à l'IA.
correspondant à côté de l'élément. Les outils de développement ouvriront le nouveau panneau Aide à l'IA.
Le nouveau panneau vous invite à activer le paramètre correspondant. Assurez-vous de remplir les conditions requises, activez le paramètre, puis revenez au panneau Assistance par l'IA. L'élément sélectionné sera utilisé comme contexte. Saisissez votre question concernant l'élément.
Pour en savoir plus sur l'utilisation optimale du nouveau panneau, consultez 5 Cool Things To Do with DevTools AI Assistance (Assistance IA pour les outils de développement), ainsi que l'assistance IA pour la stylisation.
L'équipe DevTools a hâte de recevoir vos commentaires. N'hésitez pas à le laisser dans crbug.com/364805393.
Contrôlez les fonctionnalités d'IA dans un onglet "Paramètres" dédié
Vous pouvez désormais gérer toutes les fonctionnalités d'IA au même endroit: dans les nouveaux Paramètres > onglet Innovations en matière d'IA. Il liste les points importants à prendre en compte, décrit les fonctionnalités d'IA et vous permet de les activer et de les désactiver individuellement.
onglet Innovations en matière d'IA. Il liste les points importants à prendre en compte, décrit les fonctionnalités d'IA et vous permet de les activer et de les désactiver individuellement.
Pour en savoir plus, accédez à Paramètres > Innovations IA.
Console Insights accessibles en un clic
Les outils de développement ne nécessitent plus de synchronisation des paramètres pour les fonctionnalités d'IA. Ainsi, les insights de la console, ainsi que l'assistance IA pour les styles, sont accessibles en un clic.
Si vous êtes connecté à Chrome, activez ces fonctionnalités dans Paramètres > Innovations IA.
Améliorations apportées au panneau "Performances"
Cette version apporte un certain nombre d'améliorations au panneau Performances.
Annoter et partager les données sur les performances
Le nouvel onglet Annotations du panneau Performances est disponible dans une barre latérale à gauche que vous pouvez développer. Il simplifie le processus de création de notes pour l'exploration des traces et la collaboration lors du partage des résultats des performances.
Vous pouvez désormais étiqueter et relier des événements à l'aide de flèches, et mettre en surbrillance des périodes directement sur la trace. Vous pouvez ensuite enregistrer, partager et importer les traces annotées dans le panneau Performances.
Obtenez des informations sur les performances directement dans le panneau "Performances".
Vous pouvez désormais découvrir des insights pratiques dans le nouvel onglet Insights de la barre latérale gauche du panneau Performances. Les insights sont consolidés à partir du rapport Lighthouse et du panneau Informations sur les performances, qui est sur le point d'être abandonné.
L'onglet Insights est conçu pour fournir une analyse guidée et suggérer des insights exploitables concernant les problèmes de performances susceptibles de ralentir votre site Web. Pour utiliser les insights, ouvrez l'onglet dans la barre latérale gauche du panneau Performances, développez différentes catégories, puis pointez et cliquez sur les éléments. Le panneau Performances met en surbrillance les événements correspondants dans la trace.
L'équipe DevTools attend avec impatience vos commentaires sur l'utilité des insights, les moyens de les améliorer et votre utilisation avec d'autres outils, tels que PageSpeed Insights et Lighthouse. N'hésitez pas à nous faire part de vos commentaires sur crbug.com/371170842.
Repérer plus facilement les changements de mise en page excessifs
La piste Décalages de mise en page fait peau neuve. Les décalages de mise en page sont désormais marqués de losanges violets (plus visibles) et regroupés en clusters en fonction de leur proximité dans la chronologie. Les équipes et leurs groupes obtiennent un tableau organisé avec les temps, les scores, les éléments et les coupables potentiels dans l'onglet Résumé.
De plus, la vue des métriques en direct affiche le journal des déplacements de mise en page avec des scores et des éléments à côté de l'onglet Interactions.
Problème Chromium : 369100729.
Repérer les animations non composées
La piste Animations affiche désormais des informations utiles sur les animations non composées:
- Nomme les animations en fonction de la propriété CSS correspondante, le cas échéant.
- Marque les animations non composées par des triangles rouges sur la piste.
- Indique la raison de l'échec de la composition dans l'onglet Résumé.
Pour en savoir plus, consultez S'en tenir aux propriétés réservées au moteur de composition et gérer le nombre de calques.
Problème Chromium : 41006273.
La simultanéité matérielle passe aux capteurs
Le paramètre Simultanéité matérielle est déplacé du panneau Performances vers un emplacement plus approprié : le panneau Capteurs.
Problème Chromium : 371463665.
Ignorer les scripts anonymes et se concentrer sur votre code dans les traces de la pile
Les traces de pile dans la console détectent, ignorent, réduisent et (si elles sont développées) grisent désormais correctement les cadres provenant de fichiers figurant sur la liste d'ignorement. Auparavant, le nom de la fonction n'était pas grisé dans la trace développée.
Vous pouvez également activer les nouveaux Settings (Paramètres) > Ignore list (Liste d'ignorement) > (case à cocher) Anonymous scripts from eval or console (Scripts anonymes à partir d'eval ou de la console) pour que DevTools ignore les scripts anonymes sans URL source.
De plus, lorsque vous effectuez un clic droit et que vous enregistrez sous le journal de la console, le texte Afficher plus/moins n'est pas enregistré.
Problèmes Chromium: 40279542, 40945570, 345248263
Éléments > Styles: prise en charge des modes d'écriture sideways-* pour les superpositions de grille et les mots clés à l'échelle du CSS
L'onglet Éléments > Styles accepte désormais les éléments suivants:
- La superposition de grille dans le viewport affiche désormais des grilles pour les modes d'écriture
sideways-rletsideways-lr. - Résout les mots clés à l'échelle de la CSS. En pratique, cela signifie que, par exemple, si
inheritest une couleur, l'onglet Styles affiche un sélecteur de couleur à côté.
Problèmes Chromium: 40280717, 40706051, 40501131
Audits Lighthouse pour les pages non HTTP en mode période et instantané
Lighthouse peut désormais générer des rapports pour les pages non HTTP en mode période et instantané.
Accessibilité
Cette version comporte les améliorations d'accessibilité suivantes:
- Dans Sources > Éditeur, vous pouvez désormais fermer les onglets contenant des fichiers ouverts en sélectionnant le bouton X et en appuyant sur Entrée ou Espace.
- Dans Performances, vous pouvez désormais sélectionner une entrée dans la trace et appuyer sur Espace pour ouvrir le menu contextuel.
- Dans Performances, l'onglet Insights de la barre latérale de gauche est accessible au clavier et peut être parcouru à l'aide des onglets.
Problème Chromium: 372411090.
Points importants divers
Voici quelques corrections et améliorations importantes apportées à cette version :
- Les paramètres de limitation sont désormais correctement synchronisés entre les panneaux Performances et Réseau (370332090).
- Application > Services d'arrière-plan > Chargements spéculatifs > Règles dispose désormais d'un bouton d'impression élégante
{}semblable à Sources > Éditeur (40279147). - Expressions dynamiques : lorsque vous appuyez sur Tabulation après avoir sélectionné une option de saisie semi-automatique, vous quittez désormais le champ de modification au lieu d'indenter le texte (349939551).
- Éléments > Styles :
anchor()etanchor-size()acceptent une nouvelle syntaxe qui vous permet de réorganiser les arguments et d'omettre la directionanchor-size()(343516786). En outre, correction de l'affichage de remplacement (365802559). - Réseau: correction des aperçus GraphQL (369931288).
- Performances: signale désormais la progression incrémentielle du chargement et du traitement des traces.
- WebAuthn : les identifiants modifiés par les méthodes
signal*sont désormais mis à jour de manière dynamique (368467199). - WebAssembly: un avertissement dans la console vous informe désormais si plusieurs symboles de débogage sont disponibles pour un module WebAssembly et lequel est utilisé (40879198, 369515221).
- La superposition Core Web Vitals est supprimée de l'onglet Rendu 328487897.
- Les fonctionnalités d'IA générative ne nécessitent plus la synchronisation des paramètres Chrome.
Télécharger les canaux de prévisualisation
Envisagez d'utiliser Chrome Canary, Dev ou Bêta comme navigateur de développement par défaut. Ces canaux de prévisualisation vous donnent accès aux dernières fonctionnalités de DevTools, vous permettent de tester les API de plates-formes Web de pointe et vous aident à détecter les problèmes sur votre site avant vos utilisateurs.
Contacter l'équipe des outils pour les développeurs Chrome
Utilisez les options suivantes pour discuter des nouvelles fonctionnalités, des mises à jour ou de tout autre sujet lié aux outils de développement.
- Envoyez-nous vos commentaires et vos demandes de fonctionnalités sur crbug.com.
- Signalez un problème dans les outils de développement à l'aide de l'icône Plus d'options > Aide > Signaler un problème dans les outils de développement dans les outils de développement.
- Tweetez à l'adresse @ChromeDevTools.
- Laissez des commentaires sur les vidéos YouTube sur les nouveautés dans les outils de développement ou sur les vidéos YouTube de conseils sur les outils de développement.
Nouveautés des outils de développement
Liste de tous les sujets abordés dans la série Nouveautés concernant les outils de développement
- Déboguer CSS avec Gemini
- Contrôler les fonctionnalités d'IA dans un onglet de paramètres dédié
- Améliorations du panneau "Performances"
- Annoter et partager les informations sur les performances
- Obtenir des informations sur les performances directement dans le panneau "Performances"
- Repérer plus facilement les décalages de mise en page excessifs
- Repérer les animations non composées
- La simultanéité matérielle passe aux capteurs
- Ignorer les scripts anonymes et vous concentrer sur votre code dans les traces de la pile
- Éléments > Styles : prise en charge des modes d'écriture sideways-* pour les superpositions de grilles et les mots clés CSS globaux
- Audits Lighthouse pour les pages non HTTP en mode période et instantané
- Améliorations liées à l'accessibilité
- Informations importantes
- Améliorations du panneau "Réseau"
- Filtres réseau repensés
- Les exportations HAR excluent désormais les données sensibles par défaut
- Améliorations apportées au panneau "Éléments"
- Valeurs de saisie semi-automatique pour les propriétés d'accentuation du texte*
- Dépassement de défilement signalé par un badge
- Améliorations apportées au panneau "Performances"
- Recommandations dans les métriques en temps réel
- Parcourir les fils d'Ariane
- Améliorations du panneau "Mémoire"
- Nouveau profil "Éléments dissociés"
- Amélioration de la dénomination des objets JavaScript simples
- Désactiver la thématisation dynamique
- Test Chrome : partage de processus
- Lighthouse 12.2.1
- Informations importantes
- L'Enregistreur est compatible avec l'exportation vers Puppeteer pour Firefox
- Améliorations apportées au panneau "Performances"
- Observations en temps réel sur les métriques
- Requêtes de recherche dans le canal réseau
- Consulter les traces de la pile des appels performance.mark et performance.measure
- Utiliser les données d'adresse de test dans le panneau de saisie automatique
- Améliorations apportées au panneau des éléments
- Forcer davantage d'états pour des éléments spécifiques
- La fonctionnalité Éléments > Styles permet désormais la saisie semi-automatique d'autres propriétés de la grille
- Lighthouse 12.2.0
- Divers
- Les insights sur la console Gemini sont disponibles dans la plupart des pays européens
- Mises à jour du panneau "Performances"
- Suivi réseau amélioré
- Personnaliser les données de performances avec l'API d'extensibilité
- Informations sur le suivi des temps
- Copier toutes les requêtes listées dans le panneau "Network" (Réseau)
- Instantanés de segments de mémoire plus rapides avec des balises HTML nommées et moins encombré
- Ouvrez le panneau "Animations" pour capturer des animations et modifier les @keyframes en direct
- Lighthouse 12.1.0
- Améliorations de l'accessibilité
- Divers
- Inspecter le positionnement des ancres CSS dans le panneau "Éléments"
- Améliorations apportées au panneau "Sources"
- Amélioration de la fonctionnalité "Ne jamais suspendre ici"
- Nouveaux écouteurs d'événements d'accrochage du défilement
- Améliorations du panneau "Réseau"
- Mises à jour des préréglages de limitation de la bande passante réseau
- Informations sur le service worker dans les champs personnalisés du format HAR
- Envoyer et recevoir des événements WebSocket dans le panneau "Performances"
- Divers
- Améliorations apportées au panneau "Performances"
- Déplacer et masquer des pistes avec le nouveau mode de configuration des pistes
- Ignorer les scripts dans le graphique de flammes
- Limiter le CPU de 20 fois
- Le panneau "Insights sur les performances" va être abandonné
- Détecter une utilisation excessive de la mémoire à l'aide de nouveaux filtres dans les instantanés de segments de mémoire
- Inspecter les buckets de stockage dans Application > Stockage
- Désactiver les avertissements auto-XSS à l'aide d'une option de ligne de commande
- Lighthouse 12.0.0
- Informations importantes
- Mieux comprendre les erreurs et les avertissements dans la console avec Gemini
- Prise en charge des règles@position-try dans Éléments > Styles
- Améliorations apportées au panneau "Sources"
- Configurer l'affichage soigné automatique et la fermeture des crochets
- Les promesses refusées gérées sont reconnues comme détectées
- Causes d'erreur dans la console
- Améliorations du panneau "Réseau"
- Inspecter les en-têtes des indications précoces
- Masquer la colonne Waterfall
- Améliorations apportées au panneau "Performances"
- Capturer les statistiques du sélecteur CSS
- Modifier l'ordre et masquer des pistes
- Ignorer les éléments de conservation dans le panneau "Mémoire"
- Lighthouse 11.7.1
- Divers
- Nouveau panneau de saisie automatique
- Limitation de la bande passante réseau améliorée pour WebRTC
- Compatibilité avec les animations liées au défilement dans le panneau "Animations"
- Amélioration de la prise en charge de l'imbrication CSS dans Éléments > Styles
- Panneau "Performances améliorées"
- Masquer les fonctions et leurs enfants dans le graphique de type "flamme"
- Flèches des initiateurs sélectionnés vers les événements qu'ils ont déclenchés
- Lighthouse 11.6.0
- Info-bulles pour les catégories spéciales dans Mémoire > Instantanés de tas de mémoire
- Application > Mises à jour de l'espace de stockage
- Octets utilisés pour le stockage partagé
- Web SQL est complètement obsolète
- Améliorations apportées au panneau de couverture
- Le panneau des calques risque d'être abandonné
- Abandon du profileur JavaScript : phase 4, finale
- Informations importantes
- Trouver l'œuf de Pâques
- Mises à jour du panneau "Éléments"
- Émuler une page sélectionnée dans Éléments > Styles
- Sélecteur de couleur, Horloge à angle et Éditeur de lissage de vitesse dans les créations de remplacement
var() - L'outil de longueur CSS est obsolète
- Pop-over du résultat de recherche sélectionné dans Performances > Titre principal
- Mises à jour du panneau "Network" (Réseau)
- Bouton "Effacer" et filtre de recherche dans l'onglet "Réseau > EventStream"
- Info-bulles pour les motifs d'exception pour les cookies tiers dans Réseau > Cookies
- Activer et désactiver tous les points d'arrêt dans les sources
- Afficher les scripts chargés dans les outils de développement pour Node.js
- Lighthouse 11.5.0
- Améliorations liées à l'accessibilité
- Divers
- La collection officielle d'extensions de l'Enregistreur est disponible
- Améliorations du réseau
- Motif de l'échec dans la colonne "État"
- Sous-menu "Copier" amélioré
- Amélioration des performances
- Fils d'Ariane dans Vos trajets
- Initiateurs d'événements dans le canal principal
- Menu de sélection des instances de VM JavaScript pour les outils de développement Node.js
- Nouveau raccourci et nouvelle commande dans "Sources"
- Améliorations apportées aux éléments
- Vous pouvez désormais modifier le pseudo-élément ::view-transition dans "Styles"
- Compatibilité de la propriété align-content avec les conteneurs de blocs
- Compatibilité avec les positions des appareils pliables émulés
- Thématisation dynamique
- Avertissements d'arrêt progressif des cookies tiers dans les panneaux "Réseau" et "Application"
- Lighthouse 11.4.0
- Améliorations de l'accessibilité
- Divers
- Améliorations apportées aux éléments
- Barre de filtre simplifiée dans le panneau "Network"
- Compatibilité
@font-palette-values - Cas accepté : propriété personnalisée comme solution de remplacement d'une autre propriété personnalisée
- Compatibilité améliorée avec les cartes sources
- Améliorations du panneau "Performances"
- Suivi avancé des interactions
- Filtrage avancé dans les onglets "Ascendant", "Arborescence d'appels" et "Journal des événements"
- Repères de retrait dans le panneau "Sources"
- Info-bulles utiles pour les en-têtes et le contenu remplacés dans le panneau "Network"
- Nouvelles options du menu de commande pour ajouter et supprimer des schémas de blocage des requêtes
- Le test sur les cas de non-respect du CSP est supprimé
- Lighthouse 11.3.0
- Améliorations liées à l'accessibilité
- Informations importantes
- Suppression progressive des cookies tiers
- Analyser les cookies de votre site Web avec Privacy Sandbox Analysis Tool
- Ignorer la fiche améliorée
- Modèle d'exclusion par défaut pour node_modules
- Les exceptions détectées arrêtent désormais l'exécution si elles sont détectées ou transmises par du code non ignoré
x_google_ignoreListrenomméignoreListdans les mappages source- Nouveau bouton d'activation/de désactivation du mode de saisie lors du débogage à distance
- Le panneau "Éléments" affiche désormais les URL des nœuds #document
- Règle appliquée en matière de sécurité du contenu dans le panneau "Application"
- Amélioration du débogage des animations
- Boîte de dialogue "Faites-vous confiance à ce code ?" dans "Sources" et avertissement auto-XSS dans la console
- Points d'arrêt des écouteurs d'événements dans les workers Web et les Worklets
- Nouveau badge média pour
<audio>et<video> - Préchargement renommé en chargement spéculatif
- Lighthouse 11.2.0
- Améliorations de l'accessibilité
- Informations importantes
- Amélioration de la section @property dans Éléments > Styles
- Règle @property modifiable
- Les problèmes liés aux règles @property non valides sont signalés
- Mise à jour de la liste des appareils à émuler
- Faire une mise en forme élégante du code JSON dans les tags de script dans la section "Sources"
- Saisie semi-automatique des champs privés dans la console
- Lighthouse 11.1.0
- Améliorations de l'accessibilité
- Abandon de Web SQL
- Validation du format des captures d'écran dans "Application > Fichier manifeste"
- Divers
- Nouvelle section pour les propriétés personnalisées dans Éléments > Styles
- Améliorations supplémentaires apportées aux forçages locaux
- Recherche améliorée
- Amélioration du panneau "Sources"
- Espace de travail simplifié dans le panneau "Sources"
- Réorganiser les volets dans "Sources"
- Mise en surbrillance de la syntaxe et mise en forme pour plus de types de scripts
- Émuler la caractéristique média prefers-reduced-transparency
- Lighthouse 11
- Améliorations de l'accessibilité
- Divers
- Améliorations du panneau "Réseau"
- Remplacer le contenu Web localement encore plus rapidement
- Remplacer le contenu de XHR et récupérer des requêtes
- Masquer les requêtes des extensions Chrome
- Codes d'état HTTP lisibles par l'humain
- Paramètres des sources activés par défaut : repliage du code et affichage automatique des fichiers
- Amélioration du débogage des problèmes liés aux cookies tiers
- Nouveaux coloris
- Lighthouse 10.4.0
- Déboguer le préchargement dans le panneau "Application"
- L'extension de débogage WebAssembly C/C++ pour les outils de développement est désormais Open Source
- Divers
- (Expérimental) Nouvelle émulation de rendu: preferences-reduced-transparency
- (Expérimental) Surveillance améliorée du protocole
- Amélioration du débogage des feuilles de style manquantes
- Prise en charge des codes temporels linéaires dans Éléments > Styles > Éditeur de lissage de vitesse
- Compatibilité avec les buckets de stockage et vue des métadonnées
- Lighthouse 10.3.0
- Accessibilité : commandes au clavier et lecture à l'écran améliorée
- Informations importantes
- Améliorations apportées aux éléments
- Nouveau badge de sous-grille CSS
- Spécificité du sélecteur dans les info-bulles
- Valeurs des propriétés CSS personnalisées dans les info-bulles
- Améliorations apportées aux sources
- Mise en surbrillance de la syntaxe CSS
- Raccourci pour définir des points d'arrêt conditionnels
- Application > Mesures d'atténuation du suivi des rebonds
- Lighthouse 10.2.0
- Ignorer les scripts de contenu par défaut
- Réseau > Améliorations de la réponse
- Divers
- Assistance au débogage WebAssembly
- Amélioration du comportement des pas effectués dans les applications Wasm
- Déboguer la saisie automatique à l'aide du panneau "Éléments" et de l'onglet "Problèmes"
- Assertions dans l'Enregistreur
- Lighthouse 10.1.1
- Améliorations des performances
- performance.mark() affiche le temps au survol dans Performances > Temps
- la commande profile() remplit Performances > Principal.
- Avertissement concernant les interactions utilisateur lentes
- Mises à jour de Web Vitals
- Abandon du profileur JavaScript : phase 3
- Informations importantes
- Forcer les en-têtes de réponse réseau
- Améliorations du débogage de Nuxt, Vite et Rollup
- Améliorations CSS dans Éléments > Styles
- Propriétés et valeurs CSS non valides
- Liaisons vers les images clés dans la propriété abrégée d'animation
- Nouveau paramètre de la console: saisie semi-automatique lors de la saisie
- Le menu de commandes met en avant les fichiers créés
- Abandon du profileur JavaScript : deuxième étape
- Informations importantes
- Mises à jour de l'Enregistreur
- Extensions de rediffusion de l'Enregistreur
- Enregistrer avec des sélecteurs Pierce
- Exporter des enregistrements sous forme de scripts Puppeteer grâce à l'analyse Lighthouse
- Télécharger les extensions pour l'Enregistreur
- Éléments > Mises à jour des styles
- Documentation CSS dans le volet "Styles"
- Prise en charge de l'imbrication CSS
- Marquer des points de journalisation et des points d'arrêt conditionnels dans la console
- Ignorer les scripts non pertinents lors du débogage
- Début de l'abandon du profileur JavaScript
- Émuler le contraste réduit
- Lighthouse 10
- Divers
- Déboguer la couleur HD avec le volet "Styles"
- Amélioration de l'expérience utilisateur des points d'arrêt
- Raccourcis personnalisables de l'Enregistreur
- Meilleure mise en surbrillance de la syntaxe pour Angular
- Réorganiser les caches dans le panneau "Application"
- Divers
- Suppression du panneau "Performances" lors de l'actualisation
- Informations sur l'enregistreur
- Afficher et mettre en surbrillance le code de votre parcours utilisateur dans l'enregistreur
- Personnaliser les types de sélecteurs d'un enregistrement
- Modifier le parcours utilisateur pendant l'enregistrement
- Affichage automatique au format "pretty print"
- Mise en surbrillance de la syntaxe améliorée et aperçu intégré pour Vue, SCSS et plus encore
- Saisie semi-automatique ergonomique et cohérente dans la console
- Informations importantes
- Enregistreur: copie en tant qu'options pour les étapes, relecture sur la page, menu contextuel des étapes
- Afficher les noms des fonctions réelles dans les enregistrements de performances
- Nouveaux raccourcis clavier dans le panneau "Console et sources"
- Débogage JavaScript amélioré
- Informations importantes
- [Expérimental] Amélioration de l'expérience utilisateur dans la gestion des points d'arrêt
- [Expérimental] Impression automatique sur place
- Conseils pour les propriétés CSS inactives
- Détection automatique des chemins XPath et des sélecteurs de texte dans le panneau "Enregistreur"
- Examiner les expressions séparées par une virgule
- Amélioration du paramètre "Liste d'éléments ignorés"
- Informations importantes
- Personnaliser les raccourcis clavier dans DevTools
- Basculer entre les thèmes clair et sombre à l'aide du raccourci clavier
- Mettre en surbrillance des objets C/C++ dans l'outil d'inspection de la mémoire
- Compatibilit�� avec les informations complètes sur l'initiateur pour l'importation de fichiers HAR
- Lancer une recherche DOM après avoir appuyé sur
Enter - Afficher les icônes
startetendpour les propriétés Flexbox CSSalign-content - Informations importantes
- Regrouper les fichiers par créés/déployés dans le panneau "Sources"
- Traces de pile associées pour les opérations asynchrones
- Ignorer automatiquement les scripts tiers connus
- Amélioration de la pile d'appels lors du débogage
- Masquer les sources de la liste des éléments à ignorer dans le panneau "Sources"
- Masquage des fichiers de la liste des éléments à ignorer dans le menu de commandes
- Nouveau canal "Interactions" dans le panneau "Performances"
- Répartition des délais de LCP dans le panneau "Informations sur les performances"
- Générer automatiquement un nom par défaut pour les enregistrements dans le panneau "Enregistreur"
- Divers
- Rediffusion étape par étape dans l'Enregistreur
- Prise en charge des événements de survol avec la souris dans le panneau "Enregistreur"
- Largest Contentful Paint (LCP) dans le panneau "Insights sur les performances"
- Identifier les clignotements de texte (FOIT, FOUT) comme causes potentielles des décalages de mise en page
- Gestionnaires de protocoles dans le volet "Fichier manifeste"
- Badge de la couche supérieure dans le panneau "Elements"
- Joindre des informations de débogage Wasm au moment de l'exécution
- Compatibilité avec la modification en temps réel lors du débogage
- Afficher et modifier les règles @scope at dans le volet "Styles"
- Améliorations apportées aux cartes sources
- Divers
- Redémarrer le frame pendant le débogage
- Options de ralenti dans le panneau "Enregistreur"
- Créer une extension pour le panneau "Enregistreur"
- Regrouper les fichiers par "Créés / Déployés" dans le panneau "Sources"
- Nouvelle trace "Temps utilisateur" dans le panneau "Insights sur les performances"
- Afficher l'emplacement attribué à un élément
- Simuler la simultanéité matérielle pour les enregistrements de performances
- Prévisualiser la valeur qui n'est pas une couleur lors de la saisie semi-automatique des variables CSS
- Identifier les frames bloquants dans le volet du cache amélioré
- Amélioration des suggestions de saisie semi-automatique pour les objets JavaScript
- Améliorations apportées aux cartes sources
- Divers
- Capturer les événements de double-clic et de clic droit dans le panneau "Enregistreur"
- Nouveaux modes de période et d'instantané dans le panneau Lighthouse
- Amélioration de la commande de zoom dans le panneau "Insights sur les performances"
- Confirmer la suppression d'un enregistrement de performances
- Réorganiser les volets dans le panneau "Éléments"
- Choisir une couleur en dehors du navigateur
- Amélioration de l'aperçu de la valeur intégrée lors du débogage
- Prendre en charge les blobs volumineux pour les authentificateurs virtuels
- Nouveaux raccourcis clavier dans le panneau "Sources"
- Améliorations apportées aux cartes sources
- Fonctionnalité en version preview: Nouveau panneau "Informations sur les performances"
- Nouveaux raccourcis pour émuler les thèmes clair et sombre
- Amélioration de la sécurité dans l'onglet "Aperçu du réseau"
- Amélioration de la recharge au point d'arrêt
- Mises à jour de la console
- Annuler l'enregistrement du parcours utilisateur dès le début
- Afficher les pseudo-éléments de mise en surbrillance hérités dans le volet "Styles"
- Divers
- [Expérimental] Copier les modifications CSS
- [Expérimental] Sélectionner une couleur en dehors du navigateur
- Importer et exporter des flux utilisateur enregistrés sous forme de fichier JSON
- Afficher les calques en cascade dans le volet "Styles"
- Compatibilité avec la fonction de couleur
hwb() - Amélioration de l'affichage des propriétés privées
- Informations importantes
- [Expérimental] Nouveaux modes de période et d'instantané dans le panneau Lighthouse
- Afficher et modifier les @prises au niveau des règles dans le volet "Styles"
- Compatibilité avec les sélecteurs courants par défaut
- Personnaliser le sélecteur d'enregistrement
- Renommer un enregistrement
- Prévisualiser les propriétés de classe ou de fonction par simple survol de la souris
- Frames partiellement présentés dans le panneau "Performances"
- Informations importantes
- Limiter les requêtes WebSocket
- Nouveau volet de l'API Reporting dans le panneau "Application"
- Prise en charge de l'attente jusqu'à ce que l'élément soit visible/cliquable dans le panneau de l'Enregistreur
- Amélioration du style, de la mise en forme et du filtrage de la console
- Déboguer une extension Chrome avec des fichiers de mappage de sources
- Amélioration de l'arborescence des dossiers sources dans le panneau "Sources"
- Afficher les fichiers sources du worker dans le panneau "Sources"
- Mises à jour du thème sombre automatique dans Chrome
- Sélecteur de couleur et volet fractionné conviviaux pour les écrans tactiles
- Divers
- Fonctionnalité en preview: Arborescence d'accessibilité pleine page
- Des modifications plus précises dans l'onglet "Modifications"
- Définir un délai d'inactivité plus long pour l'enregistrement du parcours utilisateur
- Vérifier que vos pages peuvent être mises en cache avec l'onglet "Cache amélioré"
- Nouveau filtre du volet "Propriétés"
- Émuler la caractéristique média CSS "forced-colors"
- Commande "Afficher les règles au passage du pointeur"
- Compatibilité avec
row-reverseetcolumn-reversedans l'éditeur Flexbox - Nouveaux raccourcis clavier pour relancer XHR et développer tous les résultats de recherche
- Lighthouse 9 dans le panneau Lighthouse
- Amélioration du panneau "Sources"
- Informations importantes
- [Expérimental] Points de terminaison dans le volet de l'API Reporting
- Fonctionnalité en preview: nouveau panneau "Enregistreur"
- Actualiser la liste des appareils en mode Appareil
- Saisie semi-automatique avec Modifier au format HTML
- Amélioration de l'expérience de débogage du code
- Synchroniser les paramètres des outils de développement sur plusieurs appareils
- Fonctionnalité en preview: nouveau panneau "Aperçu du CSS"
- Restauration et amélioration de la modification et de la copie de la longueur CSS
- Émuler la caractéristique média "préférences-contrast" du CSS
- Émuler la fonctionnalité de thème sombre automatique de Chrome
- Copier des déclarations en tant que code JavaScript dans le volet "Styles"
- Nouvel onglet "Charge utile" dans le panneau "Réseau"
- Amélioration de l'affichage des propriétés dans le volet "Propriétés"
- Option permettant de masquer les erreurs CORS dans la console
- Aperçu et évaluation appropriés des objets
Intldans la console - Traces de pile asynchrones cohérentes
- Conserver la barre latérale de la console
- Volet de cache d'application obsolète dans le panneau "Application"
- [Expérimental] Nouveau volet "API Reporting" dans le panneau "Application"
- Nouveaux outils de création de longueurs CSS
- Masquer les problèmes dans l'onglet "Problèmes"
- Amélioration de l'affichage des établissements
- Lighthouse 8.4 dans le panneau Lighthouse
- Trier les extraits dans le panneau "Sources"
- Nouveaux liens vers les notes de version traduites et signalement d'un bug de traduction
- Amélioration de l'interface utilisateur du menu de commande des outils de développement
- Utiliser les outils pour les développeurs dans votre langue préférée
- Nouveaux appareils Nest Hub dans la liste des appareils
- Phases d'évaluation dans la vue "Détails du frame"
- Nouveau badge "Requêtes de conteneur CSS"
- Nouvelle case à cocher pour inverser les filtres réseau
- Abandon prochain de la barre latérale de la console
- Affichage des en-têtes
Set-Cookiesbruts dans l'onglet "Issues" (Problèmes) et le panneau "Network" (Réseau) - Affichage cohérent des accesseurs natifs en tant que propriétés dans la console
- Traces de pile d'erreur appropriées pour les scripts intégrés avec #sourceURL
- Modifier le format de couleur dans le volet "Calculé"
- Remplacer les info-bulles personnalisées par des info-bulles HTML natives
- [Expérimental] Masquer les problèmes dans l'onglet "Problèmes"
- Requêtes de conteneur CSS modifiables dans le volet "Styles"
- Aperçu du bundle Web dans le panneau "Réseau"
- Débogage de l'API Attribution Reporting
- Meilleure gestion des chaînes dans la console
- Amélioration du débogage CORS
- Lighthouse 8.1
- URL de la nouvelle note dans le volet "Fichier manifeste"
- Correction des sélecteurs de correspondance CSS
- Affichage mis en forme des réponses JSON dans le panneau "Network" (Réseau)
- Éditeur de grille CSS
- Prise en charge des redéclarations de
constdans la console - Visionneuse de l'ordre des sources
- Nouveau raccourci pour afficher les détails du cadre
- Compatibilité améliorée avec le débogage CORS
- Renommer l'étiquette XHR en Fetch/XHR
- Filtrer le type de ressource Wasm dans le panneau "Network"
- Hints client user-agent pour les appareils dans l'onglet "Conditions du réseau"
- Signaler des problèmes liés au mode Quirks dans l'onglet "Problèmes"
- Inclure les intersections de calcul dans le panneau "Performances"
- Lighthouse 7.5 dans le panneau Lighthouse
- Menu contextuel "Redémarrer le cadre" obsolète dans la pile d'appel
- [Expérimental] Moniteur de protocole
- [Expérimental] Enregistreur Puppeteer
- Fenêtre pop-up d'informations sur les métriques Web Vitals
- Nouvel outil d'inspection de mémoire
- Visualiser le scroll-snap CSS
- Nouveau volet des paramètres des badges
- Aperçu amélioré des images avec des informations sur le format
- Bouton "Nouvelles conditions du réseau" avec des options pour configurer des
Content-Encoding - raccourci pour afficher la valeur calculée
- Mot clé
accent-color - Classer les types de problèmes à l'aide de couleurs et d'icônes
- Supprimer les jetons de confiance
- Fonctionnalités bloquées dans la vue "Détails du cadre"
- Filtrer les tests dans le paramètre "Tests"
- Nouvelle colonne
Vary Headerdans le volet de stockage du cache - Compatibilité avec la vérification privée de la marque JavaScript
- Amélioration de l'assistance pour le débogage des points d'arrêt
- Prise en charge de l'aperçu au passage de la souris avec la notation
[] - Amélioration de la structure des fichiers HTML
- Traces de pile d'erreur appropriées pour le débogage Wasm
- Nouveaux outils de débogage CSS Flexbox
- Nouvelle superposition Core Web Vitals
- Déplacement du nombre de problèmes dans la barre d'état de la console
- Signaler des problèmes liés aux activités Web fiables
- Formater des chaînes en tant que littéraux de chaîne JavaScript (valides) dans la console
- Volet "Nouveau jeton de confiance" du panneau "Application"
- Émuler la caractéristique média CSS "color-gamut"
- Amélioration des outils des progressive web apps
- Nouvelle colonne
Remote Address Spacedans le panneau "Network" - Amélioration des performances
- Afficher les fonctionnalités autorisées/non autorisées dans la vue "Détails de l'image"
- Nouvelle colonne
SamePartydans le volet "Cookies" - Obsolescence de la prise en charge non standard de
fn.displayName - Abandon de
Don't show Chrome Data Saver warningdans le menu "Paramètres" - [Expérimental] Signalement automatique des problèmes de faible contraste dans l'onglet "Problèmes"
- [Expérimental] Arborescence d'accessibilité complète dans le panneau "Éléments"
- Assistance pour déboguer les cas de non-respect des Trusted Types
- Effectuer une capture d'écran du nœud au-delà de la fenêtre d'affichage
- Nouvel onglet "Jetons de confiance" pour les requêtes réseau
- Lighthouse 7 dans le panneau Lighthouse
- Prise en charge de la forçage de l'état
:targetdu CSS - Nouveau raccourci pour dupliquer un élément
- Sélecteurs de couleur pour les propriétés CSS personnalisées
- Nouveaux raccourcis pour copier des propriétés CSS
- Nouvelle option pour afficher les cookies décodés via l'URL
- Effacer uniquement les cookies visibles
- Nouvelle option permettant de supprimer les cookies tiers dans le volet "Stockage"
- Modifier les hints client User-Agent pour les appareils personnalisés
- Conserver le paramètre "Enregistrer le journal réseau"
- Afficher les connexions WebTransport dans le panneau "Réseau"
- "En ligne" renommé en "Pas de limitation"
- Nouvelles options de copie dans la console, le panneau "Sources" et le volet "Styles"
- Nouvelles informations sur les service workers dans la vue des détails du frame
- Mesurer les informations sur la mémoire dans la vue "Détails du frame"
- Envoyer des commentaires depuis l'onglet "Problèmes"
- Images perdues dans le panneau "Performances"
- Émuler les appareils pliables et double écran en mode Appareil
- [Expérimental] Automatiser les tests du navigateur avec l'enregistreur Puppeteer
- [Expérimental] Éditeur de police dans le volet "Styles"
- [Expérimental] Outils de débogage CSS Flexbox
- [Expérimental] Nouvel onglet "Non-respect de CSP"
- [Expérimental] Nouveau calcul du contraste des couleurs : algorithme de contraste perceptif avancé (APCA)
- Démarrage plus rapide des outils de développement
- Nouveaux outils CSS de visualisation des angles
- Émuler les types d'images non compatibles
- Simuler la taille du quota de stockage dans le volet "Stockage"
- Nouvelle section "Web Vitals" dans le panneau "Performances"
- Signaler des erreurs CORS dans le panneau "Network"
- Informations d'isolation multi-origine dans la vue "Détails du frame"
- Nouvelles informations sur les Web Workers dans la vue d'informations sur le frame
- Afficher les détails du frame d'ouverture pour les fenêtres ouvertes
- Ouvrir le panneau "Network" à partir du volet Service Workers
- Copier la valeur de la propriété
- Copier la trace de la pile pour l'initiateur de réseau
- Prévisualiser la valeur de la variable Wasm lors du survol avec la souris
- Évaluer une variable Wasm dans la console
- Unités de mesure cohérentes pour la taille des fichiers/mémoire
- Mettre en surbrillance les pseudo-éléments dans le panneau "Elements"
- [Expérimental] Outils de débogage CSS Flexbox
- [Expérimental] Personnaliser les raccourcis clavier pour les accords
- Nouveaux outils de débogage de la grille CSS
- Nouvel onglet WebAuthn
- Déplacer les outils entre le panneau supérieur et le panneau inférieur
- Nouveau volet "Styles calculés" dans le volet "Styles"
- Regrouper les propriétés CSS dans le volet "Calculé"
- Lighthouse 6.3 dans le panneau Lighthouse
- Événements
performance.mark()dans la section "Timings" - Nouveaux filtres
resource-typeeturldans le panneau "Network" (Réseau) - Modifications apportées à l'affichage des détails des cadres
- Abandon de
Settingsdans le menu "Autres outils" - [Expérimental] Afficher et corriger les problèmes de contraste des couleurs dans le panneau "Présentation du CSS"
- [Expérimental] Personnaliser les raccourcis clavier dans les outils de développement
- Panneau "New Media" (Nouveau média)
- Effectuer des captures d'écran de nœuds à l'aide du menu contextuel du panneau "Éléments"
- Mise à jour de l'onglet "Problèmes"
- Émuler les polices locales manquantes
- Émuler des utilisateurs inactifs
- Émuler
prefers-reduced-data - Compatibilité avec de nouvelles fonctionnalités JavaScript
- Lighthouse 6.2 dans le panneau Lighthouse
- Abandon de la liste des "autres origines" dans le volet Service Workers
- Afficher un récapitulatif de la couverture pour les éléments filtrés
- Nouvelle vue des détails du frame dans le panneau "Application"
- Suggestion de couleur accessible dans le volet "Styles"
- Rétablir le volet Properties (Propriétés) du panneau "Elements"
- Valeurs d'en-tête
X-Client-Datalisibles par l'humain dans le panneau "Network" (Réseau) - Saisie semi-automatique des polices personnalisées dans le volet "Styles"
- Affichage cohérent du type de ressource dans le panneau "Réseau"
- Boutons "Effacer" dans les panneaux "Éléments" et "Réseau"
- Modification des styles pour les frameworks CSS-in-JS
- Lighthouse 6 dans le panneau Lighthouse
- Abandon de First Meaningful Paint (FMP)
- Compatibilité avec de nouvelles fonctionnalités JavaScript
- Nouveaux avertissements de raccourci d'application dans le volet du fichier manifeste
- Événements
respondWithde service worker dans l'onglet "Durée" - Affichage cohérent du panneau "Calculé"
- Décalages de code octet pour les fichiers WebAssembly
- Copie et coupe au niveau des lignes dans le panneau "Sources"
- Mises à jour des paramètres de la console
- Mises à jour du panneau "Performances"
- Nouvelles icônes pour les points d'arrêt, les points d'arrêt conditionnels et les points de journalisation
- Résoudre les problèmes de votre site avec le nouvel onglet "Problèmes"
- Afficher des informations sur l'accessibilité dans l'info-bulle du mode d'inspection
- Mises à jour du panneau "Performances"
- Terminologie plus précise sur les promesses dans la console
- Mises à jour du volet "Styles"
- Abandon du panneau Propriétés dans le panneau "Éléments"
- Prise en charge des raccourcis d'application dans le volet du fichier manifeste
- Émuler les déficiences visuelles
- Émuler les paramètres régionaux
- Débogage de la règle d'intégration multi-origine (COEP)
- Nouvelles icônes pour les points d'arrêt, les points d'arrêt conditionnels et les points de journalisation
- Afficher les requêtes réseau qui définissent un cookie spécifique
- Accrochage à gauche du menu Command
- L'option "Paramètres" du menu principal a été déplacée
- Le panneau "Audits" devient le panneau Lighthouse
- Supprimer tous les forçages locaux d'un dossier
- Mise à jour de l'interface utilisateur des longues tâches
- Compatibilité avec les icônes masquables dans le volet "Fichier manifeste"
- Compatibilité avec le Moto G4 en mode Appareil
- Informations concernant les cookies
- Icônes de fichier manifeste d'application Web plus précises
- Passez la souris sur les propriétés CSS
contentpour afficher les valeurs sans échappement - Erreurs de mappage de source dans la console
- Paramètre permettant de désactiver le défilement au-delà de la fin d'un fichier
- Compatibilité avec les redéfinitions
letetclassdans la console - Amélioration du débogage WebAssembly
- Demander des chaînes de demandeurs dans l'onglet Initiateur
- Mettez en surbrillance la demande réseau sélectionnée dans "Overview" (Aperçu).
- Colonnes d'URL et de chemin d'accès dans le panneau "Network"
- Mise à jour des chaînes user-agent
- Nouvelle interface utilisateur de configuration du panneau "Audits"
- Modes de couverture de code par fonction ou par bloc
- La couverture du code doit désormais être lancée par l'actualisation d'une page.
- Déboguer pourquoi un cookie a été bloqué
- Afficher les valeurs des cookies
- Simuler différentes préférences de préférences de couleur et de mouvement réduit
- Mises à jour de la couverture du code
- Déboguer la raison pour laquelle une ressource réseau a été demandée
- Les panneaux "Console" et "Sources" respectent de nouveau les préférences de retrait
- Nouveaux raccourcis pour la navigation avec le curseur
- Compatibilité avec plusieurs clients dans le panneau "Audits"
- Débogage du gestionnaire de paiement
- Lighthouse 5.2 dans le panneau "Audits"
- Largest Contentful Paint dans le panneau "Performances"
- Problèmes liés aux outils de développement de fichiers depuis le menu principal
- Copier les styles des éléments
- Visualiser les décalages de mise en page
- Lighthouse 5.1 dans le panneau "Audits"
- Synchronisation du thème de l'OS
- Raccourci clavier pour ouvrir l'éditeur de points d'arrêt
- Cache de préchargement dans le panneau "Network" (Réseau)
- Propriétés privées lors de l'affichage d'objets
- Notifications et messages push dans le panneau "Application"
- Saisie semi-automatique avec les valeurs CSS
- Nouvelle interface utilisateur pour les paramètres réseau
- Messages WebSocket dans les exports HAR
- Boutons d'importation et d'exportation des fichiers HAR
- Utilisation de la mémoire en temps réel
- Numéros de port d'enregistrement des services workers
- Inspecter les événements de récupération en arrière-plan et de synchronisation en arrière-plan
- Puppeteer pour Firefox
- Préréglages pertinents pour la saisie semi-automatique des fonctions CSS
- Effacer les données des sites depuis le menu Command
- Afficher toutes les bases de données IndexedDB
- Afficher la taille non compressée d'une ressource en pointant dessus
- Points d'arrêt intégrés dans le volet "Points d'arrêt"
- Nombre de ressources IndexedDB et de cache
- Paramètre de désactivation de l'info-bulle d'inspection détaillée
- Paramètre d'activation/désactivation du retrait de tabulation dans l'éditeur
- Mettre en surbrillance tous les nœuds affectés par la propriété CSS
- Lighthouse v4 dans le panneau "Audits"
- Lecteur de messages binaires WebSocket
- Capturer une capture d'écran de la zone sélectionnée dans le menu de commandes
- Filtres de service worker dans le panneau "Network"
- Modifications apportées au panneau "Performances"
- Tâches longues dans les enregistrements du panneau "Performances"
- Le premier tableau dans la section "Durée"
- Astuce supplémentaire : Raccourci pour afficher les codes de couleur RVB et HSL (vidéo)
- Points de journalisation
- Info-bulles détaillées en mode Inspecter
- Exporter des données de couverture du code
- Naviguer dans la console à l'aide d'un clavier
- Ligne de rapport de contraste AAA dans le sélecteur de couleur
- Enregistrer les remplacements de géolocalisation personnalisés
- Repliage du code
- L'onglet "Cadres" a été renommé "Messages".
- Conseil supplémentaire : Filtrer le panneau "Réseau" par propriété (vidéo)
- Visualiser les métriques de performances dans le panneau "Performances"
- Mettre en surbrillance les nœuds de texte dans l'arborescence DOM
- Copiez le chemin JS dans un nœud DOM.
- Mises à jour du panneau "Audits", y compris un nouvel audit qui détecte les bibliothèques JS et les nouveaux mots clés permettant d'accéder au panneau "Audits" à partir du menu de commandes
- Astuce supplémentaire: Inspecter les requêtes média à l'aide du mode Appareil (vidéo)
- Passez la souris sur un résultat d'expression en direct pour mettre en surbrillance un nœud DOM.
- Stocker des nœuds DOM en tant que variables globales
- Informations sur l'initiateur et la priorité désormais disponibles dans les importations et exportations de fichiers HAR
- Accéder au menu de commandes depuis le menu principal
- Points d'arrêt Picture-in-picture
- Conseil supplémentaire : Utiliser
monitorEvents()pour consigner les événements déclenchés par un nœud dans la console (vidéo) - Expressions dynamiques dans la console
- Mettre en surbrillance les nœuds DOM lors de l'évaluation stricte
- Optimisations du panneau "Performances"
- Débogage plus fiable
- Activer la limitation de la bande passante depuis le menu Command
- Points d'arrêt conditionnels pour la saisie semi-automatique
- Arrêter sur les événements AudioContext
- Déboguer des applications Node.js avec ndb
- Conseil supplémentaire : Mesurez les interactions réelles des utilisateurs avec l'API User Timing
- Évaluation rapide
- Suggestions d'arguments
- Saisie semi-automatique des fonctions
- Mots clés ES2017
- Lighthouse 3.0 dans le panneau "Audits" (Audits)
- Compatibilité avec BigInt
- Ajouter des chemins d'accès aux propriétés dans le volet de surveillance
- "Afficher les codes temporels" déplacé dans les paramètres
- Astuce supplémentaire: Méthodes moins connues dans la console (vidéo)
- Rechercher dans tous les en-têtes réseau
- Aperçus des valeurs de variable CSS
- Copier en tant que récupération
- Nouveaux audits, options de configuration pour ordinateur et traces d'affichage
- Arrêter les boucles infinies
- Temps utilisateur dans les onglets "Performances"
- Les instances de VM JavaScript sont clairement indiquées dans le panneau "Mémoire"
- Onglet "Network" (Réseau) renommé "Page"
- Mise à jour du thème sombre
- Informations sur la transparence des certificats dans le panneau "Sécurité"
- Fonctionnalités d'isolation de sites dans le panneau "Performances"
- Conseil supplémentaire : Panneau des calques et inspecteur des animations (vidéo)
- Boîte noire dans le panneau "Network" (Réseau)
- Réglage automatique du zoom en mode Appareil
- Affichage mis en forme dans les onglets "Aperçu" et "Réponse"
- Prévisualiser un contenu HTML dans l'onglet "Aperçu"
- Compatibilité des remplacements locaux avec les styles dans le code HTML
- Astuce supplémentaire: Les scripts du framework Blackbox pour rendre les points d'arrêt des écouteurs d'événements plus utiles
- Remplacements locaux
- Nouveaux outils d'accessibilité
- Onglet "Modifications"
- Nouveaux audits SEO et de performances
- Plusieurs enregistrements dans le panneau "Performances"
- Exécution du code fiable avec des nœuds de calcul dans le code asynchrone
- Conseil supplémentaire : Automatisez les actions des outils pour les développeurs avec Puppeteer (vidéo)
- Performance Monitor
- Barre latérale de la console
- Regrouper les messages similaires de la console
- Astuce supplémentaire: Activer/Désactiver la pseudo-classe de survol avec la souris (vidéo)
- Prise en charge du débogage à distance multicompte
- Workspace 2.0
- 4 nouveaux audits
- Simuler des notifications push avec des données personnalisées
- Déclencher des événements de synchronisation en arrière-plan avec des tags personnalisés
- Astuce supplémentaire : Points d'arrêt de l'écouteur d'événements (vidéo)
- Attente de niveau supérieur dans la console
- Nouveaux workflows de captures d'écran
- Mise en surbrillance de la grille CSS
- Nouvelle API de la console pour interroger des objets
- Nouveaux filtres de la console
- Importations HAR dans le panneau "Réseau"
- Ressources de cache pouvant être prévisualisées
- Débogage du cache plus prévisible
- Couverture du code au niveau du bloc
- Simulation de limitation de débit sur un appareil mobile
- Afficher l'utilisation de l'espace de stockage
- Afficher les cas où un service worker a mis en cache des réponses
- Activer le compteur de FPS dans le menu Command
- Définir le comportement de la molette de la souris sur le zoom ou le défilement
- Prise en charge du débogage pour les modules ES6
- Nouveau panneau "Audits"
- Badges tiers
- Nouveau geste pour "Continuer ici"
- Passer en mode asynchrone
- Aperçus d'objets plus informatifs dans la console
- Sélection du contexte plus détaillée dans la console
- Mises à jour en temps réel dans l'onglet "Couverture"
- Options de limitation de bande passante réseau simplifiées
- Les piles asynchrones sont activées par défaut
- Couverture du code CSS et JS
- Captures d'écran de toute la page
- Bloquer des demandes
- Ignorer l'attente asynchrone
- Menu de commandes unifiées