Nuevo en la plataforma web en mayo

Descubre algunas de las funciones interesantes que se lanzaron en los navegadores web estables y beta durante mayo de 2022.

Rachel Andrew

Versiones estables del navegador

En mayo, Chrome 102, Safari 15.5, Firefox 100 y Firefox 101 se volvieron estables.

Chrome 102 y Safari 15.5 incluyen el atributo inert. Esto quita elementos del orden de tabulación y del árbol de accesibilidad si no son interactivos. Por ejemplo, un elemento que está fuera de la pantalla o oculto.

Navegadores compatibles

  • Chrome: 102.
  • Edge: 102.
  • Firefox: 112.
  • Safari: 15.5.

Origen

Chrome 102 incluye el nuevo valor until-found para el atributo hidden de HTML. Esto permite buscar en la página y desplazarse hasta un fragmento de texto que se encuentra dentro de un área contraída de la página, como podrías encontrar en un patrón de acordeón. Obtén más información en la publicación Cómo hacer que el contenido colapsado sea accesible con hidden=until-found.

Navegadores compatibles

  • Chrome: 102.
  • Edge: 102.
  • Firefox: No es compatible.
  • Safari: No se admite.

Origen

Chrome 102 incluye la API de Navigation, una API que estandariza el enrutamiento del cliente en aplicaciones de una sola página. Anteriormente, esta API se llamaba API de App History.

Navegadores compatibles

  • Chrome: 102.
  • Edge: 102.
  • Firefox: No es compatible.
  • Safari: No se admite.

Origen

Firefox 101 admite hojas de estilo componibles. La compatibilidad incluye el constructor CSSStyleSheet() y los métodos replace() y replaceSync(). Los diseños de página componibles facilitan la creación de diseños de página para usar con el Shadow DOM. En el siguiente ejemplo, se crea una hoja de estilo con el constructor CSSStyleSheet(), se agrega una regla CSS con el método replaceSync() y la regla resultante se imprime en la consola.

const stylesheet = new CSSStyleSheet();
stylesheet.replaceSync('body { color: red; }');
console.log(stylesheet.rules[0].cssText);

Navegadores compatibles

  • Chrome: 73.
  • Edge: 79.
  • Firefox: 101.
  • Safari: 16.4.

Origen

También en Firefox 101, se incluye la función multimedia prefers-contrast, que está disponible en todos los navegadores.

Navegadores compatibles

  • Chrome: 96.
  • Edge: 96.
  • Firefox: 101.
  • Safari: 14.1.

Origen

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 a tu sitio antes de que el resto del mundo obtenga esa versión.

Las nuevas versiones beta de abril fueron Chrome 103 y Firefox 102.

Firefox 102 incluye la función multimedia update. Se usa para consultar si el dispositivo de salida puede modificar la apariencia del contenido una vez que se renderiza. Acepta los siguientes valores:

none
Una vez renderizado, el contenido no se puede actualizar. Por ejemplo, un documento impreso.
slow
El dispositivo puede actualizar el contenido, pero demasiado lento para mostrar una animación fluida. Por ejemplo, pantallas de tinta electrónica.
fast
El contenido puede cambiar de forma dinámica y lo suficientemente rápido como para renderizar animaciones. Por ejemplo, la pantalla de una computadora o un teléfono.

Navegadores compatibles

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 102.
  • Safari: 17.

Origen

Chrome 103 incluye la API de Local Fonts Access, que permite acceder a las fuentes instaladas localmente del usuario.

Estas funciones beta pronto estarán disponibles en navegadores estables.

Edit: Una versión anterior de esta publicación incluía una mención al método Element.isVisible(), que no se envía en esta versión.

Parte de la serie de artículos para principiantes en la Web