Verbesserungen bei Popover-Aufruf und Ankerpositionierung

Chrom 133
Stabiles Veröffentlichungsdatum: 4. Februar 2025

Sofern nicht anders angegeben, gelten die folgenden Änderungen für die stabile Channel-Version von Chrome 133 für Android, ChromeOS, Linux, macOS und Windows.

HTML und DOM
Der Hint-Wert des Popover-Attributs
Die Popover-API spezifiziert das Verhalten für zwei Werte des Popover-Attributs: auto und manuell. Dieses Feature beschreibt einen dritten Wert, popover=hint. Hinweise, die meist mit dem Verhalten des "Tooltip"-Typs in Verbindung gebracht werden, haben ein etwas anderes Verhalten. Der Hauptunterschied besteht darin, dass ein Hinweis dem Wert auto untergeordnet ist, wenn verschachtelte Stapel von Popovers geöffnet werden. Es ist also möglich, ein nicht verwandtes Hinweis-Popover zu öffnen, während ein bestehender Stapel von Auto-Popovers geöffnet bleibt.

Das kanonische Beispiel ist, dass ein <select>-Picker geöffnet ist (popover=auto) und ein durch Hover ausgelöster Tooltip (popover=hint) angezeigt wird. Diese Aktion schließt die <Auswahl>-Auswahl nicht.
Tracking Bug #1416284 | ChromeStatus.com Eintrag</select></select>

Verbesserungen bei der Positionierung von Popover-Aufrufern und Ankern
Fügt einen zwingenden Weg zum Setzen von Invoker-Beziehungen zwischen Popovers mit popover.showPopover({source}) hinzu. Ermöglicht Invoker-Beziehungen, um implizite Ankerelement-Referenzen zu erstellen.
Fehlerverfolgung #364669918 | ChromeStatus.com Eintrag

Popover, das innerhalb eines Invokers verschachtelt ist, sollte diesen nicht erneut aufrufen
Im folgenden Fall aktiviert ein Klick auf den Button das Popover, aber ein Klick auf das Popover selbst sollte das Popover nicht mehr schließen.

<button popovertarget="foo">Aktivieren
<div id="foo" popover="">Klick auf mich sollte mich nicht schließen</div>
</button>
Bisher geschah dies, weil der Popover-Klick auf den <button> überspringt und den Invoker aktiviert, der das Popover schließt. Dies wurde nun auf das erwartete Verhalten geändert.
Fehlerverfolgung #https://crbug.com/379241451 | ChromeStatus.com Eintrag</button>

CSS
Erweiterte CSS-Funktion attr()
Implementiert die in CSS Level 5 spezifizierte Erweiterung von attr(), die neben <string> auch andere Typen und die Verwendung in allen CSS-Eigenschaften erlaubt (zusätzlich zur bestehenden Unterstützung für Pseudo-Element-Inhalte).
MDN attr() | Tracking Bug #246571 | ChromeStatus.com Eintrag | Spec</string>

CSS :open pseudo-class
Die :open-Pseudoklasse passt zu <dialog> und <details>, wenn sie sich in ihrem geöffneten Zustand befinden, und passt zu <select> und <input></input>, wenn sie sich in Modi befinden, die einen Picker haben und der Picker angezeigt wird.
Tracking-Bug #324293874 | ChromeStatus.com Eintrag | Spec</select></details></dialog>

CSS Container-Abfragen für den Scroll-Status
Verwenden Sie Container-Abfragen, um Nachkommen von Containern basierend auf ihrem Scroll-Status zu stylen.
Der Abfragecontainer ist entweder ein Scrollcontainer oder ein Element, das von der Scrollposition eines Scrollcontainers betroffen ist. Die folgenden Zustände können abgefragt werden:

• stuck: Ein klebrig positionierter Container klebt an einer der Kanten der Scrollbox.
• eingerastet: Ein mit Scroll Snap ausgerichteter Container ist derzeit horizontal oder vertikal gefangen.
• scrollbar: Ob ein Scroll-Container in einer abgefragten Richtung gescrollt werden kann.
  Ein neuer Container-Typ: scroll-state lässt Container abfragen.
  Fehlerverfolgung #40268059 | ChromeStatus.com Eintrag | Spec

