Compartir a través de

Notas de la versión de la plataforma web de Microsoft Edge 137 (mayo de 2025)

A continuación se muestran las nuevas características y actualizaciones de la plataforma web en Microsoft Edge 137, que se publica el 29 de mayo de 2025.

Para mantenerse al día y obtener las características más recientes de la plataforma web, descargue un canal en versión preliminar de Microsoft Edge (Beta, Desarrollo o Canary); vaya a Convertirse en microsoft edge insider.

Contenido detallado:

Edge DevTools

Consulte Novedades de DevTools (Microsoft Edge 137).

WebView2

Vea 1.0.3296.44 (3 de junio de 2025) en Las notas de la versión archivadas del SDK de WebView2.

Características de la plataforma web

Características de CSS

Función CSS if()

La función CSS if() proporciona una manera sencilla y concisa de expresar valores lógicos condicionales.

La if() función acepta una serie de pares condición-valor, delimitados por punto y coma. La función evalúa cada condición secuencialmente y devuelve el valor asociado a la primera true condición. Si ninguna de las condiciones se evalúa como true, la función devuelve un flujo de token vacío.

En el ejemplo siguiente, la if() función se usa para establecer el color de fondo de un div elemento en función del valor de una propiedad --colorpersonalizada :

<style>
  div {
    color: var(--color);
    background-color: if(style(--color: white): black; else: white);
  }
  .dark {
    --color: black;
  }
  .light {
    --color: white;
  }
</style>
<div class="dark">dark</div>
<div class="light">light</div>

Vea Selección de valores condicionales: la notación if() en Valores CSS y Nivel de módulo de unidades 5.

CSS reading-flow y reading-order propiedades

La reading-flow propiedad CSS controla lo siguiente:

  • Orden en el que los elementos de un diseño flexible, de cuadrícula o de bloque se exponen a herramientas de accesibilidad.
  • Orden en el que se centran los elementos de un diseño flexible, de cuadrícula o de bloque al usar la tecla Tab .

La reading-flow propiedad admite los valores siguientes:

  • normal
  • flex-visual
  • flex-flow
  • grid-rows
  • grid-columns
  • grid-order
  • source-order

La reading-order propiedad CSS permite invalidar manualmente el orden dentro de un contenedor de flujo de lectura. El reading-order valor es un entero que tiene como valor predeterminado 0.

Vea también:

Compatibilidad con shape() en offset-path

La shape() función CSS, que ya es compatible con la clip-path propiedad CSS, ahora también es compatible con la offset-path propiedad CSS.

Esto permite reutilizar la misma forma en varias propiedades CSS.

Consulte offset-path en MDN.

Color de énfasis del sistema para la accent-color propiedad

La accent-color propiedad CSS permite personalizar el color de los elementos de formulario, como casillas, botones de radio o barras de progreso.

Ahora, el color predeterminado de la accent-color propiedad coincide con el color de énfasis del sistema operativo./g/blink-dev/c/WwYkLjbGhoA

Consulte color de énfasis en MDN.

Nombres de transición de vista generados automáticamente

La view-transition-name propiedad CSS admite dos nuevos valores, para evitar tener que inventar nombres únicos para los elementos que participan en una transición de vista:

  • match-element : genera un identificador único que se basa en la identidad del elemento. Este valor es útil en aplicaciones de página única en las que el elemento animado con una transición de vista se mueve en el DOM.

  • auto : genera un identificador único que se basa en el atributo del id elemento. Este valor solo tiene en cuenta el id atributo y omite el tipo de elemento. Este enfoque permite que una transición de vista funcione en varias páginas de una aplicación, donde los elementos con el mismo id atributo pueden ser de tipos diferentes.

Consulte Determinación automática del nombre de la transición de vista.

Compatibilidad con el transform atributo en <svg>

Las propiedades de transformación, como el escalado, la rotación, la traducción y la asimetría, ahora se admiten directamente en el <svg> elemento mediante el transform atributo .

Esto le permite manipular todo el sistema de coordenadas SVG o su contenido en su conjunto, lo que proporciona una mayor flexibilidad para crear gráficos vectoriales dinámicos, con capacidad de respuesta e interactivos.

Al admitir el transform atributo , un <svg> elemento se puede transformar sin necesidad de elementos contenedor adicionales o soluciones alternativas css complejas.

Consulte transformación en MDN.

Omitir letter-spacing en scripts cursivos

Por especificación, el explorador ahora omite la letter-spacing propiedad CSS al representar scripts cursivos, para evitar palabras irrelevantes.

Si es posible, el explorador puede aplicar el espaciado de letras traduciendo el espacio adicional en elongación o compresión cursiva. Si el texto no se puede expandir sin interrumpir las conexiones cursivas, el explorador trata cada palabra como una sola unidad tipográfica para el espaciado de letras.

La elongación o compresión cursiva adecuada varía en función de lo siguiente:

  • Guión.
  • Tipografía.
  • Idioma.
  • Word ubicación.
  • Ubicación de la línea.
  • Complejidad de la implementación.
  • Funcionalidades de fuente.
  • Preferencias caligráficas.

