Popover API ist jetzt als Baseline verfügbar

Veröffentlicht: 7. Februar 2025

Im April 2024 wurde in einem Beitrag auf dieser Website angekündigt, dass die Popover API als Baseline Newly verfügbar ist. Wir haben uns jedoch geirrt und das Pop-up wird ab dem 27. Januar 2025 als Standard angezeigt. In diesem Beitrag erklären wir, warum wir uns geirrt haben und was sich seitdem geändert hat, damit solche Fehler weniger wahrscheinlich sind.

Was ist die Popover API?

Die Popover API bietet eine integrierte Möglichkeit, verschiedene Arten von Pop-ups zu erstellen, die in Webanwendungen verwendet werden. Bisher war dafür JavaScript erforderlich und Sie mussten darauf achten, sie barrierefrei zu implementieren. Die API bringt all das in den Browser und ein einfaches Pop-up kann deklarativ in HTML erstellt werden.

<button popovertarget="my-popover">Open Popover</button>

<div id="my-popover" popover>
  <p>I am a popover with more information. Hit <kbd>esc</kbd> or click away to close me.</p>
</div>
Ein einfaches Beispiel für die Verwendung des Popover-Attributs.

Why wasn't it Baseline in April 2024?

Als Firefox im April 2024 seine Popover-Implementierung veröffentlichte, hatten wir noch nicht festgestellt, dass es ein erhebliches Problem auf iOS- und iPadOS-Geräten gab. In diesen mobilen Browsern wurde das Popover nicht geschlossen, wenn man außerhalb davon klickte. Diese Funktion wird als leichtes Schließen bezeichnet. Dies ist ein Problem, das die meisten Entwickler davon abhalten würde, Pop-ups zu verwenden. Daher hätte Safari 18.0 im April nicht als Baseline verwendet werden dürfen. Wir mussten warten, bis der Fehler in Safari 18.3 behoben wurde.

Warum haben wir das falsch gemacht?

Für die Baseline werden die Webfunktionen verwendet, um zu berechnen, ob Funktionen der Baseline entsprechen oder nicht. Wenn Sie sich eine einzelne Funktionsdatei in diesem Projekt ansehen, z. B. die Datei für Pop-ups, sehen Sie die einzelnen Funktionen aus den Mozilla-Browserkompatibilitätsdaten. Eine Web-Funktion enthält in der Regel eine Reihe dieser Einschlüsse. Das liegt daran, dass eine Funktion im Web nicht nur aus einer einzelnen Eigenschaft oder Methode besteht, sondern für ihre Funktionsweise eine Reihe von Komponenten benötigt. Eine Funktion ist auch keine vollständige Spezifikation. CSS-Spezifikationen enthalten beispielsweise häufig Unterfunktionen, die nie implementiert wurden oder nur in einem bestimmten Kontext verwendet werden. Bei der Arbeit mit Webfunktionen wird eine Kombination aus vorhandenen Verfügbarkeitsdaten und menschlichem Input verwendet, um herauszufinden, was eine Webplattformfunktion ausmacht und vor allem, ob eine teilweise Implementierung gravierend genug ist, um sie aus der Baseline herauszuhalten.

Im Februar waren die Webfunktionen noch lange nicht fertig. Um zu zeigen, wie Baseline funktioniert, haben wir versucht, die wichtigsten Funktionen zu ermitteln, die Teil von Baseline 2024 sein würden, ohne alle dafür erforderlichen Daten zu haben. Auf dem Papier, genauer gesagt in den Browserkompatibilitätsdaten, die erst im September aktualisiert wurden, als das Problem erkannt wurde, schienen Pop-ups enthalten zu sein. Da der Fehler auf iOS-Geräten jedoch so schwerwiegend war, dass Pop-ups nicht verwendet werden konnten, war die Funktion noch nicht bereit.

Außerdem fehlte es an einer Testinfrastruktur für Mobilgeräte. Mit dem Projekt Web Platform Tests können wir testen, ob die Funktionen der Webplattform in allen Browsern funktionieren. Wenn dieses Problem mit dem Schließen des Pop-ups in einem Desktopbrowser aufgetreten wäre, hätten wir gesehen, dass die Tests fehlgeschlagen sind. Das war bei Mobilgeräten nicht der Fall.

Wie können wir das in Zukunft vermeiden?

Wir sind mit den Daten schon viel weiter. Die Daten zu Web-Funktionen sind fast vollständig. Daher können wir mit größerer Sicherheit davon ausgehen, dass die Funktionen, die wir als Standard festlegen, auch tatsächlich als Standard gelten.

Bei diesem Problem bestand die Herausforderung darin, ein Problem zu identifizieren, das nur auf Mobilgeräten mit iOS auftrat. Wir arbeiten an einigen Änderungen, die es in Zukunft einfacher machen sollen, Probleme mit der Interoperabilität auf Mobilgeräten zu erkennen. Wir arbeiten daran, mobile Tests in Web-Plattformtests zu verbessern. So sollten wir besser erkennen können, ob ein Mobilbrowser Probleme hat, getrennt von Desktop-Computern. Außerdem möchten wir diese Daten noch in diesem Jahr im Dashboard webstatus.dev veröffentlichen. Sollte in Zukunft ein ähnliches Problem auftreten, sollten wir schneller davon erfahren – hoffentlich bevor wir die Funktion in Baseline aufnehmen.

Uns war immer klar, dass es nicht einfach sein würde, die gesamte Webplattform in Form von Funktionen abzubilden. Die Diskussionen über Teilimplementierungen, Fehler und die tatsächlichen Bestandteile einer Funktion sind jedoch unglaublich wertvoll. So können wir besser nachvollziehen, was Ihnen wirklich wichtig ist, und haben bessere Anhaltspunkte für die Planung von Projekten wie Interop 2025.