CSS text-box, text-box-trim, und text-box-edge
Um eine optimale Balance des Textinhalts zu erreichen, ermöglichen die Eigenschaften text-box-trim und text-box-edge zusammen mit der shorthand-Eigenschaft text-box eine feinere Steuerung der vertikalen Ausrichtung von Text.

Die Eigenschaft text-box-trim gibt an, welche Seiten oben oder unten beschnitten werden sollen, und die Eigenschaft text-box-edge gibt an, wie der Rand beschnitten werden soll.
Mit diesen Eigenschaften können Sie die vertikalen Abstände genau steuern, indem Sie die Schriftmetriken verwenden.
Tracking-Bug #1411581 | ChromeStatus.com-Eintrag | Spec

Web-APIs
Animation.overallProgress
Bietet Entwicklern eine bequeme und konsistente Darstellung des Fortschritts einer Animation über alle Iterationen hinweg und unabhängig von der Art der Zeitleiste. Ohne die Eigenschaft overallProgress müssen Sie manuell berechnen, wie weit eine Animation fortgeschritten ist, indem Sie die Anzahl der Iterationen der Animation berücksichtigen und ob die currentTime der Animation ein Prozentsatz der Gesamtzeit ist (wie im Fall von scrollgesteuerten Animationen) oder eine absolute Zeitmenge (wie im Fall von zeitgesteuerten Animationen).
Tracking-Fehler #40914396 | ChromeStatus.com Eintrag | Spec

Die pause()-Methode des Atomics-Objekts
Fügt dem Atomics-Namespace-Objekt die pause()-Methode hinzu, um der CPU mitzuteilen, dass der aktuelle Code einen Spinlock ausführt.
ChromeStatus.com-Eintrag | Spezifikation

CSP-Hash-Berichterstattung für Skripte
Komplexe Webanwendungen müssen aus Sicherheitsgründen oft den Überblick über die heruntergeladenen Subressourcen behalten.
Insbesondere kommende Industriestandards und Best Practices (z. B. PCI-DSS v4) erfordern, dass Webanwendungen ein Inventar aller Skripte führen, die sie herunterladen und ausführen.
Diese Funktion baut auf CSP und der Reporting-API auf, um die URLs und Hashes (für CORS/same-origin) aller Skriptressourcen zu melden, die das Dokument lädt.
Tracking-Bug #377830102 | ChromeStatus.com-Eintrag

DOM zustandserhaltende Verschiebung
Fügt ein DOM-Primitiv (Node.prototype.moveBefore) hinzu, mit dem Elemente im DOM-Baum verschoben werden können, ohne den Zustand des Elements zurückzusetzen.
Beim Verschieben anstelle des Entfernens und Einfügens wird der folgende Zustand beibehalten:

• <iframe>-Elemente bleiben geladen.
• Das aktive Element bleibt im Fokus.
• Popovers, Vollbildschirme und modale Dialoge bleiben geöffnet.
• CSS-Übergänge und Animationen werden fortgesetzt.
  ChromeStatus.com-Eintrag</iframe>

Attribut attributionsrc auf <area></area> anzeigen.
Passt die Exposition des Attributs attributionsrc auf <area></area> an das bestehende Verarbeitungsverhalten des Attributs an, auch wenn es nicht exponiert war.

Außerdem ist es sinnvoll, das Attribut auf <area></area> zu unterstützen, da dieses Element eine Navigationsoberfläche erster Klasse ist und Chrome dies bereits auf den anderen Oberflächen von und window.open unterstützt.
Tracking-Bug #379275911 | ChromeStatus.com Eintrag | Spec

Die FileSystemObserver-Schnittstelle
Die FileSystemObserver-Schnittstelle benachrichtigt Websites über Änderungen am Dateisystem. Websites beobachten Änderungen an Dateien und Verzeichnissen, für die der Benutzer zuvor eine Berechtigung erteilt hat, auf dem lokalen Gerät des Benutzers oder im Bucket File System (auch bekannt als Origin Private File System) und werden über grundlegende Änderungsinformationen, wie den Änderungstyp, informiert.
Tracking-Bug #40105284 | ChromeStatus.com-Eintrag

