Descubre algunas de las funciones interesantes que llegaron a los navegadores web estables y beta durante febrero de 2025.
Fecha de publicación: 28 de febrero de 2025
Versiones estables del navegador
En febrero de 2025, Firefox 135 y Chrome 133 se volvieron estables. En esta publicación, se analizan las nuevas funciones que se agregaron a la plataforma web.
Cómo verificar las capacidades de WebAuthn
Firefox 135 y Chrome 133 agregan compatibilidad con el método estático PublicKeyCredential.getClientCapabilities()
. Esto te permite verificar si un navegador admite funciones de la API de Web Authentication sin necesidad de recurrir al espionaje de navegadores.
Firefox 135 también incluye funciones del análisis de JSON con propuesta de fuente: el argumento context
del parámetro reviver
JSON.parse
, JSON.isRawJSON()
y JSON.rawJSON()
.
Es el valor de sugerencia del atributo popover.
Chrome 133 agrega un tercer valor para el atributo popover
, popover="hint"
.
Las sugerencias, que suelen asociarse con comportamientos de tipo "ventana de información", tienen comportamientos ligeramente diferentes. Ahora es posible abrir un cuadro emergente de sugerencias no relacionado mientras se mantiene abierta una pila existente de cuadros emergentes automáticos.
El ejemplo canónico es que se abre un selector <select>
(popover="auto"
) y se muestra un cuadro de información (popover="hint"
) activado por el desplazamiento del mouse. Esa acción no cierra el selector <select>
.
Browser Support
Obtén más información en Popup = sugerencia.
Función attr()
avanzada de CSS
Hay una buena colección de incorporaciones de CSS en Chrome 133. Esta versión de Chrome incluye la ampliación a attr()
especificada en el nivel 5 de CSS, que permite tipos además de <string>
y su uso en todas las propiedades de CSS (además de la compatibilidad existente con el contenido de pseudoelementos).
Browser Support
Obtén más información en CSS attr()
recibe una actualización.
Consultas de contenedores de estado de desplazamiento de CSS
También en Chrome 133, usa consultas de contenedor para aplicar diseño a los elementos secundarios de los contenedores según su estado de desplazamiento.
El contenedor de consulta es un contenedor de desplazamiento o un elemento afectado por la posición de desplazamiento de un contenedor de desplazamiento. Se pueden consultar los siguientes estados:
stuck
: Un contenedor con posición fija se pega a uno de los bordes del cuadro de desplazamiento.snapped
: Un contenedor alineado con el ajuste del desplazamiento se ajusta horizontal o verticalmente.scrollable
: Indica si se puede desplazar un contenedor de desplazamiento en una dirección consultada.
También hay un valor nuevo para container-type
: scroll-state
, que permite consultar contenedores.
Browser Support
Para obtener más información, lee scroll-state()
de CSS.
CSS text-box
, text-box-trim
y text-box-edge
También en CSS para Chrome 133, se encuentran las propiedades text-box-trim
y text-box-edge
, junto con la propiedad de abreviatura text-box
, que permiten un control más preciso de la alineación vertical del texto.
Browser Support
Obtén más información sobre el funcionamiento de esta propiedad útil en text-box-trim
de CSS.
Movimiento que conserva el estado del DOM
Chrome 133 agrega una primitiva de DOM (Node.prototype.moveBefore
) que te permite mover elementos alrededor de un árbol de DOM sin restablecer el estado del elemento.
Cuando se mueve en lugar de quitar y agregar, se conserva el siguiente estado:
- Quedan cargados
<iframe>
elementos. - El elemento activo permanece enfocado.
- Los diálogos emergentes, de pantalla completa y modales permanecen abiertos.
- Las transiciones y animaciones de CSS continúan.
Browser Support
La interfaz de FileSystemObserver
La interfaz FileSystemObserver
que se agregó en Chrome 133 notifica a los sitios web los cambios en el sistema de archivos. Los sitios observan los cambios en los archivos y directorios a los que el usuario les otorgó permiso anteriormente, en su dispositivo local o en el sistema de archivos de Bucket (también conocido como sistema de archivos privados de Origin), y reciben notificaciones sobre información básica de los cambios, como el tipo de cambio.
Browser Support
Versiones beta del navegador
Las versiones beta del navegador te brindan una vista previa de lo que estará disponible en la próxima versión estable del navegador. Es un buen momento para probar funciones nuevas o eliminaciones que podrían afectar tu sitio antes de que el resto del mundo obtenga esa versión. Las nuevas versiones beta son Firefox 136, Safari 18.4 y Chrome 134. Estas versiones ofrecen muchas funciones excelentes a la plataforma. Consulta las notas de la versión para obtener todos los detalles. Estos son solo algunos aspectos destacados.
La versión beta más reciente de Safari incluye una gran lista de incorporaciones y mejoras, incluidas algunas funciones que esperamos que se conviertan en Baseline Newly available una vez que este navegador sea estable. Por ejemplo, writing-mode: sideways-rl
y writing-mode: sideways-lr
, el método estático supports()
para ClipboardItem
y una lista completa de elementos de la propuesta de ayudantes de iteradores.
Tanto la versión beta de Safari 18.4 como la de Firefox 136 incluyen la API de Cookie Store, que debería estar disponible en Baseline New una vez que se envíen ambos navegadores.
Firefox 136 incluye las pseudoclases :open
y :has-slotted
,
esta última también está en Chrome 134.
También incluye Intl.DurationFormat
, que debería estar disponible como Baseline Newly.
Chrome 134 incluye elementos <select>
personalizables, la propiedad dynamic-range-limit
de CSS y la funcionalidad de descarte claro para elementos <dialog>
.