Edit

Share via


Microsoft Edge 140 web platform release notes (Sep. 2025)

The following are the new web platform features and updates in Microsoft Edge 140, which releases on September 4, 2025.

To stay up-to-date and get the latest web platform features, download a preview channel of Microsoft Edge (Beta, Dev, or Canary); go to Become a Microsoft Edge Insider.

Detailed contents:

Edge DevTools

See What's New in Microsoft Edge DevTools.

WebView2

See Release Notes for the WebView2 SDK.

Web platform features

CSS features

CSS caret-animation property

Microsoft Edge supports animating the caret-color CSS property. However, when animated, the default blinking behavior of the caret interfered with the animation.

The caret-animation property now supports two values:

  • auto: The default browser blinking behavior occurs.
  • manual: You control the caret animation.

See also:

counter() and counters() in alternative text of the content CSS property

The counter() and counters() CSS functions can now be used in the alternative text portion of the content CSS property.

For example:

::before {
  content: url("images/chapter-separator.png") / "Chapter" counter(chapter);
}

See also:

CSS scroll-target-group property

The scroll-target-group: auto CSS property specifies that the element is a scroll marker group container.

The browser tracks the current scroll marker within scroll marker group containers and allows you to style <a> elements by using the :target-current pseudo class.

For example, the following snippet shows how to automatically highlight the currently visible chapter within a table of contents:

<style>
  ol {
    right: 10px;
    top: 10px;
    position: fixed;
    scroll-target-group: auto;
  }

  a:target-current {
    color: red;
  }

  .chapter {
    height: 60vh;
    margin: 10px;
  }
</style>
<ol>
  <li><a href="#intro">Introduction</a></li>
  <li><a href="#ch1">Chapter 1</a></li>
  <li><a href="#ch2">Chapter 2</a></li>
</ol>
<div id="intro" class="chapter">Introduction content</div>
<div id="ch1" class="chapter">Chapter 1 content</div>
<div id="ch2" class="chapter">Chapter 2 content</div>

See also:

CSS typed arithmetic

Typed arithmetic in CSS allows you to write expressions such as calc(10em / 1px) or calc(20% / 0.5em * 1px) to get unitless values. Unitless values can be useful for cases such as typography.

CSS typed arithmetic allows you to convert values with units into unitless values. You can then use the unitless value in CSS properties that accept numbers, or further multiply the unitless value by a value with another unit, such as to convert a pixels value to a degrees value.

See also:

View transition finished promise timing change

Previously, a view transition's finished promise resolved after the visual frame that removes the view transition has been produced by the browser. This can cause flickering at the end of the view transition, if JavaScript code modifies styles.

The timing of the finished promise has now been changed to address this issue.

See also:

View transitions: more animation properties are inherited

The following CSS animation properties are now inherited by view transition pseudo-elements:

  • animation-timing-function
  • animation-iteration-count
  • animation-direction
  • animation-play-state
  • animation-delay

See also:

Nested view transitions

Nested view transitions allow view transitions to generate a nested pseudo-element tree rather than a flat pseudo-element tree, which allows certain view transitions to appear more like their original elements.

Some CSS features rely on the relationship between elements in the DOM tree, such as:

  • Clipping from the overflow, clip-path, or border-radius properties.
  • 3D effects from the transform, transform-style, or perspective properties.
  • Masking and effects from the opacity, mask-image, or filter properties.

The visual output of these effects depend on the DOM tree structure, and a view transition that flattens the DOM tree can cause these effects to not work as expected.

See also:

font-variation-settings descriptor in @font-face rules

@font-face rules now support the font-variation-settings property.

The font-variation-settings property allows you to adjust a font's weight, width, slant, and other axes on individual elements. Now, the font-variation-settings property can also be used within @font-face rule declarations, which can help reduce repetition and make it easier to define typographic styles.

See also:

SVG features

CSS width and height support for SVG <use> element

The SVG <use> element now supports the width and height CSS properties.

This allows you to control the sizing of SVG elements through CSS, such as to improve their responsiveness.

With this feature, the following two HTML snippets now produce the same output:

<svg width="100px" height="100px">
 <defs>
    <symbol id="sym" width="80" height="80">
      <rect width="100" height="100" fill="green" />
    </symbol>
  </defs>
  <use href="#sym" style="width:40px; height:40px" />
</svg>
<svg width="100px" height="100px">
 <defs>
    <symbol id="sym" width="80" height="80">
      <rect width="100" height="100" fill="green" />
    </symbol>
  </defs>
  <use href="#sym" width="40" height="40" />
</svg>

See also:

Support download attribute in SVG <a> element

The download attribute is now supported by SVG <a> elements.

The download attribute enables you to specify that the target of an SVG hyperlink should be downloaded rather than navigated to.

See also:

Web APIs

ariaNotify() API

The ariaNotify() API enables your app to directly tell a screen reader what to say when there's a non-user-initiated change in the content of a webpage. In the simplest scenario, you call ariaNotify("foo") on the document or on an element.

See also:

To distinguish, on the server side, between cookies that were set by the server and the client, the __Http- and __HostHttp- name prefixes are now available in cookies.

These prefixes can be used to check if a cookie was set on the client-side by using JavaScript code, such as to verify that a cookie that's normally always set by the server was not unexpectedly set by the client.

See also:

overscroll-behavior propagation from <html> to the viewport

