La API de Popover ahora está disponible como versión preliminar

Fecha de publicación: 7 de febrero de 2025

En abril de 2024, una publicación en este sitio anunció que la API de Popover estaba disponible como versión preliminar. Sin embargo, nos equivocamos, y el pop-up entrará en el modelo de referencia a partir del 27 de enero de 2025. En esta publicación, explicamos por qué cometimos un error y qué cambió desde entonces para que sea menos probable que vuelva a ocurrir.

¿Qué es la API de Popover?

La API de Popover proporciona una forma integrada de crear varios tipos de ventanas emergentes que se usan en aplicaciones web. Anteriormente, esto requería que usaras JavaScript y que tuvieras mucho cuidado de implementarlos de forma accesible. La API lleva todo esto al navegador, y se puede crear un popover simple de forma declarativa en HTML.

<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>
Un ejemplo básico del uso del atributo popover.

Why wasn't it Baseline in April 2024?

Cuando Firefox envió su implementación del popover en abril de 2024, aún no habíamos descubierto que había un problema significativo en iOS y iPadOS. En estos navegadores para dispositivos móviles, hacer clic fuera del popover no lo cerraba, una función conocida como desactivación ligera. Este es un problema que impediría que la mayoría de los desarrolladores usen el popover. Esto significa que no se debería haber incluido como Baseline en abril y que se debía esperar hasta que se corrigiera el error en Safari 18.3.

¿Por qué nos equivocamos?

El modelo de referencia se basa en el trabajo de web-features para calcular cuándo las funciones están dentro o fuera del modelo de referencia. Si observas un archivo de función individual en ese proyecto, como el archivo del popover, verás las funciones individuales de los datos de compatibilidad del navegador de Mozilla. Por lo general, un componente web contiene varias de estas inclusiones. Esto se debe a que una función en la Web no es solo una propiedad o un método, sino que necesita una serie de componentes para funcionar. Tampoco es una especificación completa. Las especificaciones de CSS, por ejemplo, a menudo incluyen subfunciones que nunca se implementaron o que solo se usan en un contexto específico. El trabajo de funciones web usa una combinación de datos de disponibilidad existentes y entradas humanas para determinar qué constituye una función de plataforma web y, lo que es más importante, si una implementación parcial es lo suficientemente grave como para mantenerla fuera del modelo de referencia.

En febrero, el trabajo de las funciones web estaba lejos de completarse. Por lo tanto, para ayudar a mostrar cómo funcionaría Baseline, intentamos descubrir las funciones clave que formarían parte de Baseline 2024 sin todos los datos que necesitábamos para hacerlo. En el papel, o más bien en los datos de compatibilidad del navegador, que no se actualizaron hasta septiembre, cuando se detectó el problema, parecía que se incluía el popover. Sin embargo, debido a que el error en iOS era lo suficientemente grave como para evitar que se usara el popover, no estaba listo.

También faltaba infraestructura de prueba para dispositivos móviles. El proyecto Web Platform Tests nos brinda una forma de probar que las funciones de la plataforma web funcionen en todos los navegadores. Si este problema de descarte de luz hubiera ocurrido en un navegador para computadoras, habríamos visto que las pruebas fallaban, pero no fue así en el caso de los dispositivos móviles.

¿Cómo podemos evitar esto en el futuro?

Ya estamos en una situación mucho mejor con los datos. Los datos de las funciones web están casi completos, por lo que podemos tener un mayor grado de confianza con cualquiera de las funciones que declaramos como Baseline.

En particular, con este problema, parte del problema era identificar un problema que solo se producía en dispositivos móviles, en iOS. Hay algunos cambios que deberían facilitar la identificación de problemas de interoperabilidad en dispositivos móviles en el futuro. Estamos trabajando para mejorar las pruebas para dispositivos móviles en las pruebas de la plataforma web, por lo que deberíamos poder identificar mejor cuándo un navegador para dispositivos móviles tiene problemas, por separado de los de computadoras de escritorio. También tenemos la intención de exponer estos datos en el panel de webstatus.dev este año. Si ocurre un problema como este en el futuro, deberíamos obtener indicaciones más rápidas de que sucedió, con suerte, antes de incluir la función en Baseline.

Siempre supimos que asignar toda la plataforma web como un conjunto de funciones no sería fácil. Sin embargo, las conversaciones que tenemos sobre implementaciones parciales, errores y lo que realmente constituye una función son increíblemente valiosas. Nos ayuda a identificar lo que realmente te importa y nos brinda mejores indicadores para usar cuando planificamos iniciativas como Interop 2025.