[go: up one dir, main page]

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 77 is beta as of August 8, 2019.

New Performance Metrics

Largest Contentful Paint

It has not always been easy for developers to measure how quickly the main content of a web page loads and is visible to users. The usefulness of existing metrics varies. Some metrics are only measurable in a lab, while others tell nothing about content that users care about. Consider the example below, taken from a DevTools performance audit. At the time of the first contentful paint, there's no content on screen that a user can interact with.



Largest Contentful Paint attempts to provide more meaningful data by using the largest content element as a proxy for when the main content of the page is likely visible to users.

You're probably asking questions like what does the new metric track? When is the metric reported? How do I improve it if it's slow? For answers to these and other questions, see "Largest Contentful Paint" on web.dev.

First Input Timing

The PerformanceEventTiming interface provides timing information about the latency of the first discrete user interaction, specifically one of key down, mouse down, click, or the combination of pointer down and pointer up. Pointer down may be the start of scrolling, which is not tracked. This is a subset of the EventTiming API, but will be exposed in advance because it provides key metrics to help measure and optimize responsiveness.

New Form Capabilities

Many websites use custom form controls to either add features that aren't available in standard controls or to tailor a form's design. A drawback of custom controls is that data must be stored in hidden <input> elements.

Two new features support custom form controls. The formdata event lets sites use JavaScript instead of hidden <input> elements to add data to a form. With this feature, site builders add a formdata event listener to a form element. The passed event includes a FormData object containing the data being submitted, which can now be modified.

The formdata event only lets sites interact with the submission process. Form-associated custom elements let site creators build custom elements that act like built-in form controls, providing capabilities such as enabling input validation or submitting data to the server.

To learn more and to see example code, read More capable form controls on web.dev.

Origin Trials

This version of Chrome introduces the origin trials listed 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 listed below, visit the Origin Trials dashboard. To learn more about origin trials themselves, visit the Origin Trials Guide for Web Developers.

A Contact Picker for the Web

The Contact Picker API is a new, on-demand picker that allows users to select entries from their contact list and share limited details of the selected entries with a website. It allows users to share only what they want, when they want, and makes it easier for users to reach and connect with their friends and family. See A Contact Picker for the Web for details.

Other features in this release

Enter Key Hint

The enterkeyhint content attribute
is an enumerated attribute for <form> elements that specifies what action label (or icon) to present as the enter key on virtual keyboards. This allows authors to customize the presentation of the enter key to make it more helpful for users. The attribute takes one of enter, done, go, next, previous, search, or send.

Feature Policy Control over Document.domain

The document-domain policy governs access to document.domain. It is enabled by default, and, if disabled, attempting to set document.domain will throw an error.

Layout Instability Monitoring

Adds the LayoutShift interface
to the Performance API, allowing developers to monitor changes to a DOM element's on-screen position.

Limit the "referer" Header's Length to 4kB

Strips the referer header down to an origin when it's size exceeds 4kB.
Servers will often behave in unexpected ways when presented with an overly-long referer header. This is unfortunate, because referer is one header whose length attackers generally retain control over when generating no-cors requests.

Limit registerProtocolHandler() url Argument to http/https

The registerProtocolHandler() now only accepts URLs with http or https schemas. Because the intent of the API is to allow an endpoint to handle something like an SMS message, for example, it doesn't make much sense for handlers to be data URLs, blob URLs, and so on.

New Features for Intl.NumberFormat

This change improves Intl.NumberFormat by adding support for measurement units, currency and sign display policies, and scientific and compact notation.

Overscroll Behavior Logical Longhands

Adds CSS flow-relative properties for controlling overscroll behavior through logical dimensions. flow-relative properties are those that are interpreted relative to the flow of content. The new properties are overscroll-behavior-inline and overscroll-behavior-block.

PerformanceObserverInit Buffered Flag

Adds a buffered flag to observer.observe() so that PerformanceObserver can receive entries created before the call is executed.

WebRTC

RTCPeerConnection.onicecandidateerror
Adds the incecandidateerror event which provides detailed information about WebRTC ICE candidate gathering failures, including the ones defined by STUN (RFC5389) and TURN (RFC5766).

Diagnosing ICE connectivity issues without access to detailed gathering failures can be a challenge. Support for ICE candidate errors is targeted towards better connectivity troubleshooting and network diagnostics.

