Here's what you need to know:
- The CloseWatcher API enables a consistent experience when handling close requests.
- Easily implement an accordion pattern using the
- Permission policy violation reports are now available.
- And there's plenty more.
I'm Adriana Jara. Let's dive in and see what's new for developers in Chrome 120.
An important feature of modal or popup components is that they are easy to close,with a consistent mechanism for doing so. Those mechanisms are called close requests, they are typically the
ESC key on desktop platforms, and the back gesture or button on Android.
Web developers had no good way to handle close requests for their own components. This is especially problematic on Android devices, where providing the simple closing behavior for the back gesture is quite complex.
Chrome 120 brings the solution with CloseWatcher, a new API for directly listening and responding to close requests. It also includes upgrades to
popover="" to use the new close request framework, so that they respond to the Android back button.
Checkout the CloseWatcher API demo to give it a try.
<details> name attribute
name attribute for the
<details> element makes it easy to implement the accordion pattern using a sequence of
<details> HTML elements.
<details> elements that have the same
name form a group. With this setup at most one element in that group can be opened at once.
Here is an example with a group that shares the name
Yum yum chocolate chip.
Yum yum snickerdoodle.
Yum yum maicenitas.
Yum yum sugar cookies.
Permission policy violation reports
Permissions policy violation reports are now available, these reports integrate the Permissions policy API that allows developers to control the browser features available to a page, its iframes, and subresources, by declaring a set of policies for the browser to enforce with the Reporting API. The Reporting API provides a generic reporting mechanism for web applications to use to make reports available based on several platform features.
This Permissions Policy API and Reporting API integration allows web developers to configure endpoints, to which permissions policy violation reports will be sent, allowing site owners to see when disallowed features are being requested for their pages in the field.
Controlling browser features with Permissions Policy includes more implementation details.
Of course there's plenty more.
The relaxed CSS nesting implementation allows nested style rules to begin with an element, rather than being wrapped with
is()or requiring an ampersand in front.
enterpictureinpictureaction in the Media Session API, websites can register an action handler which can be used to open a Picture-in-Picture or Document Picture-in-Picture window.
And a reminder that Chrome is working towards deprecating third party cookies. In January an experiment begins that could affect your website, so it's important that you check Preparing for the end of third-party cookies for auditing and mitigating steps.
This covers only some key highlights. Check the links below for additional changes in Chrome 120.
- What's new in Chrome DevTools (120)
- Chrome 120 deprecations and removals
- ChromeStatus.com updates for Chrome 120
- Chromium source repository change list
- Chrome release calendar
Yo soy Adriana Jara, our team wishes you happy holidays and as soon as Chrome 121 is released, I'll be right here to tell you what's new in Chrome!