Publicado el 1 de mayo de 2025
A menos que se indique lo contrario, los siguientes cambios se aplican a la versión más reciente del canal beta de Chrome para Android, ChromeOS, Linux, macOS y Windows. Obtén más información sobre las funciones que se indican aquí a través de los vínculos proporcionados o de la lista en ChromeStatus.com. Chrome 130 está en versión beta desde el 30 de abril de 2025. Puedes descargar la versión más reciente en Google.com para computadoras o en Google Play Store en Android.
CSS y la IU
Esta versión agrega siete funciones nuevas de CSS y la IU.
La función if()
La función if() de CSS proporciona una forma concisa de expresar valores condicionales. Acepta una serie de pares condición-valor, delimitados por punto y coma. La función evalúa cada condición de forma secuencial y muestra el valor asociado con la primera condición verdadera. Si ninguna de las condiciones se evalúa como verdadera, la función muestra un flujo de tokens vacío. Esto te permite expresar una lógica condicional compleja de una manera simple y concisa. Ejemplo:
div {
color: var(--color);
background-color: if(style(--color: white): black; else: white);
}
.dark {
--color: black;
}
.light {
--color: white;
}
<div class="dark">dark</div>
<div class="light">light</div>
Las propiedades reading-flow y reading-order
La propiedad CSS reading-flow controla el orden en el que los elementos de un diseño flexible, de cuadrícula o de bloque se exponen a las herramientas de accesibilidad y se enfocan con la navegación de enfoque del teclado con tabulación. Toma uno de los siguientes valores de palabras clave:
normalflex-visualflex-flowgrid-rowsgrid-columnsgrid-ordersource-order
La propiedad CSS reading-order te permite anular manualmente el orden dentro de un contenedor de flujo de lectura. Es un número entero con un valor predeterminado de 0.
Para obtener más información, consulta Cómo usar reading-flow de CSS para la navegación de enfoque secuencial lógica y prueba algunos ejemplos de flujo de lectura.
offset-path: shape()
La función shape() ya es compatible con clip-path y permite el recorte responsivo. Si también la habilitas para offset-path, se cierra una pequeña brecha en la que se puede usar el mismo tipo de forma para esa propiedad.
Compatibilidad con el atributo transform en SVGSVGElement
Esta función permite la aplicación de propiedades de transformación, como el
escalamiento, la rotación, la traslación y la inclinación, directamente al <svg> elemento raíz
con su atributo transform. Esta mejora te permite manipular todo el sistema de coordenadas SVG o su contenido en su totalidad, lo que proporciona una mayor flexibilidad para crear gráficos vectoriales dinámicos, responsivos e interactivos. Al admitir este atributo, el elemento SVG se puede transformar sin necesidad de elementos contenedores adicionales ni soluciones alternativas complejas de CSS, lo que optimiza el proceso de compilación de gráficos web escalables y animados.
Permite que <use> haga referencia al elemento raíz de un documento externo omitiendo el fragmento.
En esta función, optimizamos el elemento SVG <use> al relajar
los requisitos de referencia. Actualmente, debes hacer referencia explícita a los fragmentos dentro del documento SVG. Si no se proporciona un ID de fragmento, <use> no podrá
resolver el destino y no se renderizará ni se hará referencia a nada.
Con esta función, si omites fragmentos o solo proporcionas el nombre del archivo SVG externo, se hará referencia automáticamente al elemento raíz, lo que elimina la necesidad de modificar el documento al que se hace referencia solo para asignar un ID a la raíz. Esta mejora simplifica este proceso de edición manual y mejora la eficiencia.
El color de los elementos destacados del sistema para la propiedad accent-color se expandió a Windows y ChromeOS
Esto te permite usar el color de resalte del sistema operativo para los elementos de formulario. Si usas la propiedad CSS accent-color, puedes asegurarte de que los elementos de formulario, como las casillas de verificación, los botones de selección y las barras de progreso, adopten automáticamente el color de resalte definido por el sistema operativo del usuario. Esto es compatible con macOS desde 2021 y ahora es compatible con Windows y ChromeOS.
view-transition-name: match-element
El valor match-element de la propiedad view-transition genera un ID único basado en la identidad del elemento y sigue siendo el mismo para este elemento. Esto se usa en casos de apps de una sola página en los que el elemento se mueve y quieres animarlo con una transición de vista.
API web
Tipo de error de alineación que se arroja para la creación de credenciales de WebAuthn de "payment"
Corrige el tipo de error que se arrojaba durante la creación de credenciales de WebAuthn para las credenciales de payment. Debido a una discrepancia histórica en las especificaciones, crear una credencial de payment en un iframe de origen cruzado sin una activación del usuario arrojaría un SecurityError en lugar de un NotAllowedError, que es lo que se arroja para las credenciales que no son de pago. Este es un cambio rotundo. Se vería afectado el código que detectaba anteriormente el tipo de error que se arrojaba (por ejemplo, e instanceof SecurityError). El código que, en general, controla los errores durante la creación de credenciales (por ejemplo, catch (e)) seguirá funcionando correctamente.
Partición de URLs de BLOB: recuperación y navegación
Como continuación de Storage Partitioning, se implementa la partición del acceso a URLs de BLOB por clave de almacenamiento (sitio de nivel superior, origen de marco y el booleano has-cross-site-ancestor), a excepción de las navegaciones de nivel superior que permanecerán particionadas solo por el origen del marco.
Este cambio se puede revertir temporalmente si se establece la política PartitionedBlobURLUsage. La política dejará de estar disponible cuando se den de baja las otras políticas empresariales relacionadas con la partición de almacenamiento.
Llamar a pilas en informes de fallas de páginas web que no responden
Esta función captura la pila de llamadas de JavaScript cuando una página web deja de responder debido a que el código JavaScript ejecuta un bucle infinito o algún otro cálculo muy largo. Esto ayuda a los desarrolladores a identificar la causa de la falta de respuesta y solucionarla con mayor facilidad. La pila de llamadas de JavaScript se incluye en la API de informes de fallas cuando el motivo es que no responde.
Tipos de color de punto flotante de Canvas
Presenta la capacidad de usar formatos de píxeles de punto flotante (en lugar de punto fijo de 8 bits) con CanvasRenderingContext2D, OffscreenCanvasRenderingContext2D y ImageData. Esto es necesario para aplicaciones de alta precisión (por ejemplo, visualización médica), contenido de alto rango dinámico y espacios de color de trabajo lineales.
No se permite la renderización previa de HTTP de texto simple no confiable
Actualmente, se permite la renderización previa a través de HTTP y HTTPS, mientras que la recuperación previa solo funciona a través de HTTPS. Restringe la renderización previa para que sea coherente con la recuperación previa.
Document-Isolation-Policy
Document-Isolation-Policy permite que un documento habilite crossOriginIsolation por sí mismo, sin tener que implementar COOP o COEP, y sin importar el estado crossOriginIsolation de la página. La política está respaldada por el aislamiento de procesos. Además, los subrecursos de origen cruzado que no sean CORS del documento se cargarán sin credenciales o deberán tener un encabezado CORP.
Obtén más información en Política de aislamiento de documentos: Habilita funciones web potentes con facilidad.
Ed25519 en Web Cryptography
Esta función agrega compatibilidad con los algoritmos Curve25519 en la API de Web Cryptography, es decir, el algoritmo de firma Ed25519.
Registro y generación de informes de direcciones IP
Chrome Enterprise mejorará sus capacidades de supervisión de seguridad y respuesta ante incidentes recopilando y registrando direcciones IP locales y remotas, y enviándolas a los registros de investigación de seguridad (SIT). Además, Chrome Enterprise permitirá que los administradores envíen las direcciones IP a proveedores de SIEM de 1P y 3P a través del conector de informes de Chrome Enterprise. Esta función estará disponible para los clientes de Chrome Enterprise Core.
Integración de promesas de JavaScript
La integración de promesas de JavaScript (JSPI) es una API que permite que las aplicaciones de WebAssembly se integren con las promesas de JavaScript. Permite que un programa de WebAssembly actúe como el generador de una promesa y que el programa de WebAssembly interactúe con las APIs que contienen promesas. En particular, cuando una aplicación usa JSPI para llamar a una API (JavaScript) que contiene promesas, se suspende el código de WebAssembly, y el llamador original al programa de WebAssembly recibe una promesa que se cumplirá cuando el programa de WebAssembly finalmente se complete.
API de Language Detector
La API de Language Detector es una API de JavaScript que identifica el idioma de una cadena proporcionada. Esta API está respaldada por un modelo subyacente que se ajusta para realizar tareas de detección de idiomas.
Dada una cadena, la API de Language Detector muestra una lista ordenada de los idiomas detectados, junto con una puntuación de confianza para cada resultado.
De manera opcional, los desarrolladores pueden pasar una lista de idiomas de entrada esperados cuando crean una instancia de Language Detector para ayudar a optimizar los casos de uso en los que se espera que la detección se realice en ciertos idiomas.
Restringe los atributos y argumentos de flotante en SVGMatrix, SVGRect y SVGPoint
Cuando configuras atributos o argumentos de flotante en SVGMatrix, SVGRect y SVGPoint, ya no puedes establecerlos como Infinity o Nan. Se arroja una excepción de JavaScript si intentas configurarla, como se define en la especificación de SVG.
API de Selection getComposedRanges y direction
Esta función incluye dos métodos nuevos de la API para la API de Selection:
Selection.direction, que muestra la dirección de la selección como"none","forward"o"backward"Selection.getComposedRanges(), que muestra una lista de 0 o 1StaticRange"compuesta"
Se permite que un StaticRange "compuesto" cruce los límites de la sombra, lo que los rangos normales no pueden hacer.
Por ejemplo:
const range = getSelection().getComposedRanges({ shadowRoots: [root] });
Si la selección cruza un límite de raíz de sombra que no se proporciona en la lista shadowRoots, los extremos de StaticRange se "volverán a definir" para que estén fuera de ese árbol. Esto garantiza que no expongamos árboles de sombra desconocidos.
Extensiones de alcance de la app web
Agrega un campo de manifiesto de la app web scope_extensions que permite que las apps web extiendan su alcance a otros orígenes.
Ejemplo:
{
"name": "Example",
"display": "standalone",
"start_url": "/index.html",
"scope_extensions": [
{"type" : "type", "origin" : "https://example.com"}
]
}
Esto permite que los sitios que controlan varios subdominios y dominios de nivel superior se presenten como una sola app web.
Requiere que los orígenes enumerados confirmen la asociación con la app web mediante un archivo de configuración .well-known/web-app-origin-association.
{
"https://sample-app.com/": {
"scope": "/"
}
}
Sugerencias de ramas de WebAssembly
Mejora el rendimiento del código de WebAssembly compilado informando al motor que es muy probable que una instrucción de rama en particular tome una ruta específica. Esto permite que el motor tome mejores decisiones para el diseño del código (lo que mejora los aciertos de la caché de instrucciones) y la asignación de registros.
WebGPU: GPUTextureView para la vinculación externalTexture
Ahora se permite usar un GPUTextureView para una vinculación externalTexture cuando se crea un GPUBindGroup.
WebGPU: Sobrecarga de copyBufferToBuffer
El método GPUCommandEncoder copyBufferToBuffer() ahora incluye una forma más sencilla de copiar búferes completos con una nueva sobrecarga con parámetros opcionales de desplazamiento y tamaño.
Nuevas pruebas de origen
En Chrome 137, puedes habilitar las siguientes pruebas de origen nuevas origin trials.
Atributo de bloqueo de renderización de velocidad de fotogramas completa
Agrega un nuevo token de bloqueo de renderización full-frame-rate a los atributos de bloqueo. Cuando el renderizador se bloquea con el token full-frame-rate, funcionará a una velocidad de fotogramas más baja para reservar más recursos para la carga.
Pausa la reproducción multimedia en iframes no renderizados
Agrega una política de permisos "media-playback-while-not-rendered" para permitir que los sitios web incorporadores pausen la reproducción multimedia de iframes incorporados que no se renderizan, es decir, que tienen su propiedad "display" establecida en "none". Esto debería permitir que los desarrolladores creen experiencias más fáciles de usar y también mejorar el rendimiento, ya que permite que el navegador controle la reproducción de contenido que no es visible para los usuarios.
API de Rewriter
La API de Rewriter transforma y reformula el texto de entrada de las formas solicitadas, respaldado por un modelo de lenguaje de IA integrado en el dispositivo. Los desarrolladores pueden usar esta API para quitar redundancias dentro de un texto para que quepa en un límite de palabras, reformular mensajes para que se adapten al público objetivo o para que sean más constructivos si se descubre que un mensaje usa lenguaje tóxico, reformular una publicación o un artículo para usar palabras y conceptos más simples, y mucho más.
API de Writer
La API de Writer se puede usar para escribir material nuevo dada una instrucción de tarea de escritura, respaldada por un modelo de lenguaje de IA integrado en el dispositivo. Los desarrolladores podrán usar esta API para generar explicaciones textuales de datos estructurados, redactar una publicación sobre un producto en función de las opiniones o la descripción del producto, ampliar las listas de pros y contras en vistas completas, y mucho más.