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 103 is beta as of May 26, 2022. You can download the latest on Google.com for desktop or on Google Play Store on Android.
Chrome now supports the 103 Early Hints HTTP response code for navigation. (Note: the correspondence with the Chrome release number is a coincidence.) When a 103 response includes <link rel=preload> or other link headers Chromium tries to preload (and/or preconnect, prefetch) specified resources before the final response is received. This gives web developers a way to optimize core web vitals such as Largest Contentful Paint (LCP).
<link rel=preload>
HTTP/2 introduced the concept of server push, a mechanism that allows a server to preemptively send data to the client. Server push was intended to improve site performance. In the years since, developers have generally preferred preloading from the client side of a web interaction. 103 early hints for navigation provides a new way to do that.
For information on the work that went into bringing this to the web, see Beyond Server Push: The 103 Early Hints Status Code.
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.
The Federated Credential Management API allows users to log in to websites with their federated accounts in a privacy preserving manner. It allows the browser to understand the context in which the relying party and identity provider exchange information, inform the user about the information and privilege levels being shared and prevent unintended abuse. For more information, see Participate in a Federated Credential Management API origin trial for IdPs.
The following features, previously in a Chrome origin trial, are now enabled by default.
Web applications can now enumerate local fonts and metadata about each. The new API also gives web applications access to table data stored within local fonts, allowing those fonts to be rendered within their applications using custom text stacks.
Note: The Chrome 102 beta post erroneously listed this feature as shipping in that version.
Prerendering loads a web page before it is needed, so that when the actual navigation to that page occurs, it can be shown instantly. To speed up page loads. Chrome's previous prerender mechanism is now replaced with No State Prefetch. No State Prefetch doesn't generally result in an instant page load experience, but the new feature does. This feature is supported on Android only.
The implementation of GREASE in User Agent Client Hints is now aligned with the current spec, which includes additional GREASE characters beyond the current semicolon and space, and which recommends varying the arbitrary version. This helps prevent bad assumptions from being built on top of User-Agent strings.
GREASE
Returns a new AbortSignal object that is automatically aborted after a given number of milliseconds. Use this method to easily implement timeouts for signal-accepting asynchronous APIs, such as fetch(). For example: fetch(url, { signal: AbortSignal.timeout(10_000) });
fetch()
fetch(url, { signal: AbortSignal.timeout(10_000) });
The Element and ElementInternal interfaces now include an ARIA property called ariaRoleDescription which returns or modifies the ARIA role attribute directly. This feature is only supported on desktop.
Element
ElementInternal
ARIA
The avif image file format is now sharable by Web Share. Adding avif to the other allowed image file types helps spread the use of it. A website might like their users to be able to share pictures and other files through social media, email, chat, etc. The Web Share API is already shipped to more platforms such as ChromeOS and Windows, but avif is not supported yet.
Chrome supports a new compression format, deflate-raw, to give web developers access to the raw deflate stream without any headers or footers. This is needed, for example, to read and write zip files.
deflate-raw
The 'rel' attribute has been added to form elements. This makes it possible to prevent window.opener from being present on websites navigated to by form elements which have rel=noopener. It also prevents the referer header from being sent with rel=noreferrer.
'rel'
window.opener
rel=noopener
referer
rel=noreferrer
Chromium now matches Firefox and by firing popstate immediately after URL changes so that the order of events is now popstate then hashchange across both platforms. Before this change, Chromium fired hashchange asynchronously after a task, and delayed popstate until the load event. This means the event order could be either hashchange then popstate, or popstate then hashchange, depending on how long a document took to load.
popstate
hashchange
The Gampepad API now requires a secure context. Additionally a new feature policy called 'gamepad' has been added with a default allowlist of 'self'.
'gamepad'
'self'
The SerialPort forget() method allows web developers to voluntarily revoke a permission to a serial port that was granted by a user. Some sites may not be interested in retaining long-term permissions to access serial ports. For example, for an educational web application used on a shared computer with many devices, a large number of accumulated user-generated permissions creates a poor user experience. In addition to user agent mitigations to avoid this problem, such as defaulting to a session scoped permission on the first request or expiring infrequently used permissions, it should be possible for the site itself to clean up user-generated permissions it no longer needs.
SerialPort forget()
This follows the recent additions of a forget() method for the HIDDevice and USBDevice interfaces.
forget()
HIDDevice
USBDevice
The overflow-clip-margin CSS property now supports visual-box, which specifies the box edge to use as the overflow clip edge origin. Valid values are content-box, padding-box (the default), or border-box. The overflow-clip-margin property specifies how far an element's content is allowed to paint before being clipped.
overflow-clip-margin
visual-box
content-box
padding-box
border-box
A user activation requirement has been added for Secure Payment Confirmation credential enrollment in a cross-origin iframe. This is being done to help mitigate a privacy issue.
This version of Chrome introduces the deprecations and removals listed below. Visit ChromeStatus.com for lists of current deprecations and previous removals.
Sandboxed iframes are not blocked from opening external applications. Currently, developers sandbox untrusted content and block user navigation. Blocking probably should have also included links to external apps or to the Play store. This has now been fixed.
Sites that need navigation can add the following values to the <iframe> element's sandbox property:
<iframe>
allow-popups
allow-top-navigation
allow-top-navigation-with-user-activation
The Battery Status API is no longer supported on insecure contexts, specifically HTTP pages and HTTPS iframes embedded in HTTP pages. This is being removed in accordance with our policy of deprecating powerful features on insecure origins, This also follows a spec change.
Given the removal of plugins from the web platform, and the relative lack of use of <param>, it is being removed from the web platform.
<param>
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 102 is beta as of April 28, 2022. You can download the latest on Google.com for desktop or on Google Play Store on Android.
Window controls overlay extends an app's client area to cover the entire window, including the title bar, and the window control buttons (close, maximize/restore, minimize). The web app 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 operating system apps. For more information, see Customize the window controls overlay of your PWA's title bar.
The following features, previously in a Chrome origin trial, are now enabled by default. 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.
A new mechanism allows an application to opt-in to exposing information to applications that are video-capturing it. This allows collaboration between capturing and captured applications. For example, a video conference application that's video-capturing a presentation, could expose user-facing controls in the video conference tab for navigating the presentation in the captured tab.
Network state is now partitioned by the network partition key (which consists of top frame site and possibly frame site), to protect against cross-site tracking through the use of side channels. "Network State" here includes connections (H1, H2, H3, websocket), the DNS cache, ALPN/H2 support data, TLS/H3 resumption information, Reporting/NEL configuration and uploads, and Expect-CT information. Cross-site tracking is a major privacy concern for users. This is a necessary part of addressing the problem.
Speculation rules provides a flexible syntax for defining what outgoing links are eligible to be prefetched before navigation. It also enables additional enhancements, such as use of a private prefetch proxy, where applicable.
This feature provides a new approach to loading a large number of resources efficiently using a format that allows multiple resources to be bundled, e.g. Web Bundles.
File Handling provides a way for web applications to declare the ability to handle files with given MIME types and extensions. The web application will receive an event when the user intends to open a file with that web application.
To define a PWA as a file handler, add the file_handlers member to the Web App Manifest. You can read about its members in the spec.
file_handlers
The new inert attribute lets you mark parts of the DOM tree as inert. When a node is inert:
inert
pointer-events
'none'
user-select
For more information, see Introducing inert.
Notes: This feature actually shipped in 103 instead of 102 as originally reported.
The new Navigation interface (accessible on window) lets apps intercept and initiate navigations, and introspect an application's history entries. This provides a more useful alternative to window.history and window.location specifically aimed at the needs of single-page web applications.
Navigation
window.history
window.location
Chrome adds a new value, until-found, for the hidden attribute, which makes an element searchable by find-in-page, scroll to text fragment, and fragment navigation. When these search/navigation features want to scroll to something inside a hidden=until-found element, the browser removes the hidden attribute from the element and fires the beforematch event on it so that the newly revealed content can be scrolled into view. For more information, see Making collapsed content accessible with hidden=until-found - Chrome Developers.
until-found
hidden
hidden=until-found
beforematch
The Origin Private File System (part of the File System Access API) is augmented with a new surface that improves the performance of data access. This new surface differs from existing ones by offering in-place and exclusive write access to a file's content. This change, along with the ability to consistently read unflushed modifications and the availability of a synchronous variant on dedicated workers, significantly improves performance and unblocks new use cases.
A CORS preflight request is now sent ahead of schedule for private network requests for subresources, requesting explicit permission from the target server. If the preflight fails, a warning is displayed in DevTools but the request proceeds as before. This is not expected to be a breaking change. Websites whose servers ignore or fail the new preflight request will continue to work as before.
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.
This release contains three changes to the Secure Payment Confirmation API, specifically to the data passed to the PaymentMethod() constructor.
PaymentMethod()
data.rpId
data.instrument.iconMustBeShown
data.payeeName
data.payeeOrigin
The options object passed HID.requestDevice() now includes an exclusionFilters property. (HID is accessed via navigator.hid.) This property lets you exclude some devices from the browser picker. You can use it to exclude devices that are known to be malfunctioning. Previously, developers had to test a selected device with custom code, then ask the user to pick another if the selected device did not work. The exclusionFilters property (you will need to search for that term in the text) is an array of objects with the same members as the existing options.
HID.requestDevice()
navigator.hid
Here's an example of how to use the requestDevice() options argument. The example first requests access to a device with vendor ID 0xABCD. The device must also have a collection with usage page Consumer (0x000C) and usage ID Consumer Control (0x0001). The device with product ID 0x1234 is malfunctioning.
const [device] = await navigator.hid.requestDevice({ filters: [{ vendorId: 0xabcd, usagePage: 0x000c, usage: 0x0001 }], exclusionFilters: [{ vendorId: 0xabcd, productId: 0x1234 }], });
Sites can no longer call PaymentRequest.show() without a user activation. Allowing PaymentRequest.show() to be triggered without a user activation could be abused by malicious websites. To protect users, the spec was changed to require user activation. To avoid a broken purchase experience, calls to this method should now be inside a user event such as click.
PaymentRequest.show()
click
Firefox has not shipped PaymentRequest at all, while Safari's implementation already requires user activation for calling show().
PaymentRequest
show()
The Session Description Protocol (SDP) used to establish a session in WebRTC has been implemented with two different dialects in Chromium: Unified Plan and Plan B. Plan B is not cross-browser compatible and is hereby removed.
In this version of Chrome an exception will be thrown when Plan B is used. Developers needing to avoid the exception can participate in a deprecation trial until May 25, 2022. If you participated in the previous deprecation trial that ended in December, and want to participate in the current trial, you will need to request a new token.
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 101 is beta as of March 31, 2022. You can download the latest on Google.com for desktop or on Google Play Store on Android.
Chrome is trying to reduce the amount of information the user agent string exposes in HTTP requests as well as in navigator.userAgent, navigator.appVersion, and navigator.platform. We're doing this to prevent the user agent string from being used for passive user fingerprinting. To join the origin trial, see its entry on Chrome Origin Trials. See the end of this article for additional deprecations and removals.
navigator.userAgent
navigator.appVersion
navigator.platform
This version of Chrome introduces the origin trial 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.
Federated Credential Management API (FedCM) aims to create privacy-preserving identity federation and is designed to make identity federation continue to allow use cases without the need for cross-site tracking such as third-party cookies. This feature starts its origin trial in 101 on Android only. We expect to add desktop support in Chrome 102.
The following feature, previously in a Chrome origin trial, is now enabled by default.
Priority Hints provides a way to indicate a resource's relative importance to the browser, allowing more control over the order resources are loaded.
AudioContext.outputLatency property is an estimation in seconds of the interval between when the user agent requests a host system to play a buffer and when 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, 'processed by the audio output device' refers to the time when a sample's sound is produced. This property helps developers compensate for the latency between the input and the output. It's also useful for synchronization of video and audio streams.
AudioContext.outputLatency
This property is already implemented in Firefox.
The font-palette CSS property allows selecting a palette from a color font. In combination with the @font-palette-values at-rule, custom palettes can be defined. This feature is useful in designs where an icon or emoji font is used with dark or light mode, or when using multi-colored icon fonts that use the font-palette to harmonize with the content's color scheme.
font-palette
@font-palette-values
at-rule
HWB (short for 'hue whiteness blackness') is another method of specifying sRGB colors, similar to HSL, but often even easier for humans to work with. The hwb() function specifies HWB values in CSS. The function takes three arguments. The first, hue, specifies hue in degrees (not constrained to the range [0, 360]). The next two, whiteness and blackness, are specified as percentages.
hwb()
hue
whiteness
blackness
This feature follows a recent change to the spec for parsing the popup argument for window.open(). Previously, when popup was set equal to true, window.open() was interpreted to mean false. This is counterintuitive and confusing. This change makes boolean features easier to use and understand.
popup
window.open()
The MediaCapabilities API has been extended to support WebRTC streams. The MediaCapabilities API helps websites make informed decisions on what codec, resolution, etc. to use for video playback by indicating whether a configuration is supported and also whether the playback is expected to be smooth. Without this feature, web apps need to guess about suitable configurations. This can result in poor quality such as when an application uses low resolution or frame rates unnecessarily, or stuttering when the frame rate is too high.
The following features from version three of the Secure Payment Confirmation API are now implemented:
payeeName
The USBDevice forget() method allows web developers to voluntarily revoke a permission to a USBDevice that was granted by a user.
USBConfiguration, USBInterface, USBAlternateInterface, and USBEndpoint instances are now only strictly equal ("===") when they are retrieved from accessors on the same USBDevice.
USBConfiguration
USBInterface
USBAlternateInterface
USBEndpoint
WebSQL in third-party contexts is now removed. The Web SQL Database standard was first proposed in April 2009 and abandoned in November 2010. Gecko never implemented this feature and WebKit deprecated it in 2019. The W3C encourages Web Storage and Indexed Database for those needing alternatives.
Developers should expect that WebSQL itself will be deprecated and removed when usage is low enough.
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 100 is beta as of March 3. 2022. You can download the latest on Google.com for desktop or on Google Play Store on Android.
Chromium 100 will be the last version to support an unreduced User-Agent string by default (as well as the related navigator.userAgent, navigator.appVersion, and navigator.platform DOM APIs). The origin trial that allowed sites to test the fully reduced User-Agent will end on April 19, 2022. After that date, the User-Agent String will be gradually reduced. To review the whole schedule, see Chromium Blog: User-Agent Reduction Origin Trial and Dates. Sites that need more time to test or migrate to User-Agent Client Hints can enroll in the deprecation origin trial scheduled from Chrome 100 to 113, inclusive. In contrast to the first origin trial, which previews the fully reduced User-Agent string, the deprecation trial maintains the legacy User-Agent. The deprecation trial is expected to end in late May of 2023.
This is part of a strategy to replace use of the User-Agent string with the new User-Agent Client Hints API. To learn about User-Agent Client Hints, see Migrate to User-Agent Client Hints and Improving user privacy and developer experience with User-Agent Client Hints.
The Multi-Screen Window Placement API, now available on desktop, lets you enumerate the displays connected to your machine and to place windows on specific screens. This unlocks use cases like multi-window apps that need to accurately position certain windows. It also adds a new screen option to the Element.requestFullscreen() method which allows you to determine which screen to start a full screen view on.
screen
Element.requestFullscreen()
For more information, see Managing several displays with the Multi-Screen Window Placement API.
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.
The following origin trial is being extended to the listed version.
Chrome is continuing an origin trial for making the Media Source Extensions (MSE) API available from dedicated workers. This feature improves performance when buffering playing media in an HTMLMediaElement on the main Window. By creating a MediaSource object in a dedicated worker, an application may then create an ObjectURL for it and call postMessage() to pass that URL to the main thread for attaching to an HTMLMediaElement. The context that created the MediaSource object may then use it to buffer media. Web authors have consistently requested that MSE be available from Worker contexts. This extended origin trial is expected to end in Chrome 103, in late July 2022.
HTMLMediaElement
MediaSource
postMessage()
Chrome now provides an API for querying and managing digital products to facilitate in-app purchases from web applications. The new API works with the Payment Request API, which is used for the actual purchases. The API can be linked to a digital distribution service connected through the user agent. In Chromium, this is specifically a web API wrapper around the Android Play Billing API.
This API lets web apps in the Play Store accept purchases for digital goods. (Play policies prevent them from accepting payment via any other method.) Without this, websites that sell digital goods are not installable through the Play Store.
For more information, see Receive Payments via Google Play Billing with the Digital Goods API and the Payment Request API - Chrome Developers.
Chrome now throws an AbortSignal object's reason if the signal is aborted. This convenience method allows signal-handling functions to check a signal's abort status and propagate the abort reason. For example, it could be called after asynchronous operations that might change a signal's state.
AbortSignal
Abort signal handling functions often need to check the signal's status and propagate the error if the signal has been aborted. This provides a convenient and consistent way to do this. An example is already available on MDN.
Capability delegation means allowing a frame to relinquish its ability to call a restricted API and transfer that ability to a (sub) frame it trusts. If an app wants to delegate its ability to call a restricted JavaScript feature (for example, popups, or fullscreen) to a known and trusted third-party frame, this API allows it to transfer this ability to the target frame for a specified period. This is in contrast to static mechanisms such as an iframe's allow attributes.
Many merchant websites host their online store on their own domain but outsource the payment collection and processing infrastructure to a payment service provider (PSP) to comply with security and regulatory complexities around card payments. This workflow is implemented as a "pay" button inside the top (merchant) frame where it can blend better with the rest of the merchant's website, and payment request code inside a cross-origin iframe from the PSP. The Payment Request API used by the PSP code is gated by transient user activation (to prevent malicious attempts like unattended or repeated payment requests). Because the top (merchant) frame's user interaction is not visible to the iframe, the PSP code needs to delegate in response to a click in the top frame before it can start payment processing.
The HIDDevice forget() method allows web developers to voluntarily revoke a permission to an HIDDevice that was granted by a user. Some sites may not be interested in retaining long-term permissions to access HID devices. For example, for an educational web application used on a shared computer with many devices, a large number of accumulated user-generated permissions creates a poor user experience. In addition to user agent mitigations to avoid this problem, such as defaulting to a session scoped permission on the first request or expiring infrequently used permissions, it should be possible for the site itself to clean up user-generated permissions it no longer needs.
The mix-blend-mode property now supports the "plus-lighter" value, which adds the source and destination colors multiplied by their respective alphas. This operation is useful when crossfading between two elements that contain common pixels. In that case, "plus-lighter" ensures that the common pixels do not change in appearance as opacity changes from 0 to 1 on one element and from 1 to 0 on the other.
mix-blend-mode
"plus-lighter"
This hint serves solely as a backwards compatible shim for sites relying on "WoW64-ness" (32-bit apps running in 64-bit Windows) as they transition from the User-Agent string to UA-CH. It returns a boolean value.
When using WritableStream, serial ports can now be closed without waiting for all write operations to finish. If the port is waiting for the peer device to provide a flow control signal it could be blocked indefinitely. The intent of aborting a WritableStream is to immediately stop writing data to the underlying sink.
WritableStream
The TLS ALPN extension is now included when initiating a new connection for wss-schemed WebSockets, offering just the default "http/1.1" protocol. Currently, unlike HTTPS connections, such connections do not offer ALPN at all. Changing this aligns with Firefox and Safari, hardens against cross-protocol attacks (ALPACA, for example), and makes wss eligible for the false start optimization. It also simplifies work on the HTTPS DNS record.
WebSockets
The NDEFReader makeReadOnly() method allows web developers to make NFC tags permanently read-only with Web NFC.
NDEFReader
makeReadOnly()
In WebTransport, the serverCertificateHashes option allows a website to connect to a web transport server by authenticating the certificate against the expected certificate hash instead of using the Web public key infrastructure (PKI).
WebTransport
serverCertificateHashes
This feature allows Web developers to connect to WebTransport servers that would normally find obtaining a publicly trusted certificate challenging, such as hosts that are not publically routable, or virtual machines that are ephemeral in nature.
This version of Chrome has only one deprecation, described at the top of this article. Visit ChromeStatus.com for lists of ongoing deprecations and previous removals.
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 99 is beta as of February 3, 2022. You can download the latest on Google.com for desktop or on Google Play Store on Android.
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 since Chrome 96. For more information, see Force Chrome major version to 100 in the User-Agent string.
CSS cascade layers (@layer rule and layered @import syntax) provide a structured way to organize and balance concerns within a single origin. Rules within a single cascade layer cascade together without interleaving with style rules outside the layer. This allows authors to achieve a certain cascade ordering for same-origin rules in a proper way.
@layer
@import
Cascade layers allow authors to create layers to represent element defaults, third-party libraries, themes, components, overrides, etc.—and are able to re-order the cascade of layers in an explicit way. Without cascade layers, authors need to tweak, e.g., selector specificity, @import or source ordering to achieve a certain cascade ordering, which is cumbersome and error-prone.
For more information, see Cascade layers are coming to your browser.
The new showPicker() method on HTMLInputElement allows web developers to programmatically show a browser picker for input elements (temporal, color, file, and those with suggestions like datalist or autofill).
showPicker()
HTMLInputElement
Developers have been asking for years for a way to programmatically open a browser date picker. Without it, they've had to rely on custom widget libraries and CSS hacks for specific browsers.
This is currently possible in some browsers, for some controls, via the click() method. Unfortunately, that doesn't work in all browsers, making the experience inconsistent across systems and users. Providing showPicker() gives developers a supported alternative to click(), and aligns Chromium's click() behavior with the specification and other browsers in in the future. For more information, see Show a browser picker for date, time, color, and files.
click()
Web app manifests now support the color_scheme_dark field for specifying a different theme color and background color for dark mode. Currently in the web app manifest, only a single theme color and background color can be defined. This means there is no way for apps to specify a different color to use for dark mode.
This API lets web applications use handwriting recognition services that are available on operating systems to recognize hand-written text in real time. This reduces the need for third-party integration by apps that use handwriting recognition. For more information, see Recognize your users' handwriting.
Window controls overlay extends an app's client area to cover the entire window, including the title bar, and the window control buttons (close, maximize/restore, minimize). The web app 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 operating system apps. For more information, see Customize the window controls overlay of your PWA's title bar.
To improve conformance with the spec, the CSS calc() method now allows infinity and NaN using the 'infinity', '-infinity', and 'NaN' keywords or expressions that can be evaluated as such, for example: 'calc(1/0)'.
calc()
'infinity'
'-infinity'
'NaN'
Note: This feature was erroneously listed as shipping in Chrome 98. It actually shipped in Chrome 99.
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.
color-scheme
div { color-scheme: light }
This forces the div element out of color-scheme dark.
div
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.
In compliance with the spec, the document.adoptedStyleSheets property is now mutable, meaning operations such as push() and pop() 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
push()
pop()
adoptedStyleSheets
document.adoptedStyleSheets = [...adoptedStyleSheets, newSheet];
With the new implementation, the same operation looks like this:
document.adoptedStyleSheets.push(newSheet);
Note: Previously, this feature was incorrectly listed as shipping in Chrome 98.
The PerformanceResourceTiming interface exposes the nextHopProtocol property to describe the underlying connection type used to fetch a resource. To follow the spec, Chrome is removing an old special case where cross-origin requests exposed potentially sensitive information, putting users at risk.
PerformanceResourceTiming
nextHopProtocol
Chrome has added several new attributes to the CanvasRenderingContext2D interface to conform to specs:
CanvasRenderingContext2D
ContextLost
ContextRestored
"willReadFrequently"
roundRect
For more information, see It's always been you Canvas2D.
Chrome 99 introduces unprefixed versions of text emphasis CSS properties, specifically: "text-emphasis", "text-emphasis-color", "text-emphasis-position", and "text-emphasis-style" CSS properties. These are unprefixed versions of "-webkit-text-emphasis", "-webkit-text-emphasis-color", "-webkit-text-emphasis-position", and "-webkit-text-emphasis-style".
"text-emphasis"
"text-emphasis-color"
"text-emphasis-position"
"text-emphasis-style"
"-webkit-text-emphasis"
"-webkit-text-emphasis-color"
"-webkit-text-emphasis-position"
"-webkit-text-emphasis-style"
Battery Status API is no longer supported on insecure origins, such as HTTP pages or HTTPS iframes embedded in HTTP pages. The Battery Status API allows web developers to access, among other things, a system's battery charging level and whether it is being charged. It is a powerful feature that has been around for over a decade and, as such, was originally designed with different security constraints.
This version of Chrome removes support for the font-family value "-webkit-standard". This value is merely an alias for the proprietary keyword "-webkit-body" and is only exposed because it's inherited from WebKit. Removing this improves alignment with the CSS specifications and with Firefox.
font-family
"-webkit-standard"
"-webkit-body"
The navigator.getGamepads() method now returns an array of Gamepad objects instead of a GamepadList. GamepadList is no longer supported in Chrome. This brings Chrome in line with spec and with Gecko and Webkit. For information on Gamepads generally, see Play the Chrome dino game with your gamepad.
navigator.getGamepads()
Gamepad
GamepadList
Chrome has removed two items because of recent changes in the WebCodecs spec..The EncodedVideoChunkOutputCallback() method takes an EncodedVideoChunkMetadata dictionary. Previously a member called temporalLayerId was located at EncodedVideoChunkMetadata.temporalLayerId. In conformance with the spec, it is now located at EncodedVideoChunkMetadata.SvcOutputMetadata.temporalLayerId.The spec requires that the VideoFrame() constructor include a timestamp argument (VideoFrameInit.timestamp) for CanvasImageSource types that don't implicitly have a timestamp (e.g. HTMLCanvasElement). Failing to include the timestamp should result in a TypeError, but Chrome previously defaulted the timestamp to zero. This seems helpful, but is problematic if you then send the VideoFrame to a VideoEncoder, where timestamps are used to guide bitrate control.
EncodedVideoChunkOutputCallback()
EncodedVideoChunkMetadata
EncodedVideoChunkMetadata.temporalLayerId
EncodedVideoChunkMetadata.SvcOutputMetadata.temporalLayerId
VideoFrame()
VideoFrameInit.timestamp
CanvasImageSource
HTMLCanvasElement
TypeError
VideoFrame
VideoEncoder
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.
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).
For more information, see COLRv1 Color Gradient Vector Fonts in Chrome 98.
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.
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).
getDisplayMedia()
preferCurrentTab
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.
contain-intrinsic-size
content-visibility: auto
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.
only
This forces the div element out of color-scheme dark. div { color-scheme: only light }
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:
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().
'dynamic-range'
'video-dynamic-range'
'standard'
'high'
Window.matchMedia()
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.
const popup = window.open('_blank','','popup=1'); const tab = window.open('_blank','','popup=0');
window.statusbar.visible
false
true
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.
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.
structuredClone()
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.
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.
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.
WritableStreamDefaultController
writer.abort()
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.