La elongación o compresión cursiva adecuada puede implicar acortar:

  • Ligaduras.
  • Variantes de lavado.
  • Formularios contextuales.
  • Glifos de elongación.

Evite aplicar la letter-spacing propiedad a scripts cursivos, a menos que pueda aceptar resultados no interoperables.

Consulte espaciado de letras en MDN.

API web

Cambiar el tipo de error que se produce para payment la creación de credenciales de autenticación web de SecurityError a NotAllowedError

Anteriormente, al crear una payment credencial en un iframe entre orígenes sin la activación del usuario, se produjo un SecurityError .

El tipo de error ahora se ha cambiado a NotAllowedError, para que coincida con el tipo de errores que se producen para las credenciales de no pago.

Consulte La API de solicitud de pago en MDN.

Permitir que el elemento SVG <use> haga referencia a documentos externos sin necesidad de un identificador de fragmento de dirección URL

Los elementos SVG <use> ahora pueden vincularse a documentos SVG externos sin necesidad de especificar un identificador de fragmento.

Anteriormente, necesitaba hacer referencia explícitamente a fragmentos dentro de documentos SVG. Por ejemplo:

<svg>
  <use xlink:href="myshape.svg#icon"></use>
</svg>

En el ejemplo anterior, #icon es el identificador de fragmento que apunta a un elemento con el id="icon" atributo dentro del myshape.svg documento. Si no se ha proporcionado ningún identificador, el <use> elemento no pudo resolver el destino y no se representó nada.

Ahora puede omitir los identificadores de fragmento y proporcionar solo el nombre de archivo de documento SVG externo. Al hacerlo, se hace referencia automáticamente al elemento raíz con el documento SVG. Por ejemplo:

<svg>
  <use xlink:href="myshape.svg"></use>
</svg>

Vea <use> en MDN.

Creación de particiones de url de blob

El acceso a la dirección URL del blob ahora está particionado por la clave de almacenamiento. Las claves de almacenamiento son sitios de nivel superior, orígenes de fotogramas y el has-cross-site-ancestor valor booleano. Las navegación de nivel superior permanecen particionadas solo por origen de marco.

El acceso a la dirección URL de blob con particiones por clave de almacenamiento es similar a lo que se implementa actualmente en Firefox y Safari. Esto alinea el uso de la dirección URL de blob con el esquema de creación de particiones que usan otras API de almacenamiento como parte de la creación de particiones de almacenamiento.

Junto con ese cambio, Microsoft Edge ahora aplica en las navegación de noopener nivel superior iniciadas por el representador a las direcciones URL de blob, donde el sitio correspondiente es entre sitios al sitio de nivel superior que realiza la navegación. Esto se alinea con un comportamiento similar en Safari y con las especificaciones correspondientes.

La creación de particiones de direcciones URL de blob se puede revertir temporalmente estableciendo la PartitionedBlobUrlUsage directiva:

  • Si esta directiva está establecida Enabled en o no está establecida, las direcciones URL de blob se crean particiones.
  • Si esta directiva está establecida en Disabled, las direcciones URL de blob no están particionadas.

Consulte Restricciones de acceso en las direcciones URL de blob en la especificación de File API.

Pilas de llamadas en informes de bloqueo desde páginas web que no responden

Cuando una página web deja de responder debido a que el código JavaScript ejecuta un cálculo muy largo, como un bucle infinito, la pila de llamadas de Javascript se registra e incluye en el informe de bloqueo que se envía al punto de conexión del servidor de Reporting API configurado por el sitio web.

Consulte Reporting API en MDN.

Tipos de color de punto flotante en <canvas>

CanvasRenderingContext2DLos objetos , OffscreenCanvasRenderingContext2Dy ImageData ahora admiten formatos de píxeles de punto flotante, además de formatos de punto fijo de 8 bits.

Este cambio permite aplicaciones de alta precisión, como:

  • Visualizaciones médicas.
  • Contenido de rango dinámico alto.
  • Espacios de color de trabajo lineales.

Consulte Valores de color de punto flotante de lienzo.

Directivas de aislamiento de documentos

Las directivas de aislamiento de documentos permiten a un documento habilitar el aislamiento entre orígenes para sí mismo, sin tener que usar encabezados de respuesta entre orígenes-opener-policy (COOP) o cross-origin-embedder-policy (COEP), e independientemente del estado de aislamiento entre orígenes de la página.

Vea también:

Compatibilidad con algoritmos de firma Ed25519 en Web Cryptography API

La API de criptografía web ahora admite el algoritmo de firma Ed25519.

Consulte Curvas seguras en WebCrypto.

JavaScript Promise Integration (JSPI) en WebAssembly

JavaScript Promise Integration (JSPI) es una API que permite que las aplicaciones WebAssembly se integren con JavaScript Promises.

JSPI permite que un programa WebAssembly actúe como el generador de una promesa, y permite que el programa WebAssembly interactúe con las API que llevan la promesa.

