📃 May 2022 release notes

Newly available

The following features are newly available:

dynamic-range media query: The dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
prefers-contrast media query: The prefers-contrast CSS media query sets styles based on whether the user prefers more or less contrast, the difference between foreground and background colors.
Exception handling (WebAssembly): Exceptions break the normal control flow of execution to represent exceptional behavior, such as an error. You can respond to the exception in JavaScript code.

The following features are now available in Chrome:

File handlers: The file_handlers web app manifest member registers an installed web app as a handler for files with specific file extensions or MIME types.
Column breaks: In columnar layouts (created by the columns or column-count CSS properties), the break-after, break-before, break-inside properties control where columns start or end.
hidden="until-found": The hidden="until-found" attribute hides an element until it is found using the browser's find-in-page search or it is directly navigated to by following a URL fragment.
Navigation API: The navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.

The following features are now available in Chrome Android:

Column breaks: In columnar layouts (created by the columns or column-count CSS properties), the break-after, break-before, break-inside properties control where columns start or end.
hidden="until-found": The hidden="until-found" attribute hides an element until it is found using the browser's find-in-page search or it is directly navigated to by following a URL fragment.
Navigation API: The navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.

The following features are now available in Edge:

File handlers: The file_handlers web app manifest member registers an installed web app as a handler for files with specific file extensions or MIME types.
Column breaks: In columnar layouts (created by the columns or column-count CSS properties), the break-after, break-before, break-inside properties control where columns start or end.
hidden="until-found": The hidden="until-found" attribute hides an element until it is found using the browser's find-in-page search or it is directly navigated to by following a URL fragment.
Navigation API: The navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.

The following features are now available in Firefox:

Constructed stylesheets: The CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
Inline-size containment: The contain: inline-size CSS declaration prevents the element's inline dimension from being set by the element's contents. This permits the browser to avoid slower layout calculations.
preservesPitch: The preservesPitch property for <audio> or <video> adjusts the pitch of audio to sound more natural when the playback rate is faster or slower than the default.
showPicker() for <input>: The showPicker() method for <input> elements shows the user interface for picking a value. For example, for <input type="date"> it shows the interface for picking a date.
video-dynamic-range media query: The video-dynamic-range CSS media query sets styles based on whether a device can display video with at least standard range colors or at least high range colors. Non-visual devices will match neither.
Small, large, and dynamic viewport units: The sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.

The following features are now available in Firefox for Android:

Constructed stylesheets: The CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
Inline-size containment: The contain: inline-size CSS declaration prevents the element's inline dimension from being set by the element's contents. This permits the browser to avoid slower layout calculations.
preservesPitch: The preservesPitch property for <audio> or <video> adjusts the pitch of audio to sound more natural when the playback rate is faster or slower than the default.
showPicker() for <input>: The showPicker() method for <input> elements shows the user interface for picking a value. For example, for <input type="date"> it shows the interface for picking a date.
video-dynamic-range media query: The video-dynamic-range CSS media query sets styles based on whether a device can display video with at least standard range colors or at least high range colors. Non-visual devices will match neither.
Small, large, and dynamic viewport units: The sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.