What’s new in Chromium 54 and Opera 41

Opera 41 (based on Chromium 54) for Mac, Windows, Linux is out! To find out what’s new for users, see our Desktop blog. Here’s what it means for web developers.

Web Components: Custom Elements v1

Custom elements form the foundation of web components. The initial version of the API, also known as Custom Elements v0, has been supported since Opera 20 & Chrome 33. With the v0 API, a new custom element was defined using document.registerElement().

Since then, the spec has been updated based on web developer and browser vendor feedback. The improved API is called Custom Elements v1. The new hip & trendy way of defining a custom element is through customElements.define(). The v0 API is now deprecated and will be removed in a future release.

For more details, check out Eric Bidelman’s custom elements guide.

DOM convenience methods on ParentNode & ChildNode

We now support the following convenience methods on ParentNode and ChildNode for working with DOM trees:

  • ParentNode.prototype.prepend()
  • ParentNode.prototype.append()
  • ChildNode.prototype.before()
  • ChildNode.prototype.after()
  • ChildNode.prototype.replaceWith()

CanvasRenderingContext2D.prototype.imageSmoothingQuality

CanvasRenderingContext2D.prototype.imageSmoothingQuality allows developers to balance performance and image quality by adjusting resolution when scaling.

const canvas = document.querySelector('canvas');
const context = canvas.getContext('2d');
const image = new Image();
image.src = 'image.png';
image.onload = function() {
	context.imageSmoothingEnabled = true;
	context.imageSmoothingQuality = 'high'; // or 'low', or 'medium'
	context.drawImage(image, 0, 0, 320, 180);
};

BroadcastChannel API

The BroadcastChannel API allows same-origin scripts to send messages to other browsing contexts. It can be thought of as a simple message bus that allows publish-subscribe semantics between windows, tabs, iframes, web workers, and service workers. Think of it as a simpler, same-origin version of the good ol’ postMessage() API.

For more information, check out this article.

Cache Storage API: CacheQueryOptions

The full set of CacheQueryOptions is now supported, making it easier to find the cached responses you’re looking for. Here’s the complete list of available options:

  • ignoreSearch
  • ignoreMethod
  • ignoreVary
  • cacheName

See Jeff Posnick’s excellent article for more information.

CSS text-size-adjust

The text-size-adjust property lets web developers control and disable the text autosizing feature which increases font sizes on mobile.

Unprefixed CSS user-select

You can now use user-select instead of -webkit-user-select in CSS. The user-select property makes it possible to specify which elements in the document can be selected by the user and how.

Navigations initiated in an unload handler are now blocked. Instead, any prior navigation will continue. This matches the behavior in Firefox, and matches Edge’s behavior more closely than before.

Node.prototype.getRootNode

Sites can use Node.prototype.getRootNode(options) to obtain the root for a given node.

Experimenting with post-quantum crypto for TLS

CECPQ1 is a post-quantum cipher suite: one that is designed to provide confidentiality even against an attacker who possesses a large quantum computer. It is a key-agreement algorithm plugged into TLS that combines X25519 and NewHope, a ring-learning-with-errors primitive. Even if NewHope turns out to be breakable, the X25519 key-agreement will ensure that it provides at least the security of our existing connections.

Note that this is only an experiment. In fact, the plan is to discontinue this experiment within two years, hopefully by replacing it with something better. See “Experimenting with post-quantum cryptography” for more details.

Deprecated and removed features

URL.createObjectURL and URL.revokeObjectURL are now deprecated in service worker contexts.

The MediaStream API dropped MediaStream.prototype.ended a long time ago. Its usage has been deprecated since Opera 32 & Chromium 45. As of this release, the ended event is no longer supported.

Similarly, the File API spec once removed the FileError interface. It has been deprecated since 2013. Any usage of FileError triggered a warning in the DevTools console since Opera 40 & Chromium 53. As of this release, FileError is no longer supported.

Support for the non-standard TouchEvent.prototype.initTouchEvent has been removed, after being deprecated since Opera 36 & Chromium 49. Use the Touch and TouchEvent constructors instead.

To more closely match other browser’s behavior, window.external.IsSearchProviderInstalled and window.external.AddSearchProvider (originally intended to add search engines programmatically) are now both no-ops. This functionality was never implemented in Safari. In IE10, these methods are (mostly) no-ops: IsSearchProviderInstalled always returns 2, and AddSearchProvider always returns S_OK. Firefox still implements this, but notes that it may be removed at any time.

KeyboardEvent.prototype.keyIdentifier has been removed. Use KeyboardEvent.prototype.key (or its polyfill) instead.

What’s next?

If you’re interested in experimenting with features that are in the pipeline for future versions of Opera, we recommend following our Opera Developer stream.