Nouvelles unités de fenêtre d'affichage CSS, API Federated Credential Management, polices Variable COLRv1, et plus encore.
Sauf indication contraire, les modifications décrites ci-dessous s'appliquent à la dernière version bêta de Chrome pour Android, ChromeOS, Linux, macOS et Windows. Pour en savoir plus sur les fonctionnalités disponibles sur cette page, cliquez sur les liens fournis ou consultez la liste disponible sur ChromeStatus.com. Chrome 108 est en version bêta depuis le 27 octobre 2022. Vous pouvez télécharger les dernières mises à jour sur Google.com pour ordinateur ou sur le Google Play Store pour Android.
CSS
Chrome 108 inclut un certain nombre de nouvelles fonctionnalités CSS.
Dépassement CSS pour les éléments remplacés
Chrome commencera à déployer une modification qui permettra aux développeurs d'utiliser la propriété overflow existante avec des éléments remplacés qui apparaissent en dehors de la zone de contenu. Associé à object-view-box, ce code permet de créer une image avec un halo ou une ombre personnalisé appliqué, avec un comportement de dépassement d'encre approprié comme le ferait une ombre CSS.
Il s'agit d'une modification destructive potentielle. Pour en savoir plus, consultez la section Une modification entraînant un débordement sur les éléments remplacés.
Blocs de fenêtre d'affichage petite, grande, dynamique et logique
Les unités de petite taille (svw, svh, svi, svb, svmin, svmax), grandes (lvw, lvh, lvi, lvb, lvmin, lvmax), dynamiques (dvw, dvh, dvi, dvb, dvmin, dvmax) et logiques (vi, vb) sont désormais prises en charge.
Compatibilité avec les CSS break-after, break-before et break-inside
Prise en charge de la valeur d'éviter des propriétés de fragmentation CSS break-before, break-after et break-inside lors de l'impression. Cette valeur indique au navigateur de ne pas interrompre la création avant, après ou à l'intérieur de l'élément auquel elle est appliquée. Par exemple, le CSS suivant évite qu'une figure ne soit rompue au niveau d'un saut de page.
figure {
break-inside: avoid;
}
Cette fonctionnalité a été ajoutée, car Chrome 108 prend désormais en charge l'impression LayoutNG.
Dernier alignement de l'élément de référence
Cette fonctionnalité permet aux développeurs d'aligner les éléments dans une mise en page flexible ou en grille en fonction de leur dernière référence, et non de la première. Pour ce faire, utilisez les propriétés suivantes:
align-items: last baseline;justify-items: last baseline;align-self: last baseline;justify-self: last baseline;
ContentVisibilityAutoStateChanged événement
Événement qui se déclenche sur un élément avec content-visibility: auto lorsque l'état de son rendu change en raison de l'un des attributs qui rendent l'élément pertinent pour l'utilisateur.
Cela permet aux développeurs de mieux contrôler quand ils doivent arrêter ou démarrer l'affichage en réponse à l'arrêt ou au démarrage de l'affichage par le user-agent de la sous-arborescence de visibilité du contenu. Par exemple, le développeur peut vouloir arrêter les mises à jour de React dans une sous-arborescence qui n'est pas affichée par le user-agent. De même, le développeur peut vouloir arrêter toute autre mise à jour de script (par exemple, les mises à jour de canevas) lorsque le user-agent n'affiche pas l'élément.
API Web
Federated Credentials Management (anciennement WebID)
L'API Federated Credential Management permet aux utilisateurs d'apporter leur identité fédérée pour se connecter à des sites Web d'une manière compatible avec les améliorations de la confidentialité des navigateurs.
Extensions de source multimédia dans les nœuds de calcul
Active l'utilisation de l'API Media Source Extensions (MSE) à partir des contextes DedicatedWorker afin d'améliorer les performances de mise en mémoire tampon des contenus multimédias pour la lecture par un élément HTMLMediaElement dans le contexte Windows principal. En créant un objet MediaSource dans un contexte DedicatedWorker, une application peut ensuite en obtenir un MediaSourceHandle et transférer ce handle vers le thread principal afin de l'associer à un HTMLMediaElement. Le contexte ayant créé l'objet MediaSource peut ensuite l'utiliser pour mettre des médias en mémoire tampon.
Sec-CH-Prefers-Reduced-Motion Préférence utilisateur pour les fonctionnalités multimédias - En-tête d'indications du client
La section User Preference Media Features Media Features Client Hints Headers définit un ensemble d'en-têtes HTTP Client Hints concernant les fonctionnalités multimédias des préférences de l'utilisateur, telles que définies par le niveau 5 des requêtes média. Utilisés comme indicateurs critiques pour le client, ces en-têtes permettent aux serveurs de faire des choix judicieux concernant, par exemple, l'intégration CSS. Sec-CH-Prefers-Reduced-Motion reflète les préférences prefers-reduced-motion de l'utilisateur.
Lecteurs WebTransport BYOB
Compatible avec les lecteurs BYOB(Bring Your Own Buffer) pour WebTransport afin de permettre la lecture dans un tampon fourni par le développeur. Les lecteurs BYOB peuvent réduire le nombre de copies de tampon et les allocations de mémoire.
Caractères génériques dans les origines de la règle d'autorisation
La spécification des règles d'autorisation définit un mécanisme qui permet aux développeurs d'activer et de désactiver de manière sélective l'utilisation de diverses API et fonctionnalités du navigateur. Une fonctionnalité de ce mécanisme permet d'activer des fonctionnalités uniquement sur des origines explicitement énumérées (par exemple, https://foo.com/). Ce mécanisme n'est pas assez flexible pour la conception de certains CDN, qui diffusent du contenu via une origine susceptible d'être hébergé sur l'un des centaines de sous-domaines possibles.
Par conséquent, cette fonctionnalité ajoute la prise en charge des caractères génériques dans une règle d'autorisation structurée comme SCHEME://*.HOST:PORT (par exemple, https://*.foo.com/) où une origine valide peut être créée à partir de SCHEME://HOST:PORT (par exemple, https://foo.com/). HOST doit être un domaine enregistrable. Cela signifie que https://*.bar.foo.com/ fonctionne, mais pas https://*.com/ (si vous souhaitez autoriser tous les domaines à utiliser cette fonctionnalité, déléguez simplement cette opération à *).
Méthodes de synchronisation pour AccessHandles dans l'API File System Access
Met à jour les méthodes asynchrones flush(), getSize() et truncate() dans FileSystemSyncAccessHandle dans l'API File System Access vers des méthodes synchrones.
FileSystemSyncAccessHandle propose actuellement une combinaison de méthodes de synchronisation et asynchrone, ce qui entrave les performances et la facilité d'utilisation, en particulier pour les applications portant C/C++ vers Wasm. Cette mise à jour permettra d'assurer une utilisation cohérente de l'API et d'améliorer les performances des bibliothèques basées sur Wasm.
Il s'agit d'une modification destructive potentielle. Pour en savoir plus, consultez Modification destructive: méthodes de synchronisation pour les AccessHandles.
UI conditionnelle WebAuthn
L'UI conditionnelle pour WebAuthn est compatible avec Windows 22H2 ou version ultérieure, macOS et Android P (ou version ultérieure). L'UI WebAuthn sur les plates-formes de bureau a également été actualisée.
Polices COLRv1 variables et détection des caractéristiques des polices
Compatibilité avec les polices variables COLRv1
Les polices à vecteur de couleur COLRv1 sont compatibles depuis Chrome 98, mais cette version initiale n'acceptait que les fonctionnalités statiques de la table COLRv1. La spécification COLRv1 définit l'intégration avec les variantes OpenType, ce qui permet de modifier les propriétés de police des dégradés et des transformations par la modification des paramètres d'axe variables. Cette deuxième étape prend en charge de telles variantes dans COLRv1.
Extensions de condition font-tech() et font-format() vers CSS @supports
L'utilisation de font-tech() et font-format() avec les @supports CSS permet de détecter la technologie et le format de police compatibles, ainsi que d'améliorer progressivement le contenu. L'exemple suivant teste la compatibilité des polices COLRv1.
@supports font-tech(color-COLRv1) {
}
Compatibilité de la fonction tech() dans le descripteur @font-face src:
Les polices CSS de niveau 4 offrent un moyen supplémentaire de sélectionner ou de filtrer des ressources de police. La fonction tech() a été introduite, qui permet de transmettre une liste des technologies de police nécessaires au fonctionnement de ce blob de police respectif. Le user-agent sélectionne ensuite la première ressource appropriée.
Chrome pour Android
L'OSK Android redimensionne désormais la fenêtre d'affichage visuelle par défaut
Le clavier à l'écran Android redimensionne la fenêtre d'affichage visuelle par défaut plutôt que le bloc conteneur initial. Les auteurs peuvent désactiver cette option à l'aide de la nouvelle clé de méta-vue de fenêtre interactive-widget.
Phases d'évaluation
Cette version de Chrome propose deux nouvelles phases d'évaluation.
Identité du marchand dans l'événement canmakepayment
L'événement service worker canmakepayment permet au marchand de savoir si l'utilisateur a enregistré une carte dans une application de paiement installée. Elle transmet silencieusement l'origine du marchand et des données arbitraires à un service worker depuis l'origine de l'application de paiement. Cette communication multi-origine se produit lors de la construction de PaymentRequest en JavaScript, ne nécessite aucun geste de l'utilisateur et n'affiche aucune interface utilisateur. Essai pour les développeurs pour la suppression des champs d'identité dans "canmakepayment" L'événement peut être activé via: chrome://flags/#clear-identity-in-can-make-payment. Si vous activez cet indicateur, les champs d'identité de "canmakepayment" seront vides (et l'intent IS_READY_TO_PAY Android).
Pour en savoir plus, consultez l'article Mise à jour du comportement des événements CanMakePayment de l'API Payment Handler.
API NotrestdReason du cache amélioré
L'API NotRestaurerdReason indique dans l'API PerformanceNavigationTiming la liste des raisons pour lesquelles une page n'est pas diffusée depuis BFcache dans une arborescence de frames.
Des pages peuvent être bloquées du cache amélioré pour différentes raisons, par exemple celles requises par la spécification ou spécifiques à l'implémentation du navigateur. Les développeurs peuvent obtenir le taux de succès de BFCache sur leur site en utilisant le paramètre persistant du gestionnaire de pagesshows et PerformanceNavigationTiming.type(back-forward). Cette API permet aux sites de collecter des informations sur les raisons pour lesquelles BFCache n'est pas utilisé lors d'une navigation dans l'historique, afin qu'ils puissent prendre des mesures sur chaque motif et rendre leur page compatible avec le cache amélioré.
Abandons et suppressions
Cette version de Chrome introduit les abandons et les suppressions indiqués ci-dessous. Consultez le site ChromeStatus.com pour obtenir la liste des abandons prévus, des abandons actuels et des suppressions précédentes.
Abandons
Dans cette version de Chrome, une fonctionnalité n'est plus disponible.
Abandon et suppression de window.defaultStatus et window.defaultstatus
Il s'agit d'API non standards qui ne sont pas implémentées par tous les navigateurs et n'ont aucun effet sur leur comportement. Cela les nettoie et supprime un éventuel signal d'empreinte digitale.
Ils étaient initialement utilisés pour modifier/contrôler la "barre d'état". en bas des fenêtres du navigateur. Toutefois, ils n'ont jamais eu d'effet réel sur la barre d'état de Chrome et ne sont pas des attributs standardisés. Gecko n'accepte plus ces attributs depuis la version 23. WebKit accepte toujours ces attributs. L'attribut window.status associé est standardisé, mais ne doit jamais avoir d'incidence sur la barre d'état de la fenêtre.
Déménagements
Cette version de Chrome supprime quatre fonctionnalités.
Supprimer ImageDecoderInit.premultiplyAlpha
La fonctionnalité n'a aucun effet observable dans les cas d'utilisation principaux, mais peut limiter les implémentations de manière non optimale. Consultez ce problème pour obtenir une description plus détaillée. Conformément au consensus des éditeurs de spécifications WebCodecs et au manque d'utilisation (entre 0,000000339 % et 0,00000687% de chargements de page par compteur d'utilisation dans M106).
Supprimer navigateEvent.restoreScroll()
Remplacement de restoreScroll() par navigateEvent.scroll(). scroll() fonctionne de manière identique, sauf qu'il permet au développeur de contrôler le temps de défilement pour les navigations non traversées (scroll() fonctionne lorsque le défilement n'est pas une restauration, d'où le changement de nom et de comportement).
Supprimer navigateEvent.transitionWhile()
transitionWhile() est remplacé par navigateEvent.intercept() en raison de défauts de conception signalés par les développeurs. La fonction intercept() se comporte presque de la même manière que transitionwhile(), mais au lieu d'accepter un paramètre Promise obligatoire, elle utilise une fonction de gestionnaire facultative qui renvoie une promesse. Cela permet au navigateur de contrôler le moment où le gestionnaire s'exécute, ce qui est plus tardif et plus intuitif que pour transitionWhile().
Suppression du googIPv6 de WebRTC mediaConstraint
"googIPv6: false" permet de désactiver la compatibilité IPv6 dans WebRTC, comme dans l'exemple suivant.
new RTCPeerConnection({}, {mandatory:{googIPv6:false}});
IPv6 est activé par défaut depuis de nombreuses années et nous ne devrions pas être en mesure de le désactiver. Il s'agit d'une ancienne API qui n'existe pas dans la spécification.