Mehrere Import-Maps
Import-Maps müssen derzeit vor jedem ES-Modul geladen werden und es kann nur eine einzige Import-Map pro Dokument geben. Das macht sie anfällig und potenziell langsam für den Einsatz in realen Szenarien: Jedes Modul, das vor ihnen geladen wird, unterbricht die gesamte Anwendung, und in Anwendungen mit vielen Modulen werden sie zu einer großen blockierenden Ressource, da die gesamte Map für alle möglichen Module zuerst geladen werden muss.
Diese Funktion ermöglicht mehrere Import-Maps pro Dokument, indem sie auf konsistente und deterministische Weise zusammengeführt werden.
ChromeStatus.com-Eintrag

Storage Access Headers
Bietet einen alternativen Weg für authentifizierte Einbettungen, sich für unpartitionierte Cookies zu entscheiden. Diese Header zeigen an, ob unpartitionierte Cookies in einer bestimmten Netzwerkanfrage enthalten sind (oder sein können), und ermöglichen es Servern, die ihnen bereits gewährten "Speicherzugriffs"-Berechtigungen zu aktivieren. Eine alternative Möglichkeit zur Aktivierung der "Speicherzugriffs"-Erlaubnis erlaubt die Nutzung durch Nicht-Frame-Ressourcen und kann die Latenz für authentifizierte Einbettungen reduzieren.
Fehlerverfolgung #329698698 | ChromeStatus.com Eintrag | Spec

Unterstützung der Erstellung von ClipboardItem mit Promise<domstring>
Das ClipboardItem, das die Eingabe für die asynchrone Methode clipboard write() ist, akzeptiert nun in seinem Konstruktor neben Blobs auch String-Werte. ClipboardItemData kann ein Blob, ein String oder ein Promise sein, das entweder zu einem Blob oder einem String aufgelöst wird.
Tracking-Bug #40766145 | ChromeStatus.com-Eintrag | Spec

WebAssembly Memory64
Der memory64-Vorschlag fügt Unterstützung für lineare WebAssembly-Speicher mit einer Größe von mehr als 2^32 Bit hinzu. Er bietet keine neuen Anweisungen, sondern erweitert stattdessen die bestehenden Anweisungen, um 64-Bit-Indizes für Speicher und Tabellen zu ermöglichen.
ChromeStatus.com Eintrag | Spec

Web-Authentifizierung API: PublicKeyCredential getClientCapabilities() Methode
Mit der Methode PublicKeyCredential getClientCapabilities() können Sie feststellen, welche WebAuthn-Funktionen vom Client des Benutzers unterstützt werden. Die Methode gibt eine Liste der unterstützten Fähigkeiten zurück, die es Entwicklern ermöglicht, Authentifizierungserfahrungen und Arbeitsabläufe basierend auf der spezifischen Funktionalität des Clients anzupassen.
Tracking-Bug #360327828 | ChromeStatus.com Eintrag | Spec

X25519-Algorithmus der Web-Kryptographie-API
Der "X25519"-Algorithmus bietet Werkzeuge zur Durchführung von Schlüsselvereinbarungen unter Verwendung der in [RFC7748] spezifizierten X25519-Funktion. Die Kennung des "X25519"-Algorithmus kann in der SubtleCrypto-Schnittstelle verwendet werden, um auf die implementierten Operationen zuzugreifen: generateKey, importKey, exportKey, deriveKey und deriveBits.
Tracking-Bug #378856322 | ChromeStatus.com Eintrag | Spec</domstring>

Leistung
Einfrieren beim Energiesparen
Wenn der Energiesparmodus aktiviert ist, friert Chrome eine "Browsing-Kontextgruppe" ein, die seit mehr als fünf Minuten ausgeblendet und still war, wenn eine Untergruppe von Frames gleichen Ursprungs darin einen Schwellenwert für die CPU-Auslastung überschreitet, es sei denn, sie:

• Audio- oder Videokonferenzfunktionalität bietet (erkannt durch Identifizierung von Mikrofon, Kamera oder Bildschirm-/Fenster-/Tab-Aufnahme oder einer RTCPeerConnection mit einem "offenen" RTCDataChannel oder einem "Live"-MediaStreamTrack).
• Steuert ein externes Gerät (erkannt mit WebUSB, Web Bluetooth, WebHID oder Web Serial).
• Hält eine Web Lock oder eine IndexedDB-Verbindung, die eine Versionsaktualisierung oder eine Transaktion auf einer anderen Verbindung blockiert.
• Das Einfrieren besteht aus dem Anhalten der Ausführung. Es ist formell in der Page Lifecycle API definiert.
  Der Schwellenwert für die CPU-Nutzung wird so kalibriert, dass etwa 10 % der Hintergrundregisterkarten eingefroren werden, wenn der Energiesparmodus aktiviert ist.
  Tracking-Fehler #325954772 | ChromeStatus.com-Eintrag

Vergröberte Cross-Origin-RenderTime in Element-Timing und LCP anzeigen (unabhängig von Timing-Allow-Origin)
Element-Timing und LCP-Einträge haben ein renderTime-Attribut, das sich am ersten Frame orientiert, in dem ein Bild oder Text gezeichnet wurde.

Dieses Attribut wird derzeit für herkunftsübergreifende Bilder geschützt, indem ein Timing-Allow-Origin-Header für die Bildressource erforderlich ist. Diese Einschränkung kann jedoch leicht umgangen werden (z. B. durch Anzeige eines Bildes gleichen Ursprungs und eines Bildes anderen Ursprungs im selben Frame).

Da dies eine Quelle der Verwirrung war, planen wir stattdessen, diese Einschränkung zu entfernen und stattdessen alle Renderzeiten um 4 ms zu vergröbern, wenn das Dokument nicht herkunftsübergreifend isoliert ist. Dies scheint grob genug zu sein, um zu vermeiden, dass nützliche Dekodierzeitinformationen über herkunftsübergreifende Bilder verloren gehen.
Tracking-Bug #373263977 | ChromeStatus.com Eintrag | Spec

Revert responseStart und Einführung von firstResponseHeadersStart
Wenn 103 Early Hints aktiviert sind, haben Antworten zwei Zeitstempel:

• Wenn die Early Hints ankommen (103)
• Wenn die endgültigen Header ankommen (z. B. 200)
• Als Chrome 115 firstInterimResponseStart auslieferte, um die Messung dieser beiden Zeitstempel zu ermöglichen, änderten wir auch die Bedeutung von responseStart (verwendet von Time to First Byte (TTFB)) in "die endgültigen Header". Dies führte zu einem Kompatibilitätsproblem mit Browsern und Tools, die keine ähnliche Änderung für diese häufig verwendete Metrik vorgenommen haben.
  Chrome 133 macht diese responseStart-Änderung rückgängig, um dieses Kompatibilitätsproblem zu beheben, und führt stattdessen firstResponseHeadersStart ein, um Websites die Messung der Zeit bis zu den letzten Headern zu ermöglichen, während die ursprüngliche Definition von TTFB beibehalten wird.
  Tracking-Bug #40251053 | ChromeStatus.com Eintrag | Spec

Rendering und Grafik
WebGPU: 1-Komponenten-Vertex-Formate (und unorm8x4-bgra)
Fügt zusätzliche Scheitelpunktformate hinzu, die in der ursprünglichen Version von WebGPU aufgrund mangelnder Unterstützung oder alter macOS-Versionen (die von keinem Browser mehr unterstützt werden) nicht vorhanden waren. Die 1-Komponenten-Vertex-Formate ermöglichen es Anwendungen, nur die notwendigen Daten anzufordern, während sie zuvor für 8- und 16-Bit-Datentypen mindestens das Doppelte anfordern mussten. Das unorm8x4-bgra-Format macht es etwas bequemer, BGRA-kodierte Vertex-Farben zu laden, während der gleiche Shader beibehalten wird.
Fehlerverfolgung #376924407 | ChromeStatus.com Eintrag