Cuando una aplicación usa JSPI para llamar a una API de promise-bearing (JavaScript):

  • El código WebAssembly está suspendido.
  • El autor de la llamada original al programa WebAssembly recibe una promesa que se cumplirá cuando el programa WebAssembly finalice por fin.

Consulte js-promise-integration.

Sugerencias de rama de WebAssembly

Para mejorar el rendimiento del código webAssembly compilado, se usan sugerencias de rama para informar al motor de que es muy probable que una instrucción de rama determinada tome una ruta de acceso específica.

Esto permite que el motor tome mejores decisiones para el diseño de código y la asignación de registros.

Consulte Sugerencias de rama.

Restringir los tipos de atributos y argumentos que aceptan SVGMatrix, SVGRect y SVGPoint

El establecimiento de atributos y argumentos de SVGMatrix, SVGRect y SVGPoint Infinity en o NaN ahora no está permitido.

Los atributos o argumentos de configuración de estos valores ahora producirán una excepción de JavaScript.

Consulte SVG API en MDN.

API getComposedRanges de selección y direction

Selection API ahora admite la siguiente propiedad y método:

  • Selection.direction devuelve la dirección de la selección como none, forwardo backward.
  • Selection.getComposedRanges() devuelve una lista de 0 o 1 objetos compuestosStaticRange .

Un compuesto StaticRange puede cruzar los límites dom de sombra, a diferencia Range de los objetos.

Por ejemplo:

const range = getSelection().getComposedRanges({ shadowRoots: [root] });

Para asegurarse de que los árboles de sombra desconocidos no se exponen por accidente, si la selección de texto cruza un límite de raíz de sombra que no se proporciona en la shadowRoots propiedad, los StaticRangepuntos finales devueltos estarán fuera de ese árbol de sombras.

Vea Selection: getComposedRanges() method en MDN.

WebGPU API

Enlazar externalTexture a GPUTextureView

Al crear una GPUBindGroup cuando se usa WepGPU, ahora puede enlazar externalTexture a .GPUTextureView

Esto ayuda en escenarios como cuando se usa la API de WebGPU para canalizaciones de efectos de vídeo. Al permitir que se use un compatible GPUTextureView en lugar de , GPUExternalTexturese simplifica la lógica del sombreador.

Consulte GPUExternalTexture en MDN.

Copia de búferes completos con copyBufferToBuffer()

El GPUCommandEncoder.copyBufferToBuffer() método facilita la copia de búferes completos, ya que permite omitir los offsets parámetros y size .

Vea GPUCommandEncoder: método copyBufferToBuffer() en MDN.

Pruebas de origen

A continuación se muestran las nuevas API experimentales que puede probar en su propio sitio web en directo durante un tiempo limitado.

Para obtener más información sobre las pruebas de origen, consulte Probar las API y características experimentales mediante las pruebas de origen.

Para obtener la lista completa de las pruebas de origen disponibles, consulte Pruebas de origen de Microsoft Edge.

Nuevas pruebas de origen de Chromium

Pausar la reproducción multimedia en iframes no representados

Expira el 27 de enero de 2026.

La media-playback-while-not-visible directiva de permisos pausa los medios que reproducen los iframes que no se representan actualmente en fotogramas no permitidos. Esto se aplica siempre que la propiedad CSS del display iframe se establece en none o cuando la visibility propiedad se establece en hidden o collapse.

Actualmente, HTMLMediaElements se admiten los elementos multimedia y AudioContexts .

Pruebas de origen solo de Microsoft Edge

Extensiones de ámbito de aplicación web

Expira el 31 de agosto de 2025

scope_extensions es un nuevo miembro del manifiesto de aplicación web que permite a las aplicaciones web ampliar su ámbito a otros orígenes.

Las extensiones de ámbito permiten que las aplicaciones web que dependen de varios subdominios y dominios de nivel superior se presenten como una sola aplicación web.

{
  "name": "Example app",
  "display": "standalone",
  "start_url": "/index.html",
  "scope_extensions": [
    {
      "type": "type",
      "origin": "https://example.com"
    }
  ]
}

Los orígenes que aparecen en el scope_extensions miembro deben confirmar que están asociados a la aplicación web hospedando un archivo de configuración denominado .well-known/web-app-origin-association. El archivo debe mostrar el origen de la aplicación web:

{
  "https://sample-app.com/": {
    "scope": "/"
  }
}
API de información de adquisición

Expira el 30 de junio de 2025.

La API de información de adquisición admite la atribución de adquisición 3P para los PPA que se adquirieron a través de una tienda de aplicaciones o directamente desde el explorador.

Desuso del contraste alto de MS

Expira el 9 de septiembre de 2025.

Habilita la consulta de medios CSS -ms-high-contrast heredada y la propiedad heredada -ms-high-contrast-adjust .

Consulte Compatibilidad en desuso para -ms-high-contrast y -ms-high-contrast-adjust.

Nota:

Las partes de esta página son modificaciones basadas en el trabajo creado y compartido por Chromium.org y usadas de acuerdo con los términos descritos en la Licencia internacional creative Commons Attribution 4.0.

  • Last updated on