Neue CSS-Farbtypen und -Farbräume, CSS-Trigonometriefunktionen und die View Transitions API.
Sofern nicht anders angegeben, gelten die folgenden Änderungen für die neueste Version des Chrome-Betakanals für Android, ChromeOS, Linux, macOS und Windows. Weitere Informationen zu den hier aufgeführten Funktionen finden Sie über die bereitgestellten Links oder in der Liste auf ChromeStatus.com. Chrome 111 ist seit dem 9. Februar 2023 als Betaversion verfügbar. Sie können die aktuelle Version auf Google.com für Computer oder im Google Play Store für Android herunterladen.
CSS
Neue CSS-Farbtypen und -Bereiche
Alle Funktionen, die unter CSS-Farbebene 4 beschrieben sind, sind jetzt aktiviert. Dazu gehören vier geräteunabhängige Farbtypen (Lab, OkLab, Lch und Oklch), die Funktion color() und benutzerdefinierte Farbräume für Farbverläufe und Animationen.
Im High Definition CSS-Farbleitfaden erfahren Sie mehr über diese neuen Farbtypen und ‑räume.
Die color-mix()-Funktion
Die äußerst nützliche Funktion color-mix() aus CSS Color 5 ist ebenfalls verfügbar. Mit dieser Funktion können Sie in jedem unterstützten Farbraum einen Prozentsatz einer Farbe mit einer anderen mischen. Im folgenden Beispiel werden 10% von blue in white in SRGB gemischt.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
CSS-Selektoren – Pseudoklasse :nth-child(an + b of S)
Erweitert :nth-child(an + b) und :nth-last-child() um einen Selektor. Beispiel: :nth-child(3 of .c) ist das dritte .c unter einem bestimmten übergeordneten Element. Weitere Informationen finden Sie im Hilfeartikel Mehr Kontrolle über :nth-child()-Auswahlen mit der of S-Syntax.
CSS-Schrifteinheiten der Basis
Fügen Sie der vorhandenen Stammschriftarteinheit rem die Stammschriftarteinheiten rex, rch, ric und rlh hinzu.
Trigonometrische Funktionen in CSS
Die trigonometrischen Funktionen sin(), cos(), tan(), asin(), acos(), atan() und atan2() wurden zu den mathematischen Ausdrücken in CSS hinzugefügt.
Containerabfragen für benutzerdefinierte CSS-Eigenschaften stylen
Fügen Sie @container-Regeln die Funktion style() hinzu, um Stile basierend auf den berechneten Werten benutzerdefinierter Eigenschaften eines übergeordneten Elements anzuwenden.
Das baseline-source-Attribut
Mit der Property baseline-source können Webentwickler angeben, ob für ein Feld auf Inline-Ebene die Baseline first oder last für die Ausrichtung innerhalb eines Lineboxes verwendet werden soll.
Web APIs
String für die Berechtigung und die Berechtigungsrichtlinie window-management
In Chrome 111 wird window-management als Alias für window-placement-Berechtigungs- und Berechtigungsrichtlinienstrings hinzugefügt. Dies ist Teil eines größeren Projekts, bei dem die Strings umbenannt werden, indem window-placement eingestellt und entfernt wird. Durch die Änderung der Terminologie wird die Langlebigkeit des Descriptors verbessert, da sich die Window Management API im Laufe der Zeit weiterentwickelt.
Media Session API: Aktionen für die Präsentation von Folien
Fügen der vorhandenen Media Session API die Aktionen previousslide und nextslide hinzu.
Vergrößerbar ArrayBuffer und erweiterbar SharedArrayBuffer
Erweitern Sie die ArrayBuffer-Konstruktoren um eine zusätzliche maximale Länge, die das In-Place-Wachstum und Schrumpfen von Puffern ermöglicht. Ähnlich wird SharedArrayBuffer um eine zusätzliche maximale Länge erweitert, die ein In-Place-Wachstum ermöglicht.
Spekulationsregeln: Schlüssel für die Verweisrichtlinie
Dadurch wird die Syntax der Spekulationsregeln erweitert, sodass Entwickler die Verweisrichtlinie für spekulative Anfragen angeben können, die durch Spekulationsregeln ausgelöst werden. Außerdem wird die Anforderung „Richtlinie für strikte Verweisquellen“ wieder eingeführt.
Deklaratives Shadow-DOM streamen
Dadurch wird Streaming unterstützt, da der Schatten-Root nicht mehr am schließenden, sondern am öffnenden Vorlagen-Tag angehängt wird.
Transitions API ansehen
Ermöglicht die Erstellung von ansprechenden Übergängen in Single-Page-Anwendungen (SPAs), indem Ansichten als Snapshot erfasst und das DOM ohne Überschneidungen zwischen Zuständen geändert werden kann. Mithilfe von Ansichtsübergängen können Sie benutzerdefinierte Übergänge erstellen oder einen einfachen Cross-Fade-Standard verwenden, um die Nutzerfreundlichkeit zu verbessern.
Weitere Informationen und Beispielübergänge finden Sie im Artikel für Chrome-Entwickler.
WebRTC Scalable Video Coding-Erweiterungen
Diese Erweiterung definiert eine Standardmethode für die Auswahl zwischen möglichen SVC-Konfigurationen (Scalable Video Coding) auf einem ausgehenden WebRTC-Videotrack.
WebXR-Attribut enabledFeatures
Gibt die Features zurück, die für diese XRSession gemäß XRSessionInit aktiviert wurden, sowie die impliziten Features, die gemäß der Spezifikation für den angegebenen Modus und die angegebenen Features erforderlich sind. Bei einer gewährten Sitzung enthält diese Liste alle requiredFeatures, kann aber auch nur einen Teil von optionalFeatures umfassen. Bei den meisten Funktionen gibt es alternative Möglichkeiten, festzustellen, ob sie gewährt wurden. Bei einigen Funktionen hängt das Signal dafür jedoch eng mit Daten zusammen, die für eine Funktion gerade nicht verfügbar sind, anstatt dass Daten überhaupt nicht verfügbar sind. Wenn Sie enabledFeatures abfragen, können Sie feststellen, ob hilfreiche Hinweise (z. B. zur Verbesserung oder zum Starten des Trackings) angezeigt werden sollten oder ob eine Funktion in der aktuellen Sitzung nie unterstützt wird.
Laufende Ursprungstests
In Chrome 111 können Sie die folgenden neuen Ursprungstests aktivieren.
Test zur Einstellung der Umgehung der connect-src-CSP in der Web Payment API
Die Möglichkeit, dass die Web Payment API die CSP-Richtlinie „connect-src“ beim Abrufen des Manifests umgeht, wird eingestellt. Nach der Einstellung muss die CSP-Richtlinie „connect-src“ einer Website die URL der Zahlungsmethode zulassen, die in einem PaymentRequest-Aufruf angegeben ist, sowie alle anderen URLs, die die Methodenabfolgen zum Abrufen des Manifests verwenden.
Diese Umgehung wird in Chrome 111 entfernt. Für Entwickler, die die Umgehung vorübergehend wieder aktivieren müssen, wird ein Test mit umgekehrter Herkunft von Version 111 auf Version 113 durchgeführt. Wenn Sie diese Funktion aktivieren möchten, registrieren Sie sich für den Testzeitraum für die Umkehrung der Einstellung der connect-src-CSP-Umgehung.
Funktion „Bild im Bild“ für Dokumente
Die Document Picture-in-Picture API ist eine neue API, mit der ein immer sichtbares Fenster geöffnet werden kann, das mit beliebigen HTML-Inhalten gefüllt werden kann. Dies ist eine Erweiterung der bestehenden Bild-im-Bild-API, mit der nur ein HTMLVideoElement in ein Bild-im-Bild-Fenster eingefügt werden kann. So können Webentwickler Nutzern eine bessere PiP-Funktion bieten.
Lesen Sie die Dokumentation zu Bild-im-Bild-Ansicht für Dokumente.
Registrieren Sie sich für den Ursprungstest für die Funktion „Bild im Bild“ für Dokumente.
Einstellung und Entfernung
In dieser Version von Chrome werden die unten aufgeführten Einstellungsänderungen und Entfernungen eingeführt. Auf ChromeStatus.com finden Sie Listen mit geplanten, aktuellen und früheren Einstellungsvorhaben.
In dieser Version von Chrome werden drei Funktionen entfernt.
PaymentInstruments entfernen
PaymentInstruments ist die Web API, die die Installation von Zahlungs-Apps ohne JIT unterstützt (siehe https://w3c.github.io/payment-handler/). Es wurde unter der Annahme entwickelt, dass der Browser die tatsächlichen Details des Zahlungsmittels speichert. Dies hat sich jedoch als nicht wahr erwiesen und es gibt einige Datenschutzlücken. Es wurde auch nicht in anderen Browsern eingeführt und wir haben auch kein Interesse von anderen Browseranbietern gesehen. Diese API wurde daher eingestellt und entfernt.
connect-src-CSP-Umgehung in der Web Payment API entfernen
Die Möglichkeit, dass die Web Payment API die connect-src-CSP-Richtlinie beim Abrufen des Manifests umgeht, wird eingestellt. Nach dieser Entfernung muss die connect-src CSP-Richtlinie einer Website die URL der Zahlungsmethode zulassen, die in einem PaymentRequest-Aufruf angegeben ist, sowie alle anderen URLs, die die Methode zur Abrufung ihres Manifests verkettet.
Unter „Tests für Ursprünge“ finden Sie Informationen dazu, wie Sie einen Test zur Einstellung aktivieren können, um mehr Zeit für die erforderlichen Änderungen zu haben.
Händleridentität im Ereignis vom Typ canmakepayment
Über das Service Worker-Ereignis canmakepayment erfährt der Händler, ob der Nutzer in einer installierten Zahlungs-App eine hinterlegte Karte hat. Bisher wurden die Herkunft des Händlers und beliebige Daten aus der Herkunft der Zahlungs-App an einen Service Worker übergeben. Diese plattformübergreifende Kommunikation erfolgte bei der Erstellung von PaymentRequest in JavaScript, erforderte keine Nutzeraktion und zeigte keine Benutzeroberfläche an. Dieser stille Datenübergang wurde aus dem canmakepayment-Ereignis und dem Android-IS_READY_TO_PAY-Intent entfernt.