Previously, overscroll-behavior was propagated from the <body> to the viewport of the page. The overscroll-behavior property is now propagated from the root <html> element to the viewport.

This aligns Microsoft Edge with other browsers.

See also:

min option for ReadableStreamBYOBReader.read(view)

The min option for the ReadableStreamBYOBReader.read(view) API lets you require that the stream wait until at least a minimum number of elements are available before resolving the read operation.

The ReadableStreamBYOBReader.read(view) API allows you to supply a buffer view into which stream data is read. The new min option can be used to avoid resolving the stream's read operation with fewer elements than the view can accommodate, which is useful for performance-sensitive applications where consumers often require a minimum number of elements before they can proceed with decoding, parsing, or other processing logic.

See also:

container option for scrollIntoView()

By default, the scrollIntoView() function scrolls every ancestor of the element that's also a scroll container.

The scrollIntoView() function now supports a container option, which can be used to only scroll the nearest ancestor instead.

For example:

slideList.addEventListener('click', event => {
  // scrollIntoView will automatically determine the position.
  event.target.targetSlide.scrollIntoView({container: 'nearest', behavior: 'smooth'});
});

See also:

Service worker static routing API timings

New service worker static routing API timing information is now available to the navigation and resource timing APIs. This information allows you to measure the latency that's incurred by the static routing API, such as router evaluation time or time required to conduct cache lookup, or determine if the matched source is the final source used.

The new timing information provides:

  • The matched route (the route that the static routing API evaluated).
  • The actual source from which the resource was retrieved.
  • The time it took to match the route.

See also:

SharedWorker script inherit controllers for Blob URLs

SharedWorker instances now inherit controllers for Blob URLs. This makes Microsoft Edge consistent with other browsers.

See also:

restrictOwnAudio media track constraint

The new restrictOwnAudio media track constraint can help create cleaner screen recordings, such as when the capturing webpage itself is playing audio and you don't want that audio to be included in the capture, to avoid undesirable echo.

By default, when using getDisplayMedia() and when the system audio is captured, all audio that's played by the system is captured. If the restrictOwnAudio constraint is set, the captured system audio is filtered to exclude audio originating from the document that called getDisplayMedia().

See also:

Popover ToggleEvent source attribute

The source attribute of a popover's ToggleEvent instances now refers to the element which triggered the ToggleEvent, if applicable.

For example, if a <button> element with the popovertarget attribute, or the commandfor attribute set up to open a popover, is clicked by the user, then the ToggleEvent has a source attribute set to the invoking button.

See also:

Convert Uint8Array between base64 and hex formats

Uint8Array objects have the following new methods to convert between Base64 and Hex data formats:

  • Uint8Array.fromBase64()
  • Uint8Array.fromHex()
  • Uint8Array.prototype.toBase64()
  • Uint8Array.prototype.toHex()
  • Uint8Array.prototype.setFromBase64()
  • Uint8Array.prototype.setFromHex()

See also:

highlightsFromPoint API

The highlightsFromPoint API lets you interact with custom highlights by detecting which highlights exist at a specific point within a document.

The highlightsFromPoint API is useful for apps where multiple highlights may overlap or exist within the shadow DOM. This API makes it possible to manage dynamic interactions that have custom highlights more effectively, such as by responding to user clicks or hover events on highlighted regions, to trigger custom tooltips, context menus, or other interactive features.

See also:

Removed features

Removed special font size rules for <h1> within some elements

Previously, special margins and font sizes were applied to <h1> elements that were nested within <article>, <aside>, <nav>, and <section> elements.

These special rules are now removed, because they caused accessibility issues, such as visually reducing the font size for nested <h1> elements to look like <h2> without reflecting this change in the accessibility tree.

See also:

Origin trials

The following are new experimental APIs which you can try on your own live website for a limited time.

To learn more about origin trials, see Use origin trials in Microsoft Edge.

To see the full list of available origin trials, see Microsoft Edge Origin Trials.

Microsoft Edge-only origin trials

Web app scope extensions

Expires on August 31, 2025

scope_extensions is a new web app manifest member that enables web apps to extend their scope to other origins.

Scope extensions allow web apps that rely on multiple subdomains and top-level domains to be presented as a single web app.

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

The origins that are listed in the scope_extensions member must confirm that they are associated with the web app, by hosting a configuration file named .well-known/web-app-origin-association. The file must list the web app's origin:

{
  "https://sample-app.com/": {
    "scope": "/"
  }
}
MS High Contrast Deprecation

Expires on September 9, 2025.

The MS High Contrast Deprecation origin trial enables the legacy CSS -ms-high-contrast media query and the legacy -ms-high-contrast-adjust property.

See Deprecating support for -ms-high-contrast and -ms-high-contrast-adjust.

AriaNotify API

Expires on October 14, 2025.

The AriaNotify API enables your app to directly tell a screen reader what to say when there's a non-user-initiated change in the content of a webpage. In the simplest scenario, you call ariaNotify("foo") on the document or on an element.

See Creating a more accessible web with Aria Notify.

Acquisition Info API

Expires on December 18, 2025.

The Acquisition Info API supports third-party acquisition attribution for PWAs that were acquired through an app store or directly from the browser.

Note

Portions of this page are modifications based on work created and shared by Chromium.org and used according to terms described in the Creative Commons Attribution 4.0 International License.