Neu auf der Webplattform im Februar

Hier finden Sie einige der interessanten Funktionen, die im Februar 2025 in stabilen und Betaversionen von Webbrowsern eingeführt wurden.

Veröffentlicht: 28. Februar 2025

Stabile Browserversionen

Im Februar 2025 wurden Firefox 135 und Chrome 133 als stabile Versionen veröffentlicht. In diesem Beitrag geht es um die neuen Funktionen, die der Webplattform hinzugefügt wurden.

WebAuthn-Funktionen prüfen

Sowohl Firefox 135 als auch Chrome 133 unterstützen die static-Methode von PublicKeyCredential.getClientCapabilities(). So können Sie prüfen, ob ein Browser Funktionen der Web Authentication API unterstützt, ohne auf Browser-Sniffing zurückgreifen zu müssen.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: 135.
  • Safari: 17.4.

Source

Firefox 135 enthält außerdem Funktionen aus dem Vorschlag zum Parsen von JSON mit Quelle: das Argument context des Parameters reviver in JSON.parse, JSON.isRawJSON() und JSON.rawJSON().

Browser Support

  • Chrome: 114.
  • Edge: 114.
  • Firefox: 135.
  • Safari: not supported.

Source

Der Hinweiswert des Popover-Attributs

In Chrome 133 wird ein dritter Wert für das popover-Attribut hinzugefügt: popover="hint". Hinweise, die am häufigsten mit dem Verhalten von „Tooltips“ in Verbindung gebracht werden, verhalten sich etwas anders. Es ist jetzt möglich, ein nicht zu einem bestimmten Element gehörendes Pop-up-Fenster mit Hinweisen zu öffnen, während ein vorhandener Stapel automatischer Pop-ups geöffnet bleibt.

Das kanonische Beispiel ist eine geöffnete <select>-Auswahl (popover="auto") und eine durch Bewegen des Mauszeigers ausgelöste Kurzinfo (popover="hint"). Dadurch wird die Auswahl <select> nicht geschlossen.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Weitere Informationen finden Sie unter Pop-up = Hinweis.

Erweiterte CSS-attr()-Funktion

Chrome 133 enthält eine Reihe von CSS-Erweiterungen. Diese Chrome-Version enthält die in CSS Level 5 angegebene Erweiterung für attr(), die neben <string> auch Typen zulässt und in allen CSS-Properties verwendet werden kann (zusätzlich zur vorhandenen Unterstützung für den Inhalt des Pseudoelements).

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Weitere Informationen finden Sie unter Preisvergleichsportal attr() erhält ein Upgrade.

Containerabfragen für den CSS-Scrollstatus

In Chrome 133 können Sie mithilfe von Containerabfragen Nachkommen von Containern basierend auf ihrem Scrollstatus formatieren.

Der Abfragecontainer ist entweder ein Scrollcontainer oder ein Element, das von der Scrollposition eines Scrollcontainers beeinflusst wird. Die folgenden Status können abgefragt werden:

  • stuck: Ein fix positionierter Container ist an einem der Ränder des Scrollfelds angeklebt.
  • snapped: Ein Container, der an einem Scroll-Snap ausgerichtet ist, ist derzeit horizontal oder vertikal angedockt.
  • scrollable: Gibt an, ob ein Scrollcontainer in eine abgefragte Richtung gescrollt werden kann.

Es gibt auch einen neuen Wert für container-type: scroll-state, mit dem Container abgefragt werden können.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Weitere Informationen findest du unter CSS scroll-state().

Preisvergleichsportale text-box, text-box-trim und text-box-edge

Außerdem sind in CSS für Chrome 133 die Eigenschaften text-box-trim und text-box-edge sowie die Kurzschreibweise text-box enthalten. Mit diesen können Sie die vertikale Ausrichtung von Text genauer steuern.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: 18.2.

Weitere Informationen zur Funktionsweise dieser nützlichen Eigenschaft in CSS text-box-trim

Umzug unter Beibehaltung des DOM-Status

In Chrome 133 wurde ein DOM-Primitive (Node.prototype.moveBefore) hinzugefügt, mit dem Sie Elemente in einem DOM-Baum verschieben können, ohne den Status des Elements zurückzusetzen.

Wenn Sie Elemente verschieben, anstatt sie zu entfernen und einzufügen, wird der folgende Status beibehalten:

  • <iframe> Elemente bleiben geladen.
  • Der Fokus bleibt auf dem aktiven Element.
  • Pop-ups, Vollbild- und modale Dialogfelder bleiben geöffnet.
  • CSS-Übergänge und -Animationen werden fortgesetzt.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Die FileSystemObserver-Oberfläche

Über die in Chrome 133 hinzugefügte FileSystemObserver-Schnittstelle werden Websites über Änderungen am Dateisystem informiert. Websites überwachen Änderungen an Dateien und Verzeichnissen, für die der Nutzer zuvor Berechtigungen erteilt hat, auf dem lokalen Gerät des Nutzers oder im Bucket File System (auch als Origin Private File System bezeichnet) und werden über grundlegende Änderungsinformationen wie den Änderungstyp benachrichtigt.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Betaversionen von Browsern

Betaversionen von Browsern geben Ihnen einen Einblick in die Funktionen, die in der nächsten stabilen Version des Browsers enthalten sein werden. Jetzt ist der ideale Zeitpunkt, um neue Funktionen oder Änderungen zu testen, die sich auf Ihre Website auswirken könnten, bevor sie allgemein verfügbar sind. Neue Betaversionen sind Firefox 136, Safari 18.4 und Chrome 134. Diese Releases bringen viele tolle Funktionen auf die Plattform. Weitere Informationen findest du in den Versionshinweisen. Hier sind nur einige Highlights.

Die neueste Safari-Betaversion enthält eine lange Liste von Ergänzungen und Verbesserungen, darunter einige Funktionen, die voraussichtlich als Baseline Newly (Neu verfügbar) gekennzeichnet werden, sobald dieser Browser stabil ist. Dazu gehören beispielsweise writing-mode: sideways-rl und writing-mode: sideways-lr, die statische Methode supports() für ClipboardItem und eine ganze Liste von Elementen aus dem Vorschlag für Iterator-Hilfsfunktionen.

Sowohl Safari 18.4 Beta als auch Firefox 136 enthalten die Cookie Store API, die nach der Veröffentlichung beider Browser als Baseline Newly verfügbar sein sollte.

Firefox 136 enthält die Pseudoklassen :open und :has-slotted. Letztere ist auch in Chrome 134 verfügbar. Außerdem enthält es Intl.DurationFormat, das dann „Baseline Newly available“ (Baseline neu verfügbar) sein sollte.

Chrome 134 enthält anpassbare <select>-Elemente, die CSS-Eigenschaft dynamic-range-limit und eine Funktion zum leichten Schließen von <dialog>-Elementen.