Nouveautés des outils de développement
Liste des points abordés dans la série Nouveautés des outils de développement.
Chrome 125
- Prise en charge des règles@position-try dans Éléments > Styles
- Améliorations apportées au panneau "Sources"
- Configurer la mise en page vitrine automatique et la fermeture des crochets
- Les promesses refusées traitées sont reconnues comme interceptées
- Causes d'erreurs dans la console
- Améliorations apportées au panneau "Réseau"
- Inspecter les en-têtes des indicateurs anticipés
- Masquer la colonne "Waterfall" (Cascade d'annonces)
- Améliorations apportées au panneau "Performances"
- Capturer les statistiques des sélecteurs CSS
- Modifier l'ordre et masquer les titres
- Ignorer les éléments de retenue dans le panneau "Mémoire"
- Lighthouse version 11.7.1
- Points forts divers
Chrome 124
- Nouveau panneau de saisie automatique
- Limitation de la bande passante réseau améliorée pour WebRTC
- Prise en charge des animations liées au défilement dans le panneau "Animations"
- Meilleure 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 vers les événements qu'ils ont lancés depuis les initiés sélectionnés
- Lighthouse version 11.6.0
- Info-bulles pour les catégories spéciales dans Mémoire > Instantanés de segments de mémoire
- Application > Storage updates (Application > Mises à jour de l'espace de stockage)
- Octets utilisés pour le stockage partagé
- Web SQL est entièrement obsolète
- Améliorations apportées au panneau de couverture
- Le panneau "Calques" a peut-être été abandonné
- Abandon du Profileur JavaScript: phase 4, finale
- Points forts divers
Chrome 123
- Trouvez l'easter egg
- 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 versions de remplacement
var()
- L'outil CSS Length est obsolète
- Fenêtre pop-up du résultat de recherche sélectionné dans Performances > Piste principale
- Mises à jour du panneau réseau
- Bouton de suppression et filtre de recherche dans l'onglet Réseau > EventStream
- Info-bulles contenant des 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 version 11.5.0
- Améliorations de l'accessibilité
- Points forts divers
Chrome 122
- La collection officielle des extensions 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
- Fil d'Ariane dans la timeline
- Initiateurs d'événements dans le canal principal
- Menu de sélection d'instance 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
- Le pseudo-élément ::view-transition peut désormais être modifié dans "Styles"
- Compatibilité de la propriété align-content avec les conteneurs de blocs
- Prise en charge de la posture pour les appareils pliables émulés
- Thématisation dynamique
- Avertissements de suppression progressive des cookies tiers dans les panneaux "Réseau" et "Application"
- Lighthouse version 11.4.0
- Améliorations de l'accessibilité
- Points forts divers
Chrome 121
- Améliorations apportées aux éléments
- Barre de filtre simplifiée dans le panneau "Network"
- Assistance
@font-palette-values
- Cas compatible: propriété personnalisée en remplacement d'une autre propriété personnalisée
- Meilleure compatibilité avec les cartes sources
- Améliorations apportées au panneau "Performances"
- Suivi des interactions améliorées
- Filtrage avancé dans les onglets "Ascendant", "Arborescence d'appel" 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 "Réseau"
- Nouvelles options du menu Commandes pour l'ajout et la suppression de schémas de blocage de requêtes
- Le test des cas de non-respect des CSP a été supprimé
- Lighthouse version 11.3.0
- Améliorations de l'accessibilité
- Points forts divers
Chrome 120
- Abandon des cookies tiers
- Analyser les cookies de votre site Web avec l'outil d'analyse Privacy Sandbox
- Fiche améliorée pour les éléments à ignorer
- 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 via du code que vous n'ignorez pas
x_google_ignoreList
a été renomméignoreList
dans les cartes sources- Nouveau bouton d'activation du mode d'entrée lors du débogage à distance
- Le panneau "Elements" affiche désormais les URL des nœuds #document
- Règle de sécurité du contenu efficace dans le panneau "Application"
- Amélioration du débogage des animations
- Boîte de dialogue "Faites-vous confiance à ce code ?" dans les sources et avertissement auto-XSS dans la console
- Points d'arrêt de l'écouteur d'événements dans les workers et les Worklets Web
- Nouveau badge multimédia pour
<audio>
et<video>
- Le préchargement a été renommé "chargement spéculatif"
- Lighthouse version 11.2.0
- Améliorations de l'accessibilité
- Points forts divers
Chrome 119
- Amélioration de la section @property dans Éléments > Styles
- Règle @property modifiable
- Des problèmes liés à des règles @property non valides sont signalés
- Mise à jour de la liste des appareils à émuler
- Imprimer de manière élégante le fichier JSON intégré dans les tags de script dans les sources
- Saisie semi-automatique des champs privés dans la console
- Lighthouse version 11.1.0
- Améliorations de l'accessibilité
- Abandon de Web SQL
- Validation du format de capture d'écran dans Application > Manifeste
- Points forts divers
Chrome 118
- Nouvelle section pour les propriétés personnalisées dans Éléments > Styles
- Améliorations supplémentaires apportées aux forçages locaux
- Amélioration des recherches
- Panneau "Sources" amélioré
- Espace de travail simplifié dans le panneau "Sources"
- Réorganiser les volets dans les sources
- Mise en surbrillance de la syntaxe et mise en page élégante pour davantage de types de scripts
- Émuler la fonctionnalité multimédia "preferred-reduced-transparency"
- Lighthouse 11
- Améliorations de l'accessibilité
- Points forts divers
Chrome 117
- Améliorations apportées au panneau "Réseau"
- Remplacer le contenu Web localement encore plus rapidement
- Remplacer le contenu des requêtes XHR et de récupération
- Masquer les demandes d'extension Chrome
- Codes d'état HTTP lisibles par l'humain
Paramètres des sources activés par défaut: pliage du code et affichage automatique des fichiers
Amélioration du débogage des problèmes liés aux cookies tiers
L'extension de débogage C/C++ WebAssembly pour les outils de développement est désormais Open Source
(Expérimental) Nouvelle émulation du rendu: preferences-reduced-transparency
Chrome 116
- Amélioration du débogage des feuilles de style manquantes
- Ajout de temps linéaire dans Éléments > Styles > Éditeur de lissage de vitesse
- Compatibilité des buckets de stockage et vue des métadonnées
- Lighthouse version 10.3.0
- Accessibilité: commandes au clavier et amélioration de la lecture d'écran
- Points forts divers
Chrome 115
- 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 des 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 version 10.2.0
- Ignorer les scripts de contenu par défaut
- Réseau > Améliorations de la réponse
- Points forts divers
Chrome 114
- Assistance au débogage WebAssembly
- Amélioration du comportement de pas 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 version 10.1.1
- Amélioration des performances
- performance.mark() affiche les codes temporels en pointant sur Performances > Chronologies
- La commande profile() insère Performances > Principal.
- Avertissement en cas d'interactions utilisateur lentes
- Informations concernant les signaux Web
- Abandon du Profileur JavaScript: phase 3
- Points forts divers
Chrome 113
- Remplacer les en-têtes de réponse du réseau
- Améliorations de débogage de Nuxt, Vite et Rollup
- Améliorations CSS dans Éléments > Styles
- Propriétés et valeurs CSS non valides
- Liens vers les images clés dans la propriété du raccourci d'animation
- Nouveau paramètre de la console: saisie semi-automatique à la saisie
- Le menu Commandes met en avant les fichiers créés.
- Abandon du profileur JavaScript: étape 2
- Points forts divers
Chrome 112
- Mises à jour de l'Enregistreur
- Extensions de relecture de l'Enregistreur
- Enregistrer avec des sélecteurs de pierce
- Exporter les enregistrements sous forme de scripts Puppeteer avec l'analyse Lighthouse
- Obtenir des extensions pour l'Enregistreur
- Éléments > Mises à jour des styles
- Documentation CSS dans le volet "Styles"
- Compatibilité avec 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
- Abandon du profileur JavaScript
- Émuler le contraste réduit
- Lighthouse 10
- Points forts divers
Chrome 111
- Déboguer les couleurs HD avec le volet "Styles"
- Expérience utilisateur améliorée pour les points d'arrêt
- Raccourcis personnalisables dans l'Enregistreur
- Amélioration de la mise en évidence de la syntaxe pour Angular
- Réorganiser les caches dans le panneau "Application"
- Points forts divers
Chrome 110
- Suppression du panneau "Performances" lors de l'actualisation
- Mises à jour de 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
- Impression élégante sur place
- Amélioration de la mise en surbrillance de la syntaxe et de l'aperçu intégré pour Vue, SCSS, etc.
- Saisie semi-automatique économe et cohérente dans la console
- Points forts divers
Chrome 109
- Enregistreur: copier en tant qu'options pour les pas, la relecture sur la page et le menu contextuel d'une étape
- Afficher le nom réel des fonctions dans les enregistrements des performances
- Nouveaux raccourcis clavier dans le panneau "Console et sources"
- Amélioration du débogage JavaScript
- Points forts divers
- [Expérimental] Amélioration de l'expérience utilisateur pour la gestion des points d'arrêt
- [Expérimental] Impression élégante et automatique sur place
Chrome 108
- Conseils pour les propriétés CSS inactives
- Détecter automatiquement les sélecteurs de texte et XPath dans le panneau "Enregistreur"
- Passer en revue les expressions séparées par une virgule
- Amélioration du paramètre "Liste d'éléments à ignorer"
- Points forts divers
Chrome 107
- Personnaliser les raccourcis clavier dans les outils de développement
- Activer/Désactiver les thèmes clair et sombre avec le raccourci clavier
- Mettre en surbrillance les objets C/C++ dans l'outil d'inspection de mémoire
- Assurer la compatibilité avec les informations complètes de l'initiateur pour l'importation HAR
- Lancer une recherche DOM après avoir appuyé sur
Enter
- Afficher les icônes
start
etend
pour les propriétés CSSalign-content
- Points forts divers
Chrome 106
- Regrouper les fichiers par création / déployé 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'appel pendant le débogage
- Masquer les sources de la liste des éléments à ignorer dans le panneau "Sources"
- Masquer les fichiers de la liste des éléments à ignorer dans le menu de commande
- Nouveau suivi des interactions dans le panneau "Performances"
- Répartition des durées LCP dans le panneau "Insights sur les performances"
- Générer automatiquement un nom par défaut pour les enregistrements dans le panneau "Enregistreur"
- Points forts divers
Chrome 105
- Lecture détaillée dans l'Enregistreur
- Permettre le survol avec la souris sur un événement dans le panneau "Enregistreur"
- LCP (Largest Contentful Paint) dans le panneau "Insights sur les performances"
- Identifier les flashs de texte (FOIT, FOUT) comme causes potentielles de décalages de mise en page
- Gestionnaires de protocole dans le volet "Manifeste"
- Badge du calque supérieur dans le panneau "Elements"
- Joindre les informations de débogage Wasm au moment de l'exécution
- Prendre en charge la modification en temps réel pendant le débogage
- Afficher et modifier les règles @scope du volet "Styles"
- Améliorations apportées à la carte source
- Points forts divers
Chrome 104
- Redémarrer le frame pendant le débogage
- Options de relecture lente dans le panneau "Enregistreur"
- Créer une extension pour le panneau "Enregistreur"
- Regrouper les fichiers par création / déployé dans le panneau "Sources"
- Nouveau suivi "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 Performance
- Prévisualiser les valeurs qui ne sont pas de 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
- Points forts divers
Chrome 103
- Capturez les événements de double-clic et de clic droit dans le panneau "Enregistreur"
- Nouvelle période et mode Instantané dans le panneau Lighthouse
- Contrôle du zoom amélioré dans le panneau "Insights sur les performances"
- Confirmer la suppression d'un enregistrement de performance
- Réorganiser les volets dans le panneau "Elements"
- Choisir une couleur en dehors du navigateur
- Amélioration de l'aperçu de la valeur intégrée lors du débogage
- Compatibilité avec les blobs volumineux pour les authentificateurs virtuels
- Nouveaux raccourcis clavier dans le panneau "Sources"
- Améliorations apportées aux cartes sources
Chrome 102
- Fonctionnalité en preview: nouveau panneau "Insights sur les performances"
- Nouveaux raccourcis pour émuler les thèmes clair et sombre
- Amélioration de la sécurité dans l'onglet "Aperçu sur le réseau"
- Amélioration de l'actualisation au point d'arrêt
- Mises à jour de la console
- Annuler l'enregistrement du parcours utilisateur au démarrage
- Afficher les pseudo-éléments de mise en surbrillance hérités dans le volet "Styles"
- Points forts divers
- [Expérimental] Copier les modifications CSS
- [Expérimental] Choisir une couleur en dehors du navigateur
Chrome 101
- Importer et exporter des parcours 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
- Points forts divers
- [Expérimental] Nouvelle période et nouveau mode Instantané dans le panneau Lighthouse
Chrome 100
- Afficher et modifier les @prises en charge dans les règles du volet "Styles"
- Prendre en charge les sélecteurs courants par défaut
- Personnaliser le sélecteur d'enregistrement
- Renommer un enregistrement
- Prévisualiser les propriétés d'une classe/fonction lorsque l'utilisateur pointe dessus
- Images partiellement présentées dans le panneau "Performances"
- Points forts divers
Chrome 99
- Limiter les requêtes WebSocket
- Volet de la nouvelle API Reporting dans le panneau "Application"
- Prise en charge de l'attente jusqu'à ce que l'élément soit visible/cliquable dans le panneau "Enregistreur"
- Amélioration du style, du formatage et du filtrage dans la console
- Déboguer l'extension Chrome avec les fichiers de carte source
- Amélioration de l'arborescence des dossiers sources dans le panneau "Sources"
- Afficher les fichiers sources des workers dans le panneau des sources
- Mises à jour du thème sombre automatique dans Chrome
- Sélecteur de couleur et volet fractionné intuitifs
- Points forts divers
Chrome 98
- Fonctionnalité en preview: arborescence d'accessibilité pleine page
- Modifications plus précises dans l'onglet "Modifications"
- Définir un délai plus long pour l'enregistrement du parcours utilisateur
- Assurez-vous que vos pages peuvent être mises en cache à l'aide de l'onglet "Cache amélioré"
- Nouveau filtre du volet des propriétés
- Émuler la caractéristique média CSS "force-colors"
- Afficher les règles en cas de survol avec la souris
- Prendre en charge
row-reverse
etcolumn-reverse
dans l'éditeur Flexbox - Nouveaux raccourcis clavier pour répéter XHR et développer tous les résultats de recherche
- Lighthouse 9 dans le panneau "Lighthouse"
- Panneau "Sources" amélioré
- Points forts divers
- [Expérimental] Points de terminaison dans le volet de l'API Reporting
Chrome 97
- Fonctionnalité en preview: nouveau panneau "Enregistreur"
- Actualiser la liste des appareils en mode Appareil
- Saisie semi-automatique avec la fonctionnalité Modifier au format HTML
- Amélioration de l'expérience de débogage du code
- Synchronisation des paramètres des outils de développement sur plusieurs appareils
Chrome 96
- Fonctionnalité en preview: nouveau panneau "Présentation du CSS"
- Restauration et amélioration de l'expérience de modification et de copie de la longueur CSS
- Émuler la caractéristique média CSS "prefers-contrast"
- Émuler le thème sombre automatique de Chrome
- Copier les déclarations au format JavaScript dans le volet "Styles"
- Nouvel onglet "Charge utile" dans le panneau "Network"
- 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 des objets
Intl
appropriés dans la console - Traces de pile asynchrones cohérentes
- Conserver la barre latérale de la console
- Volet du cache d'application obsolète dans le panneau "Application"
- [Expérimental] Nouveau volet "API Reporting" dans le panneau "Application"
Chrome 95
- Nouveaux outils de création de longueur CSS
- Masquer les problèmes dans l'onglet "Problèmes"
- Amélioration de l'affichage des propriétés
- 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 pour le menu de commandes des outils de développement
Chrome 94
- Utiliser les outils de développement dans la langue de votre choix
- 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
- La barre latérale de la console sera bientôt abandonnée
- Afficher les en-têtes
Set-Cookies
bruts dans l'onglet "Problèmes" et le panneau "Réseau" - Accesseurs natifs d'affichage cohérents en tant que propriétés propres dans la console
- Traces de pile d'erreurs 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"
Chrome 93
- Requêtes de conteneur CSS modifiables dans le volet "Styles"
- Aperçu du Web bundle dans le panneau "Network"
- Débogage de l'API Attribution Reporting
- Gestion améliorée des chaînes dans la console
- Amélioration du débogage CORS
- Lighthouse 8.1
- Nouvelle URL de note dans le volet "Manifeste"
- Correction des sélecteurs de correspondance CSS
- Mettre en valeur les réponses JSON dans le panneau "Network" (Réseau)
Chrome 92
- Éditeur de grille CSS
- Prise en charge des redéclarations de
const
dans la console - Lecteur de l'ordre source
- Nouveau raccourci pour afficher les détails du frame
- Amélioration de la compatibilité au débogage CORS
- Renommer l'étiquette XHR en Fetch/XHR
- Filtrer le type de ressource Wasm dans le panneau "Network"
- Indices client User-Agent pour les appareils dans l'onglet "Conditions du réseau"
- Signaler des problèmes du mode Quirks dans l'onglet "Problèmes"
- Inclure le calcul des intersections dans le panneau "Performances"
- Lighthouse 7,5 dans le panneau "Lighthouse"
- Abandon du menu contextuel "Redémarrer le cadre" dans la pile d'appel
- [Expérimental] Moniteur de protocole
- [Expérimental] Enregistreur Puppeteer
Chrome 91
- Fenêtre pop-up d'informations sur les signaux Web
- Nouvel outil d'inspection de mémoire
- Visualiser l'extrait CSS Scroll-Snap
- Volet des nouveaux paramètres du badge
- Aperçu d'image amélioré avec des informations sur le format
- Bouton "Nouvelles conditions du réseau" avec des options permettant de 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étaillée du frame
- Filtrer les tests dans les paramètres "Tests"
- Nouvelle colonne
Vary Header
dans le volet de stockage du cache - Compatibilité avec la vérification privée de la marque JavaScript
- Compatibilité améliorée avec le débogage des points d'arrêt
- Prendre en charge l'aperçu de survol avec la notation
[]
- Amélioration du contour des fichiers HTML
- Traces de pile d'erreurs appropriées pour le débogage Wasm
Chrome 90
- Nouveaux outils de débogage CSS Flexbox
- Nouvelle superposition Core Web Vitals
- Nombre de problèmes déplacé dans la barre d'état de la console
- Signaler des problèmes liés à l'activité Web fiable
- Formater les chaînes en tant que littéraux de chaîne JavaScript (valides) dans la console
- Volet "New Trust Tokens" (Nouveaux jetons de confiance) du panneau "Application"
- Émuler la caractéristique média CSS "color-gamut"
- Amélioration des outils pour les progressive web apps
- Nouvelle colonne
Remote Address Space
dans le panneau "Network" - Amélioration des performances
- Afficher les fonctionnalités autorisées/non autorisées dans la vue "Détails du frame"
- Nouvelle colonne
SameParty
dans le volet "Cookies" - La compatibilité non standard avec
fn.displayName
a été abandonnée - Abandon de
Don't show Chrome Data Saver warning
dans le menu "Paramètres" - [Expérimental] Création automatique de rapports sur les problèmes de faible contraste dans l'onglet "Problèmes"
- [Expérimental] Arborescence d'accessibilité complète dans le panneau "Elements"
Chrome 89
- Déboguer les cas de non-respect des Trusted Types
- Capturer un 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"
- Compatibilité avec le forçage de l'état CSS
:target
- Nouveau raccourci pour dupliquer l'élément
- Sélecteurs de couleur pour les propriétés CSS personnalisées
- Nouveaux raccourcis pour copier les propriétés CSS
- Nouvelle option pour afficher les cookies décodés par l'URL
- Effacer uniquement les cookies visibles
- Nouvelle option pour effacer les cookies tiers dans le volet "Stockage"
- Modifier les indicateurs client User-Agent pour les appareils personnalisés
- Conserver le paramètre "Enregistrer le journal réseau"
- Afficher les connexions WebTransport dans le panneau "Network" (Réseau)
- "Online" a été renommé "No throttling" (Pas de limitation).
- Nouvelles options de copie dans la console, les panneaux "Sources" et le volet "Styles"
- Nouvelles informations sur les service workers dans la vue détaillée du frame
- Mesurer les informations sur la mémoire dans la vue Détails de l'image
- Envoyer des commentaires depuis l'onglet "Problèmes"
- Suppression des frames dans le panneau "Performances"
- Émuler les appareils pliables et double écran en mode Appareil
- [Expérimental] Automatiser les tests sur navigateur avec Puppeteer Recorder
- [Expérimental] Éditeur de police dans le volet "Styles"
- [Expérimental] Outils de débogage CSS Flexbox
- [Expérimental] Nouvel onglet "Cas de non-respect des règles CSP"
- [Expérimental] Nouveau calcul du contraste des couleurs : algorithme avancé de contraste perceptuel (APCA)
Chrome 88
- Démarrage plus rapide des outils de développement
- Nouveaux outils de visualisation de l'angle CSS
- Émuler les types d'images non compatibles
- Simuler la taille du quota de stockage dans le volet "Storage" (Stockage)
- Nouvelle section "Signaux Web" dans le panneau "Performances"
- Signaler des erreurs CORS dans le panneau "Network" (Réseau)
- Informations sur l'isolation multi-origine dans la vue "Détails du frame"
- Informations sur les nouveaux travailleurs Web dans la vue "Détails du frame"
- Afficher les détails du cadre de l'ouverture pour les fenêtres ouvertes
- Ouvrir le panneau "Network" (Réseau) à partir du volet Service Workers
- Copier la valeur de la propriété
- Copier la trace de la pile pour l'initiateur réseau
- Prévisualiser la valeur de la variable Wasm lors du survol avec la souris
- Évaluer la variable Wasm dans la console
- Unités de mesure cohérentes pour les tailles de fichier/mémoire
- Mettre en surbrillance des pseudo-éléments dans le panneau "Elements"
- [Expérimental] Outils de débogage CSS Flexbox
- [Expérimental] Personnaliser les raccourcis clavier des accords
Chrome 87
- 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 de la barre latérale "Calculé" dans le volet "Styles"
- Regrouper des propriétés CSS dans le volet "Calculé"
- Lighthouse 6.3 dans le panneau "Lighthouse"
- Événements
performance.mark()
dans la section "Durée" - Nouveaux filtres
resource-type
eturl
dans le panneau "Network" - Mises à jour de la vue détaillée du frame
- Abandon de
Settings
dans le menu "Plus d'outils" - [Expérimental] Afficher et résoudre les problèmes de contraste des couleurs dans le panneau "Aperçu" de CSS
- [Expérimental] Personnaliser les raccourcis clavier dans les Outils de développement
Chrome 86
- Nouveau panneau multimédia
- Faire des captures d'écran de nœuds à l'aide du menu contextuel du panneau "Éléments"
- Mises à jour de l'onglet "Problèmes"
- Émuler les polices locales manquantes
- Émuler les utilisateurs inactifs
- Émuler
prefers-reduced-data
- Compatibilité avec les nouvelles fonctionnalités JavaScript
- Lighthouse 6.2 dans le panneau "Lighthouse"
- Abandon de la liste "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-Data
lisibles dans le panneau "Network" - Utiliser la saisie semi-automatique pour les polices personnalisées dans le volet "Styles"
- Affichage cohérent du type de ressource dans le panneau "Réseau"
- Effacer les boutons des panneaux "Éléments" et "Réseau"
Chrome 85
- Modification du style pour les frameworks CSS-in-JS
- Lighthouse 6 dans le panneau "Lighthouse"
- Abandon de First Meaningful Paint (FMP)
- Compatibilité avec les nouvelles fonctionnalités JavaScript
- Nouveaux avertissements de raccourcis d'appli dans le volet "Manifeste"
- Événements
respondWith
du service worker dans l'onglet "Timing" - Affichage cohérent du volet "Calculé"
- Décalages de bytecode pour les fichiers WebAssembly
- Copie et coupe au niveau de la ligne dans le panneau "Sources"
- Mises à jour des paramètres de la console
- Informations concernant le panneau "Performances"
- Nouvelles icônes pour les points d'arrêt, les points d'arrêt conditionnels et les points de journalisation
Chrome 84
- Résoudre les problèmes du site à l'aide du nouvel onglet "Problèmes"
- Afficher les informations d'accessibilité dans l'info-bulle du mode Inspecter
- Informations concernant le panneau "Performances"
- Terminologie plus précise pour les promesses dans la console
- Mises à jour du volet "Styles"
- Abandon du volet Properties (Propriétés) du panneau "Elements"
- Prise en charge des raccourcis d'application dans le volet "Manifeste"
Chrome 83
- Émuler les déficiences visuelles
- Émuler les paramètres régionaux
- Débogage COEP (Cross-Origin Embedder Policy)
- 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
- Station d'accueil à gauche depuis le menu de commandes
- L'option "Paramètres" du menu principal a été déplacée
- Le panneau "Audits" devient le panneau Lighthouse
- Supprimer tous les remplacements locaux dans un dossier
- Interface utilisateur des tâches longues mise à jour
- Compatibilité des icônes masquées dans le volet "Manifeste"
Chrome 82
Chrome 81
- Compatibilité du Moto G4 en mode Appareil
- Informations concernant les cookies
- Icônes plus précises du fichier manifeste d'application Web
- Pointez sur les propriétés CSS
content
pour afficher les valeurs sans échappement - Erreurs de mappage source dans la console
- Paramètre permettant de désactiver le défilement après la fin d'un fichier
Chrome 80
- Prise en charge des redéclarations
let
etclass
dans la console - Amélioration du débogage de WebAssembly
- Demander des chaînes d'initiateurs dans l'onglet "Initiateur"
- Mettre en surbrillance la requête réseau sélectionnée dans la vue d'ensemble
- Colonnes d'URL et de chemin d'accès dans le panneau "Network"
- Chaînes user-agent mises à jour
- Nouvelle interface utilisateur de configuration du panneau "Audits"
- Modes de couverture de code par fonction ou par bloc
- La couverture de code doit désormais être lancée par une actualisation de la page
Chrome 79
- Déterminer pourquoi un cookie a été bloqué
- Afficher les valeurs des cookies
- Simule différents schémas de couleurs "preferred-color-scheme" et "preferreds-reduced-motion"
- Mises à jour de la couverture du code
- Identifier la raison pour laquelle une ressource réseau a été demandée
- Les panneaux "Console" et "Sources" respectent à nouveau les préférences de retrait
- Nouveaux raccourcis pour la navigation avec le curseur
Chrome 78
- Compatibilité avec les multicomptes 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 dans le menu principal
Chrome 77
- Copier les styles des éléments
- Visualiser les décalages de mise en page
- Lighthouse 5.1 dans le panneau "Audits"
- Synchronisation des thèmes de l'OS
- Raccourci clavier pour ouvrir l'éditeur de points d'arrêt
- Précharger le cache dans le panneau "Network"
- Propriétés privées lors de l'affichage d'objets
- Notifications et messages push dans le panneau "Application"
Chrome 76
- Saisie semi-automatique avec des valeurs CSS
- Nouvelle interface utilisateur pour les paramètres réseau
- Messages WebSocket dans les exportations au format HAR
- Boutons d'importation et d'exportation au format HAR
- Utilisation de la mémoire en temps réel
- Numéros de port d'enregistrement des service workers
- Inspecter les événements de récupération en arrière-plan et de synchronisation en arrière-plan
- Puppeteer pour Firefox
Chrome 75
- Préréglages pertinents pour la saisie semi-automatique des fonctions CSS
- Effacer les données des sites depuis le menu de commandes
- Afficher toutes les bases de données IndexedDB
- Afficher la taille non compressée d'une ressource en passant la souris
- Points d'arrêt intégrés dans le volet "Breakpoints" (Points d'arrêt)
- Nombre de ressources IndexedDB et Cache
- Paramètre permettant de désactiver l'info-bulle d'inspection détaillée
- Paramètre permettant d'activer/de désactiver le retrait de la touche de tabulation dans l'éditeur
Chrome 74
- 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
- Faire une capture d'écran de la zone dans le menu de commandes
- Filtres de service worker dans le panneau "Network"
- Informations concernant le panneau "Performances"
- Tâches longues dans les enregistrements du panneau "Performances"
- First Paint dans la section "Durée"
- Astuce supplémentaire: Raccourci pour afficher les codes de couleur RVB et HSL (vidéo)
Chrome 73
- Points de journalisation
- Info-bulles détaillées en mode Inspecter
- Exporter les données de couverture de 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
- Pliage de code
- Onglet "Frames" renommé "Messages"
- Astuce: Filtrer les panneaux réseau par propriété (vidéo)
Chrome 72
- Visualiser les métriques de performances dans le panneau "Performances"
- Mettez en surbrillance les nœuds de texte dans l'arborescence DOM
- Copiez le chemin d'accès 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 pour accéder au panneau "Audits" à partir du menu de commandes
- Astuce supplémentaire: Utiliser le mode Appareil pour inspecter les requêtes média (vidéo)
Chrome 71
- Pointez sur un résultat d'expression active pour mettre en surbrillance un nœud DOM.
- Stocker les nœuds DOM en tant que variables globales
- Informations sur l'initiateur et la priorité désormais dans les importations et exportations HAR
- Accéder au menu "Commandes" depuis le menu principal
- Points d'arrêt Picture-in-picture
- Astuce supplémentaire: Utilisez
monitorEvents()
pour consigner les événements déclenchés d'un nœud dans la console (vidéo).
Chrome 70
- Expressions actives dans la console
- Mettre en surbrillance les nœuds DOM lors de l'évaluation eager
- Optimisations du panneau "Performances"
- Débogage plus fiable
- Activer la limitation de bande passante réseau à partir du menu Commandes
- Points d'arrêt conditionnels de la saisie semi-automatique
- Coupure sur les événements AudioContext
- Déboguer des applications Node.js avec ndb
- Astuce: Mesurez les interactions utilisateur réelles avec l'API User Timing
Chrome 68
- Évaluation impérative
- Indices d'argument
- Saisie semi-automatique des fonctions
- Mots clés ES2017
- Lighthouse 3.0 dans le panneau "Audits"
- Compatibilité avec BigInt
- Ajouter des chemins d'accès aux propriétés dans le volet de surveillance
- Déplacement de l'option "Afficher les codes temporels" dans les paramètres
- Astuce supplémentaire: Méthodes moins connues dans la console (vidéo)
Chrome 67
- Rechercher dans tous les en-têtes réseau
- Aperçus des valeurs de variables CSS
- Copier en tant qu'exploration
- Nouveaux audits, options de configuration des ordinateurs de bureau et affichage des traces
- Arrêter les boucles infinies
- Temps utilisateur dans les onglets "Performances"
- Instances de VM JavaScript clairement répertoriées dans le panneau "Mémoire"
- Onglet "Réseau" renommé "Onglet "Page"
- Modifications apportées au thème sombre
- Informations sur la transparence des certificats dans le panneau "Sécurité"
- Fonctionnalités d'isolation de sites dans le panneau "Performances"
- Astuce: panneau des calques + inspecteur d'animations (vidéo)
Chrome 66
- Blackbox dans le panneau "Network" (Réseau)
- Régler automatiquement le zoom en mode Appareil
- Impression élégante dans les onglets "Preview" (Aperçu) et "Response" (Réponse)
- Prévisualiser le contenu HTML dans l'onglet "Aperçu"
- Prise en charge des remplacements locaux pour les styles en HTML
- Astuce: Scripts du framework Blackbox pour rendre les points d'arrêt de l'écouteur d'événements plus utiles
Chrome 65
- Remplacements locaux
- Nouveaux outils d'accessibilité
- Onglet "Modifications"
- Nouveaux outils d'optimisation du référencement et d'audit des performances
- Plusieurs enregistrements dans le panneau "Performances"
- Exécution de code étape fiable avec des nœuds de calcul en code asynchrone
- Astuce bonus: Automatiser les actions des outils de développement avec Puppeteer (vidéo)
Chrome 64
- Analyseur de performances
- Barre latérale de la console
- Regrouper les messages similaires de la Console
- Astuce: Activer/Désactiver la pseudo-classe de survol (vidéo)
Chrome 63
- Assistance au débogage distant multiclient
- Workspaces 2.0
- Quatre nouveaux audits
- Simuler des notifications push avec des données personnalisées
- Déclencher des événements de synchronisation en arrière-plan à l'aide de tags personnalisés
- Astuce supplémentaire: Points d'arrêt de l'écouteur d'événements (vidéo)
Chrome 62
- Le premier niveau vous attend dans la console
- Nouveaux workflows de captures d'écran
- Mise en surbrillance de la grille CSS
- Nouvelle API Console permettant d'interroger des objets
- Nouveaux filtres de la console
- Importations HAR dans le panneau "Network"
- Ressources de cache prévisualisables
- Débogage plus prévisible du cache
- Couverture de code au niveau du bloc
Chrome 61
- Simulation de limitation de la bande passante sur les appareils mobiles
- Afficher l'utilisation de l'espace de stockage
- Afficher la date à laquelle un service worker a mis en cache les réponses
- Activer la jauge de FPS à partir du menu Commandes
- Définir le comportement de la roulette de la souris pour zoomer ou faire défiler
- Compatibilité au débogage avec les modules ES6
Chrome 60
- Nouveau panneau "Audits"
- Badges tiers
- Nouveau geste pour "Continuer vers ce lieu"
- Passer à l'approche asynchrone
- Aperçus plus détaillés des objets dans la console
- Sélection du contexte plus informative dans la console
- Informations en temps réel dans l'onglet "Couverture"
- Options de limitation de la bande passante réseau simplifiées
- Pile asynchrones activées par défaut