New to the web platform in May

by:

Web Development

[ad_1]

Stable browser releases #

In May, Chrome 102, Safari 15.5, Firefox 100, and Firefox 101 became stable.

Chrome 102 and Safari 15.5 include the inert attribute. This removes elements from the tab order and accessibility tree if they are non-interactive. For example, an element that is currently offscreen or hidden.

Chrome 102 includes the new value until-found for the HTML hidden attribute. This enables find-in-page and scroll to text fragment on text that is inside a collapsed area of the page, as you might find in an accordion pattern. Find out more in the post Making collapsed content accessible with hidden=until-found.

Browser support: chrome 102, Supported 102 firefox, Not supported × edge 102, Supported 102 safari, Not supported × Source

Chrome 102 ships the Navigation API, an API that standardizes client-side routing in single-page applications. This API was previously named the App History API.

Browser support: chrome 102, Supported 102 firefox, Not supported × edge 102, Supported 102 safari, Not supported ×

Firefox 101 supports constructable stylesheets. Support includes the CSSStyleSheet() constructor, and the replace(), and replaceSync() methods. Constructable stylesheets make it easier to create stylesheets for use with the Shadow DOM. In the following example, a stylesheet is created using the CSSStyleSheet() constructor, a CSS rule is added with the replaceSync() method, and the resulting rule is printed to the console.

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

Browser support: chrome 73, Supported 73 firefox 73, Behind a flag edge 79, Supported 79 safari, Not supported × Source

Also in Firefox 101 is the prefers-contrast media feature, making this feature available cross-browser.

Browser support: chrome 96, Supported 96 firefox 80, Behind a flag edge 96, Supported 96 safari 14.1, Supported 14.1 Source

Beta browser releases #

Beta browser versions give you a preview of things that will be in the next stable version of the browser. It’s a great time to test new features, or removals, that could impact your site before the world gets that release.

New betas in April were Chrome 103 and Firefox 102.

Firefox 102 includes the update media feature. This is used to query whether the output device can modify the appearance of content once it has been rendered. It accepts the following values:

none
Once rendered the content cannot be updated. For example, a printed document.
slow
The device can update the content, but too slowly to display smooth animation. For example, E-ink screens.
fast
The content can change dynamically, and quickly enough to render animations. For example, a computer or phone screen.

Chrome 103 includes the Local Font Access API, which allows access to the user’s locally installed fonts.

These beta features will land in stable browsers soon.

Edit: A previous version of this post included mention of the Element.isVisible() method, which is not shipping in this release.

Last updated: — Improve article

Leave a Reply

Your email address will not be published. Required fields are marked *