Menu

Chrome 78 Beta: a new Houdini API, native file system access and more

September 20th, 2019

Unless otherwise noted, changes described below apply to the newest Chrome Beta channel release for Android, Chrome OS, Linux, macOS, and Windows. Find more information about the features listed here through the provided links or from the list on ChromeStatus.com. Chrome 78 is beta as of September 19, 2019.

CSS Properties and Values

CSS variables are getting more power with CSS Properties and Values API Level 1. With it, you can register your variables as full custom properties, ensuring they’re always a specific type, and letting you set a default value, or even, animate them.

Take the image below, for example.

Chrome 78 Beta: a new Houdini API, native file system access and more

What you’re seeing is a transition created with a CSS custom property. In addition to being impossible without the new API, this transition is also type-safe. For details and access to the code used to generate this image, see Smarter custom properties with Houdini’s new API.

Native File System

The new Native File System API, now in an origin trial, enables developers to build powerful web apps that interact with files on the user’s local device such as IDEs, photo and video editors, text editors, and more. After a user grants access, this API allows web apps to read or save changes directly to files and folders on the user’s device. It does all this by invoking the platform’s own open and save dialog boxes. The image below shows a web page invoked using the open dialog box on Mac.

Chrome 78 Beta: a new Houdini API, native file system access and more

To learn more, see sample code, and a text editor demonstration app, see The Native File System API: Simplifying access to local files for details.

See the Origin Trials section for information on signing up and for a list of other origin trials in this release.

Origin Trials

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 original trials currently supported in Chrome, including those described here, visit the Origin Trials dashboard. To learn more about origin trials themselves, visit the Origin Trials Guide for Web Developers.

SMS Receiver API

Websites use SMS messages as a way to verify phone numbers by sending a one-time-password for manual entry into a form (or for copy and paste). Native platforms offer an API that gives programmatic access to such messages that allows users to skip manual interaction with the form.
The SMS Receiver API allows websites to access SMS messages that are delivered to the user’s phone specifically addressed to the origin (via a special formatting convention).

Other features in this release

Apply opacity for the default style of INPUT/TEXTAREA placeholder

Chrome 78 adds support for maskable icons, allowing web developers to specify a full-bleed icon by adding "purpose": "maskable" to the icon object. We recommend using a 108dp icon for your maskable icon. Check out Maskable Icons: Android Adaptive Icons for Your PWA on CSS Tricks for details.

Apply opacity for the default style of INPUT/TEXTAREA placeholder

Changes the default style for ::placeholder from #757575 to rgba(0, 0, 0, 0.54).

Don’t allow popups during page unload

Pages may no longer use the window.open() method to open a new page during its unload. The popup blocker already prohibits this, but now it is prohibited whether or not the popup blocker is enabled. For now, enterprises can use the AllowPopupsDuringPageUnload policy flag to allow popups during unload. We expect to remove this flag in Chrome 82.

Extend byte-for-byte update check to all service worker importScripts() resources

Byte-for-byte checks are now available for service worker scripts imported by importScripts(). Currently, service workers update only when the service worker main script has changed. In addition to not conforming to the latest spec, this forces developers to build workarounds such as adding hashes to the imported script’s urls.

Faster Web Sockets

Chrome 78 improves the download speed of ArrayBuffer objects when used with WebSocket objects on desktop. We have seen the following improvements in our own testing. Results depend on network speed and hardware so your results may be vary.

  • Linux: 7.5 times faster
  • Windows: 4.1 times faster
  • Mac: 7.8 times faster

More restrictive hasEnrolledInstrument() for autofill instruments

Improves the authorization of transactions by requiring unexpired cards and a billing address. This improves the quality of autofill data and increases the chances that PaymentRequest.hasEnrolledInstrument() returns true. This improves the user experience on transactions that use autofill data.

PaymentResponse.prototype.retry()

In cases where there is something wrong with the payment response’s data (for example, the shipping address is a PO box), the retry() method of a PaymentResponse instance now allows you to ask a user to retry a payment.

Percentage opacity

Adds support for percentage values to the opacity properties, specifically, opacity, stop-opacity, fill-opacity, stroke-opacity, and shape-image-threshold. For example, opacity: 50% is equivalent to opacity: 0.5. This brings consistency and spec compliance. The rgba() function already accepts percentage alpha value, for example rgba(0, 255, 0, 50%).

Redact address in PaymentRequest.onshippingaddresschange event

Removes fine-grained information from the shipping address before exposing it to a merchant website in the ShippingAddressChange event. PaymentRequest.onshippingaddresschange is used to communicate the shipping address a user has selected to the merchant so they can make adjustments to the payment amounts such as shipping cost and tax. At this point, the user has not fully committed to the transaction, so the principle should be to return as little information as possible to the merchant. The redaction removes recipient, organization, addressLine and phoneNumber from the shipping address because these are not typically needed for shipping cost and tax computation.

Seeking

Adds a media session action handler for the seekto action. An action handler is an event tied specifically to a common media function such as pause or play. The seekto action handler is called when the site should move the playback time to a specific time.

User Timing L3

Extends the existing User Timing API to enable two new use cases:

  • Developers can pass custom timestamps to performance.measure() and performance.mark(), so as to conduct measurement across arbitrary timestamps.
  • Developers can report arbitrary metadata with performance.mark() and performance.measure(), which provides rich data to analytics via a standardized API.

Deprecations, and Removals

Disallow sync XHR in page dismissal

Chrome now disallows synchronous XHR during page dismissal when the page is being navigated away from or is closed by the user. This applies to the following events:

  • beforeunload
  • unload
  • pagehide
  • visibilitychange

To ensure that data is sent to the server when a page unloads, we recommend sendBeacon() or Fetch keep-alive.

For now, enterprise users can use the AllowSyncXHRInPageDismissal policy flag and developers can use the origin trial flag allow-sync-xhr-in-page-dismissal to allow synchronous XHR requests during page unload. This is a temporary “opt-out” measure, and we expect to remove this flag in Chrome 82.

XSS Auditor

XSS Auditor has been removed from Chrome. The XSS Auditor can introduce cross-site information leaks and mechanisms to bypass the Auditor are widely known.