Ursprungsversuche
Einfrieren beim Energiesparen deaktivieren
Mit dieser Testversion können Websites das Einfrieren beim Energiesparen, das in Chrome 133 enthalten ist, deaktivieren.
Ursprungsversuch | Tracking-Bug #325954772 | ChromeStatus.com-Eintrag | Spec

Referenzziel für wurzelübergreifendes ARIA
Reference Target ist eine Funktion, die es ermöglicht, IDREF-Attribute wie for und aria-labelledby zu verwenden, um auf Elemente innerhalb des Schatten-DOMs einer Komponente zu verweisen, wobei die Kapselung der internen Details des Schatten-DOMs erhalten bleibt. Das Hauptziel dieser Funktion ist es, ARIA zu ermöglichen, über die Grenzen der Schattenwurzel hinweg zu arbeiten.

Eine Komponente kann ein Element in ihrem Schattenbaum angeben, das als ihr "Referenzziel" fungiert. Wenn die Host-Komponente das Ziel eines IDREF ist, wie das for-Attribut eines Labels, wird das Referenzziel zum effektiven Ziel des Labels.

Die Schattenwurzel gibt die ID des Zielelements innerhalb des Schatten-DOM an. Dies geschieht entweder in JavaScript mit dem referenceTarget-Attribut des ShadowRoot-Objekts oder im HTML-Markup mit dem shadowrootreferencetarget-Attribut des <template>-Elements.
Ursprungsversuch | ChromeStatus.com-Eintrag

Abwertungen und Entfernungen
WebGPU-Grenzwert maxInterStageShaderComponents verwerfen
Das Limit maxInterStageShaderComponents ist aufgrund einer Kombination von Faktoren veraltet. Das geplante Datum der Entfernung in Chrome 135.

Redundanz mit maxInterStageShaderVariables: Dieser Grenzwert dient bereits einem ähnlichen Zweck, nämlich der Steuerung der Datenmenge, die zwischen Shader-Stufen übertragen wird.
Geringfügige Diskrepanzen: Es gibt zwar geringfügige Unterschiede bei der Berechnung der beiden Grenzwerte, diese Unterschiede sind jedoch geringfügig und können innerhalb des maxInterStageShaderVariables-Grenzwerts effektiv verwaltet werden.
Vereinfachung: Das Entfernen von maxInterStageShaderComponents vereinfacht die Shader-Schnittstelle und reduziert die Komplexität für Entwickler. Anstatt zwei separate Limits mit subtilen Unterschieden zu verwalten, können sie sich auf das passender benannte und umfassendere maxInterStageShaderVariables konzentrieren.
ChromeStatus.com-Eintrag

Entfernen der <link rel="prefetch"></link> Fünf-Minuten-Regel
Wenn bisher eine Ressource mit <link rel="prefetch"></link> vorgeholt wurde, ignorierte Chrome ihre Cache-Semantik (nämlich max-age und no-cache) für die erste Verwendung innerhalb von fünf Minuten, um ein erneutes Holen zu vermeiden. Jetzt hebt Chrome diesen Sonderfall auf und verwendet die normale HTTP-Cache-Semantik.

Das bedeutet, dass Webentwickler geeignete Cache-Header (Cache-Control oder Expires) einfügen müssen, um die Vorteile von <link rel="prefetch"></link> zu nutzen.

Dies betrifft auch den Nicht-Standard <link rel="prerender"></link>.
Tracking-Bug #40232065 | ChromeStatus.com-Eintrag

Beseitigung der Auslösung der Chrome-Willkommensseite bei den ersten Tabs der Voreinstellungen
Das Einfügen von chrome://welcome in die first_run_tabs-Eigenschaft der initial_preferences-Datei hat nun keinen Effekt mehr. Diese Seite wird entfernt, da sie im Zusammenhang mit der First Run Experience, die auf Desktop-Plattformen ausgelöst wird, überflüssig ist.</template>