RTCPeerConnection.restartIce()
Adds a method for triggering an ICE restart which causes a WebRTC connection to try to reconnect. This feature is already available in Chrome by passing the iceRestart argument to createOffer(). restartIce() is a version of this method that works regardless of signalingState.

Service Workers

Preserve Request Priorities through Service Worker
Preserves a request's original priority when it passes through a service worker. Previously, all requests going through a service worker would get "High" priority. This means render-blocking style sheets would have their priority clamped, while less important resources would get boosted.

Service Workers Support Basic HTTP Authentication
Displays HTTP authentication dialog boxes even if the request was from a service worker. This shows the native login dialog shown when an HTTP 401 response is received.

Stop Action for Media Sessions

Adds stop as a MediaSessionAction for calls to MediaSession.setActionHandler(). An action is an event tied specifically to a common media function such as pause or play. The stop action handler is called when the site should stop the playback and clear the state if appropriate. Samples are available on GitHub.

Web Payments: Throw a TypeError on Invalid "basic-card" Data

The PaymentRequest constructor now throws a TypeError when invalid supportedNetworks or supportedTypes are specified for basic card payment.

See Deprecations and Removals for an additional Web Payments update item. For more about recent web payments updates, see W3C Payment API changes in Chrome 77.

Interoperability Improvements

Support Step Timing Functions jump-start|end|both|none

Adds support for a richer set of step animations. Firefox already supports jump-* step timing functions. The step timing functions jump-both, jump-none, jump-start and jump-end were introduced to the spec for easing functions in 2018. Two of these, jump-start and jump-end are aliases for start and end. The remaining two provide increased flexibility for step transitions by enabling step functions in which both or neither endpoint has a discontinuous step. Previously, one and only one of the two endpoints could have a step discontinuity. Adding support in Chromium improves cross-browser interoperability.

white-space: break-spaces

