Unless otherwise noted, changes described below apply to the newest Chrome beta channel release for Android, Chrome OS, Linux, macOS, and Windows. Learn more about the features listed here through the provided links or from the list on ChromeStatus.com. Chrome 98 is beta as of January 10, 2022. You can download the latest on Google.com for desktop or on Google Play Store on Android.
COLRv1 Color Gradient Vector Fonts
In this version Chrome supports COLRv1 color gradient vector fonts as an additional new font format. A color font contains glyphs with multiple colors in them, which can be for example an emoji or a country flag or a multi-colored letter.
COLRv1 is an evolution of the COLRv0 font format intended to make color fonts widespread on the web. COLRv1 fonts bring expressive visual capabilities such as gradients, transforms and compositions at a very small font size. COLRv1 fonts also support OpenType variations. Internal shape reuse and a compact font format definition, plus effective compression, lead to very small font sizes.
The image illustrates the example of Noto Color Emoji, which is about 9MB as a bitmap font, but only 1.85MB as a COLRv1 vector font (after WOFF2 compression).
|
Crisp COLRv1 vector font (left) compared to a bitmap font (right). Noto Emoji font size as bitmap font vs. COLRv1 font after WOFF2 compression.
|
For more information, see COLRv1 Color Gradient Vector Fonts in Chrome 98.
Preparing for a Three Digit Version Number
This year, Chrome will release version 100, adding a digit to the version number reported in Chrome's user agent string. To help site owners test for the new string, Chrome 96 introduced a runtime flag that causes Chrome to return '100' in its user agent string. This new flag called chrome://flags/#force-major-version-to-100 has been available from Chrome 96 onward. For more information, see Force Chrome major version to 100 in the User-Agent string.
Origin Trials
This version of Chrome introduces the origin trials described below. Origin trials allow you to try new features and give feedback on usability, practicality, and effectiveness to the web standards community. To register for any of the origin trials currently supported in Chrome, including the ones described below, visit the Chrome Origin Trials dashboard. To learn more about origin trials in Chrome, visit the Origin Trials Guide for Web Developers. Microsoft Edge runs its own origin trials separate from Chrome. To learn more, see the Microsoft Edge Origin Trials Developer Console.
New Origin Trial
Region Capture
Region Capture is an API for cropping a self-capture video track. Applications can currently obtain a capture of the tab in which they run using getDisplayMedia()
, either with or without preferCurrentTab
. In this case, the application may want to crop the resulting video track to remove some content from it (typically before sharing it remotely).
Other Features in this Release Adding auto Keyword for contain-intrinsic-size
Support for the auto keyword in contain-intrinsic-size
is added, letting websites use the last-remembered size of an element (if any), which provides for a better user experience than for elements with content-visibility: auto
. Without this feature, web developers have to guess the rendered size of the element; when used with content-visibility: auto
, this may lead to elements jumping around.
AudioContext.outputLatency
The new AudioContext.outputLatency
property is an estimate in seconds of audio output latency. Technically, this is the interval between the time the user agent requests the host system to buffer and the time at which the first sample in the buffer is processed by the audio output device. For devices such as speakers or headphones that produce an acoustic signal, this latter time refers to the time when a sample's sound is produced. This is already implemented in Firefox.
CSS Color Adjust: 'only' Keyword for color-scheme
The only
keyword, which has been re-added to the specification for color-scheme
, is now supported in Chrome. It allows opting out of color-scheme for single, specific elements. For example, this allows overriding of force darkening. A few examples illustrate its use.
div { color-scheme: light }
This forces the div element out of color-scheme dark.
div { color-scheme: only light }
This keeps the color-scheme
for the element light as above, and opts it out of forced darkening by the user agent.
document.adoptedStyleSheets is Now Mutable
In compliance with the spec, the document.adoptedStyleSheets
property is now mutable, meaning operations such as push()
and pop()
now work on it. The previous implementation of adoptedStyleSheets
was unwieldy. For example, to add a sheet, the entire array had to be re-assigned:
document.adoptedStyleSheets = [...adoptedStyleSheets, newSheet];
With the new implementation, the same operation looks like this:
document.adoptedStyleSheets.push(newSheet);
High Dynamic Range Color Media Queries
Chrome now supports the CSS media queries 'dynamic-range'
and 'video-dynamic-range'
for detecting the current display device's support for HDR. Possible values are 'standard'
and 'high'
. These queries allow pages to toggle CSS rules or respond using Window.matchMedia()
.
New window.open() Behavior for Popups, Tabs, and Windows
As per a spec update, this version of Chrome lets you specify whether window.open()
launches a new window or a new tab. The following examples show the new syntax. The first will open a pop up window. The second will open a new tab or window.
const popup = window.open('_blank','','popup=1');
const tab = window.open('_blank','','popup=0');
Additionally, window.statusbar.visible
now correctly returns correct values: specifically, false
for popups, and true
for tabs, and windows.
Private Network Access Preflight Requests for Subresources
CORS preflight requests are now sent ahead of private network requests for subresources, asking for explicit permission from the target server. A private network request is any request from a public website to a private IP address or localhost, or from a private website (e.g. intranet) to localhost. Sending a preflight request mitigates the risk of cross-site request forgery attacks against private network devices such as routers, which are often not prepared to defend against this threat.
structuredClone() Method on Windows and Workers
Windows and Workers now support the structuredClone()
methods for making deep copies of objects. A deep copy is one that copies an object's properties, but invokes itself recursively when it finds a reference to another object, creating a copy of that object as well. This ensures that two pieces of code don't accidentally share an object and unknowingly manipulate each others' state. For an explanation of deep copies and how to use them, see Deep-copying in JavaScript using structuredClone.
WebAuthn minPinLength Extension
Chrome now exposes the CTAP 2.1 minPinLength extension via Web Authentication. This allows sites preconfigured for a security key to learn the configured minimum PIN length for the authenticator.
Window Controls Overlay for Installed Desktop Web Apps
When the window controls overlay is enabled for installed desktop web apps, the app's client area is extended to cover the entire window—including the title bar area—and the window control buttons (close, maximize/restore, minimize) are overlaid on top of the client area. The web developer is responsible for drawing and input-handling for the entire window except for the window controls overlay. Developers can use this feature to make their installed desktop web apps look like OS apps.
WritableStream controller AbortSignal
WritableStreamDefaultController
now supports a signal property which returns an instance of AbortSignal
, allowing a WritableStream
operation to be stopped if needed. The streams APIs provide ubiquitous, interoperable primitives for creating, composing, and consuming streams of data. This change permits an underlying sink to rapidly abort an ongoing write or close when requested by the writer. Previously, when writer.abort()
was called, a long-running write would still have to continue to completion before the stream could be aborted. With this change, the write can be aborted immediately. In addition to being exposed to streams authored in JavaScript, this facility will also be used by platform-provided streams such as WebTransport
.
Deprecations, and Removals
This version of Chrome introduces the deprecations and removals listed below. Visit ChromeStatus.com for lists of current deprecations and previous removals.
Remove SDES Key Exchange for WebRTC
The SDES key exchange mechanism for WebRTC has been declared a MUST NOT in the relevant IETF standards since 2013. Its usage in Chrome has declined significantly over the last year. SDES is removed because it is a security problem. It exposes session keys to Javascript, which means that entities with access to the negotiation exchange, or with the ability to subvert the Javascript, can decrypt the media sent over the connection.