Neue CSS-Farbtypen und -Farbräume, trigonometrische CSS-Funktionen und die View Transitions API
Sofern nicht anders angegeben, gelten die folgenden Änderungen für die neueste Betaversion der Chrome-Betaversion für Android, ChromeOS, Linux, macOS und Windows. Weitere Informationen zu den hier aufgeführten Funktionen findest du über die bereitgestellten Links oder in der Liste auf ChromeStatus.com. Chrome 111 ist seit dem 9. Februar 2023 als Betaversion verfügbar. Du kannst die neuesten Versionen unter Google.com für Computer oder im Google Play Store auf Android herunterladen.
CSS
Neue CSS-Farbtypen und -bereiche
Alle unter CSS-Farbstufe 4 beschriebenen Funktionen 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.
Weitere Informationen zu diesen neuen Farbtypen und -abständen finden Sie im Leitfaden zu High Definition CSS-Farben.
Die color-mix()-Funktion
Die unglaublich nützliche color-mix()-Funktion von CSS Color 5 ist ebenfalls verfügbar. Diese Funktion ermöglicht es, einen Prozentsatz einer Farbe in eine andere Farbe in einem beliebigen unterstützten Farbraum zu mischen. Im folgenden Beispiel werden 10% von blue in SRGB mit white vermischt.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
CSS-Selektoren 4 Pseudo-Klasse :nth-child(an + b of S)
Erweitert :nth-child(an + b) und :nth-last-child(), um einen Selektor zu verwenden. Zum Beispiel ist :nth-child(3 of .c) die dritte .c unter einem bestimmten übergeordneten Element. Weitere Informationen finden Sie im Beitrag Mehr Kontrolle über die :nth-child()-Auswahl mit der of S-Syntax.
CSS-Stammschriftarten
Fügt der vorhandenen Stammschrifteinheit rem die Stammschrifteinheiten rex, rch, ric und rlh hinzu.
Trigonometrische CSS-Funktionen
Die trigonometrischen Funktionen sin(), cos(), tan(), asin(), acos(), atan() und atan2() wurden den mathematischen CSS-Ausdrücken hinzugefügt.
Stil-Container-Abfragen für benutzerdefinierte CSS-Eigenschaften
Fügt die Funktion style() zu @container-Regeln hinzu, damit Stile basierend auf den berechneten Werten benutzerdefinierter Eigenschaften eines Ancestor-Elements angewendet werden können.
Das Attribut baseline-source
Mit der Property baseline-source können Webentwickler angeben, ob ein Feld auf Inline-Ebene die first- oder last-Referenz für die Ausrichtung in einem Linebox-Element verwenden soll.
Web APIs
Berechtigungs- und Berechtigungsrichtlinienstring window-management
Chrome 111 fügt window-management als Alias für die window-placement-Berechtigungs- und Berechtigungsrichtlinien-Strings hinzu. Dies ist Teil einer größeren Bemühung, die Strings umzubenennen, indem window-placement schließlich eingestellt und entfernt wird. Durch die Änderung der Terminologie wird die Langlebigkeit des Deskriptors verbessert, da sich die Window Management API im Laufe der Zeit weiterentwickelt.
Media Session API: Aktionen für Präsentationen
Der vorhandenen Media Session API werden die Aktionen previousslide und nextslide hinzugefügt.
Größe ArrayBuffer und erweiterbar SharedArrayBuffer
Erweitern Sie die ArrayBuffer-Konstruktoren so, dass sie eine zusätzliche maximale Länge nehmen, die ein direktes Wachstum und eine Verkleinerung der Puffer ermöglicht. Entsprechend wird SharedArrayBuffer erweitert, um eine zusätzliche maximale Länge zu erhalten, die direktes Wachstum ermöglicht.
Spekulationsregeln: Schlüssel der Verweisrichtlinie
Dadurch wird die Syntax für Spekulationsregeln erweitert, sodass Entwickler die Verweisrichtlinie angeben können, die für spekulative Anfragen verwendet werden soll, die durch Spekulationsregeln ausgelöst werden. Damit wird auch die Anforderung einer "ausreichend strengen Verweis-URL" wieder eingeführt.
Deklaratives Shadow-DOM für Streaming
Dadurch wird das Streaming unterstützt, da der Schattenstamm an der Öffnung statt am schließenden Vorlagen-Tag angehängt wird.
Transitions API ansehen
Ermöglicht das Erstellen ausgefeilter Übergänge in Single-Page-Anwendungen (SPAs) durch Erstellen von Snapshots von Ansichten und Zulassen einer Änderung des DOMs ohne Überschneidung zwischen den Status. Verwenden Sie „Übergänge anzeigen“, um benutzerdefinierte Übergänge zu erstellen, oder verwenden Sie eine einfache Standardeinstellung für Überblendungen, um die Nutzererfahrung zu verbessern.
Im Artikel für Chrome-Entwickler finden Sie weitere Informationen und Beispiele für Umstellungen, die Ihnen den Einstieg erleichtern.
Erweiterungen für skalierbare WebRTC-Videocodierung
Diese Erweiterung definiert eine Standardmethode zur Auswahl zwischen möglichen SSVC-Konfigurationen (Skalierbare Video Coding-Konfigurationen) auf einem ausgehenden WebRTC-Videotrack.
WebXR-Attribut „enabledFeatures“
Gibt den Satz von Funktionen zurück, die für dieses XRSession gemäß XRSessionInit aktiviert wurden, und die implizierten Elemente, die von der Spezifikation für den angegebenen Modus und die angegebenen Funktionen benötigt werden. Für eine gewährte Sitzung enthält dies alle requiredFeatures, kann aber eine Teilmenge von optionalFeatures sein. Bei den meisten Funktionen gibt es alternative Möglichkeiten, festzustellen, ob sie gewährt wurden. Bei einigen Funktionen ist das Signal, ob eine Funktion aktiviert wurde oder nicht, jedoch eng mit den Daten für eine Funktion verknüpft, die gerade nicht verfügbar ist, und nicht, dass Daten nie verfügbar sind. Durch die Abfrage von enabledFeatures können Sie feststellen, ob hilfreiche Hinweise angezeigt werden sollen, z. B. um das Tracking zu verbessern oder das Tracking zu starten, oder ob eine Funktion in der aktuellen Sitzung nie unterstützt wird.
Ursprungstests laufen
In Chrome 111 können Sie die folgenden neuen Ursprungstests aktivieren.
Testzeitraum für die Einstellung der CSP-Umgehung für connect-src in der Web Payment API
Die Web Payment API kann die CSP-Richtlinie „connect-src“ beim Abrufen des Manifests nicht mehr umgehen. Nach der Einstellung muss die CSP-Richtlinie „connect-src“ einer Website die in einem PaymentRequest-Aufruf angegebene URL der Zahlungsmethode sowie alle anderen URLs zulassen, die von der Methode verkettet werden, um ihr Manifest abzurufen.
Diese Umgehungsfunktion wird in Chrome 111 mit einem Reverse-Origin-Test von 111 bis 113 für Entwickler entfernt, die die Umgehung vorübergehend wieder aktivieren müssen. Registrieren Sie sich für den umgekehrten Einstellungstest für die CSP-Umgehung von connect-src, um dies zu aktivieren.
Bild im Bild dokumentieren
Das Document Picture-in-Picture-API ist eine neue API zum Öffnen eines Always-On-Fensters, das mit beliebigem HTML-Inhalt gefüllt werden kann. Dies ist eine Erweiterung der bestehenden Picture-in-Picture-API, die nur das Einfügen eines HTMLVideoElement in ein BiB-Fenster ermöglicht. So können Webentwickler Nutzern ein besseres BiB-Erlebnis bieten.
Lesen Sie die Dokumentation zu Bild im Bild dokumentieren.
Registrieren Sie sich für den Ursprungstest „Document Picture-In-Picture“.
Einstellungen und Löschungen
In dieser Version von Chrome werden die unten aufgeführten Einstellungen und Entfernungen eingeführt. Unter ChromeStatus.com finden Sie eine Liste der geplanten Einstellungen, aktuellen Einstellungen und vorherigen Entfernungen.
In dieser Version von Chrome stehen drei Funktionen nicht mehr zur Verfügung.
Zahlungsmittel entfernen
PaymentInstruments ist die Web-API, die die Nicht-JIT-Installation von Zahlungs-Apps unterstützt (siehe https://w3c.github.io/payment-Handler/). Dabei wurde davon ausgegangen, dass der Browser die tatsächlichen Details des Zahlungsmittels speichern würde, was sich jedoch nicht als wahr herausgefunden hat und dass einige Datenschutzlecks vorliegen. Es ist auch in keinem anderen Browser verfügbar und wir haben kein Interesse von anderen Browser-Anbietern festgestellt. Aus diesem Grund wurde diese API verworfen und entfernt.
CSP-Umgehung für connect-src in der Web Payment API entfernen
Die Web Payment API kann die CSP-Richtlinie connect-src beim Abrufen des Manifests nicht mehr umgehen. Nach der Entfernung muss die CSP-Richtlinie „connect-src“ einer Website die in einem „PaymentRequest“-Aufruf angegebene URL der Zahlungsmethode sowie alle anderen URLs zulassen, die von der Methode verkettet werden, um ihr Manifest abzurufen.
Unter „Ursprungstests“ finden Sie Informationen zu einer Methode, mit der Sie einen Einstellungstest aktivieren können, sodass Sie aufgrund der Entfernung mehr Zeit für die erforderlichen Änderungen haben.
Händleridentität bei canmakepayment Ereignis
Das Service Worker-Ereignis canmakepayment teilt dem Händler mit, ob der Nutzer eine Karte in einer installierten Zahlungs-App hinterlegt hat. Es werden unbemerkt der Ursprungsort und beliebige Daten des Händlers vom Ursprung der Zahlungs-App an einen Service Worker weitergegeben. Diese ursprungsübergreifende Kommunikation erfolgte bei der Erstellung von „PaymentRequest“ in JavaScript, erforderte keine Nutzergeste und zeigte keine Benutzeroberfläche. Dieser stille Datenübergang wurde aus dem Ereignis canmakepayment und dem Android-Intent IS_READY_TO_PAY entfernt.