Adds the break-spaces value for the white-space property which specifies that any sequence of preserved white space that would otherwise overflow a line and hang (as per the CSS Text Module spec's Trimming and Positioning rules) must be broken.

With white-space: pre-wrap it's possible to wrap and preserve white space sequences in the middle of a text line. However, if there is a sequence at the end of the line, it either collapses or hangs, maybe overflowing its box area. The new value overflow-wrap: break-spaces allows authors to wrap and preserve these white space sequences. This can be also useful for textarea or contenteditable elements, so that white space sequences added by spacebar press events are handled properly and generate line breaks if needed. Finally, there is an ongoing effort to enhance interoperability of the line breaking CSS properties (white-space, word-break and overflow-wrap) and this new value was defined precisely to achieve that.

Deprecations, and Removals

Card Issuer Networks as Payment Method Names

Remotes support for calling PaymentRequest with card issuer networks (e.g., "visa", "amex", "mastercard") in the supportedMethods field.

Deprecate Web MIDI Use on Insecure Origins

Web MIDI use is classified into two groups: non-privilege use, and privilege use with sysex permission. Until Chrome 77, only the latter use prompts users for permission. To reduce security concerns, permissions will always be requested regardless of sysex use. This means that using Web MIDI on insecure origins will no longer be allowed.

Deprecate WebVR 1.1 API

This API is now deprecated in Chrome, being replaced by the WebXR Device API, which is expected to ship in Chrome 78. The WebVR Origin Trial ended on July 24, 2018.

WebVR was never enabled by default in Chrome, and was never ratified as a web standard. The WebXR Device API is the replacement API for WebVR. Removing WebVR from Chrome allows us to focus on the future of WebXR and remove the maintenance burden of WebVR, as well as reaffirm that Chrome is committed to WebXR as the future for building immersive web-based experiences. Removal is expected in Chrome 79.

Unless otherwise noted, changes described below apply to the newest Chrome Beta channel release for Android, Chrome OS, Linux, macOS, and Windows. View a complete list of the features in Chrome 70 on ChromeStatus.com. Chrome 70 is beta as of September 13, 2018.

Shape Detection Origin Trial

The Shape Detection API makes a device's shape detection capabilities available on the web, letting you identify faces, barcodes, and text in images. It does this without the use of a performance-killing library. As Chrome 70, this API is available for experimentation through a Chrome origin trial.

The Shape Detection API consists of three APIs: A Face Detection API, a Barcode Detection API and a Text Detection API. Given an image bitmap or a blob, the Face Detection API returns the location of faces and the locations of eyes, noses, and mouths within those faces. To give you rudimentary control of performance, you can limit the number of returned faces and prioritize speed over performance. The Barcode Detection API decodes barcodes and QR codes into strings. (There is a QR code demo at https://qrsnapper.com/) The value can be anything from a single set of digits to multi-line text. The Text Detection API reads Latin-1 text (as defined in iso8859-1) in images. All of these APIs only expose what's supported in the underlying device.

A short example will give you a taste of these APIs, all of which work in a similar fashion. The code below finds all barcodes or QR codes in a given image and prints their values to the console.


const image = document.getElementById('someImage');
try {
  const barcodeDetector = new BarcodeDetector();
  const barcodes = await barcodeDetector.detect(image);
  barcodes.forEach(barcode => console.log(barcodes.rawValue));
} catch (exception) {
  console.error('Boo! Barcode detection failed:', exception);
}

Web Authentication

Chrome 70 has two updates to the Web Authentication API related to the PublicKeyCredential type.

The Credential Management API, enabled in Chrome 51, defined a framework for handling credentials that included semantics for creating, getting, and storing them. It did this through two credential types: PasswordCredential and FederatedCredential. The Web Authentication API adds a third credential type, PublicKeyCredential, which allows web applications to create and use strong, cryptographically attested, and application-scoped credentials to strongly authenticate users. The PublicKeyCredential type was enabled by default on desktop in Chrome 67. In Chrome 70 it is also enabled by default on Android.

Also enabled by default are macOS's TouchID and Android's fingerprint sensor via Web Authentication. These allow developers to access biometric authenticators through the Credential Management API's PublicKeyCredential type.

A Web Authentication verification screen

Other Features in this Release

Displaying a dialog causes pages to lose fullscreen

Dialog boxes, specifically authentication prompts, payments, and file pickers require context for users to make decisions. Fullscreen, by definition is immersive, and removes the context that a user needs to make a decision. Chrome now exits full screen whenever a page shows a dialog box.

HTML

Add referrerpolicy support to <script> elements

Many resource-fetching elements have support for the referrerpolicy attribute, which lets developers provide a keyword to influence the value of the Referer HTTP header that accompanies a request. The <link> element already has support for this, so it is technically possible to preload a script with a developer-set referrer policy. Starting in this version of Chrome, the <script> element supports the referrerpolicy as well.

The <rp> element defaults to display:none

The default style of the <rp> element is changed to display:none instead of display:inline even if it is not inside the <ruby> element as defined in the HTML specification. This behavior is implemented in the user agent stylesheet, but the web author can override it.

Intervention Reports

An intervention is when a user agent does not honor an application request for security, performance, or annoyance reasons. With this change, Chrome can be configured to send intervention and deprecation messages to your servers using the Report-To HTTP Response header field and surface them in the ReportingObserver interface. This is the first of several proposed uses for the Report-To header. Follow these links to learn more about the header and the interface.

Media

Support codec and container switching with MSE using SourceBuffer.changeType()

This change adds the SourceBuffer.changeType() method to improve cross-codec or cross-bytestream transitions during playback with Media Source Extensions.

Support Opus in mp4 with Media Source Extensions

Opus is an audio codec already supported by the HTML5 src attribute on <url> elements. It is now supported by Media Source Extensions.

'name' attribute for dedicated workers

Dedicated workers now have a name attribute, which is specified by an optional argument on the worker's constructor. This lets you distinguish dedicated workers by name when you have multiple workers with the same URL. Developers can print name in the DevTools console which will make it easier to debug workers. When the name parameter is omitted, an empty string is used as the default value. For more information, see the discussion on GitHub.

ontouch* APIs default to disabled on desktop

To avoid confusion on touch feature detection, ontouch* members on window, document, and element are disabled by default on desktop (Mac, Windows, Linux, ChromeOS). Note that this is not disabling touches, and usage such as addEventListener("touchstart", ...) is not affected.

Options dictionary for postMessage methods

An optional PostMessageOptions object has been added as an argument to postMessage() for 6 of the 7 interfaces where it's supported, specifically, DedicatedWorkerGlobalScope, MessagePort, ServiceWorker, ServiceWorker.Client, Window, and Worker. This gives the function a similar interface on its definitions and allows it to be extended in the future. Because broadcastChannel.postMessage() doesn't take additional arguments (such as transfer) it is not being changed.

Rename Atomics.wake() to Atomics.notify()

The Atomics.wake() method is being renamed Atomics.notify(). This is a low-level function to wake a Worker that has been suspended via Atomics.wait(). This conforms to a specification change made to alleviate confusion created by the similarity of the names wait and wake.

RTCPeerConnection.getConfiguration()

This  getConfiguration() was implemented according to the WebRTC 1.0. Specifically it returns the last configuration applied via setConfiguration(), or if setConfiguration() hasn't been called, the configuration the RTCPeerConnection was constructed with.

Symbol.prototype.description

A description property is being added to Symbol.prototype to provide a more ergonomic way of accessing the description of a Symbol. Previously, the description could only be accessed indirectly through Symbol.protoype.toString().

TLS 1.3

TLS 1.3 is an overhaul of the TLS protocol with a simpler, less error-prone design that improves both efficiency and security. The new design reduces the number of round-trips required to establish a connection and removes legacy insecure options, making it easier to securely configure a server. It additionally encrypts more of the handshake and makes the resumption mode more resilient to key compromise.

Update behavior of CSS Grid Layout percentage row tracks and gutters

Percentage row tracks and gutters in grid containers now have indefinite heights. Previously, these were behaving similarly to percentage heights in regular blocks, but the CSS Working Group has resolved to make them behave the same as for columns, making them symmetric. Percentages are now ignored when computing intrinsic height and resolved afterwards against that height. That way both column and row axes will have symmetric behavior to resolve percentages tracks and gutters.

Web Bluetooth available on Windows 10

Web Bluetooth allows websites to communicate over GATT with nearby user-selected Bluetooth devices in a secure and privacy-preserving way. In Chrome 56, this shipped on Android, ChromeOS, and macOS. In Chrome 70 it is shipping on Windows 10. For earlier versions of Windows and Linux, it is still behind a flag (chrome://flags/#enable-experimental-web-platform-features).

WebUSB on Dedicated Workers

WebUSB is enabled inside dedicated workers. This allows developers to perform heavy I/O and processing of data from a USB device on a separate thread to reduce the performance impact on the main thread.

Deprecations and Interoperability Improvements

Chrome sometimes deprecates, removes, or changes features to increase interoperability with other browsers. This version of Chrome includes the following such changes.

Remove AppCache from insecure contexts.

AppCache is now removed from insecure contexts. AppCache is a powerful feature that allows offline and persistent access to an origin, which is a powerful privilege escalation for cross-site scripting. This removes that attack vector by only allowing it only over HTTPS. Developers looking for an alternative to AppCache are encouraged to use service workers. An experimental library is available to ease that transition.

Remove anonymous getter for HTMLFrameSetElement

The anonymous getter for HTMLFrameSetElement is non-standard and therefore removed.

Deprecate and remove Gamepads.item()

The legacy item() accessor is removed from the Gamepads array. This change improves compatibility with Firefox which is so far the only browser to implement GamepadList.

Deprecate Custom Elements v0

Custom Elements are a web components technology that lets you create new HTML tags, beef up existing tags, or extend components authored by other developers. Custom Elements v1 have been implemented in Chrome since version 54, which shipped in October 2016. Custom Elements v0 is now deprecated with removal expected in Chrome 73, around March 2019.

Deprecate HTML Imports

HTML Imports, which allow HTML to be imported from one document to another, are now deprecated. Removal is expected in Chrome 73, around March 2019. Sites depending on HTML imports already require a polyfill on non-Chromium browsers. When HTML imports is removed, sites that have the polyfill should continue to work on Chrome.

Deprecate Shadow DOM v0

Shadow DOM is a web components technology that uses scoped subtrees inside elements. Shadow DOM v1 has been implemented in Chrome since version 53, which shipped in August of 2016. Shadow DOM v0 is now deprecated with removal expected in Chrome 73, around March 2019. Sites depending on HTML imports already require a polyfill on non-Chromium browsers. When Shadow DOM v0 is removed, sites that have the polyfill should continue to work on Chrome.

Deprecate SpeechSynthesis.speak() without user activation

The speechSynthesis.speak() function now throws an error if the document has not received a user activation. This API is being abused by sites since it is one of the only remaining APIs which does not adhere to autoplay policies in Chrome.