Today we're happy to announce that we just installed the new Chrome 62 on Browserling's browser testing platform. Chrome 62 was released just an hour ago.

Google Chrome Version 62

You can try it yourself right here, right now throughout this embedded widget:

What's new in Chrome 62?

  • Support for OpenType variable fonts.
  • Network Information API updated to report users actual Internet speed, not just connection type, to websites.
  • HTTP sites that request user data will now be flagged as "non-secure" (red) in the Chrome Omnibox.
  • The "Save Your Password" icon gets a new appearance.
  • A number of fixes and improvements.

For iOS:

  • Two new Today widgets are added by tapping the Edit button at the bottom of the iOS Search screen.
  • Ability to drag a URL from another app and drop it into Chrome's omnibox or the tab strip, or from Chrome's content area to another app on iOS 11 iPads.
  • The Payment Request API has been introduced.

For Android:

  • Download files faster with accelerated downloads.
  • View and copy passwords saved with Chrome if device lock is enabled.
  • Quickly see your data savings in the Chrome menu when Data Saver is on.

Network Quality Indicator

The little Network Information API has been there for quite a while right? You might have noticed that it only provides theoretical network speeds given the user's connection. For instance if you connect to a mobile hotspot that only has 2G speeds, the API would recognize it as WiFi. Now good.

console.log(navigator.connection.type);
> wifi

As of Chrome 62, the same API has been expanded to provide actual network performance metrics from the client. Based on these metrics you can now serve a reduced version for very slow connections like mobile 2G. It returns the measured network performance based on how it would compare to a cellular connection. If you connect to a fast fiber connection, the API would report 4G.

console.log(navigator.connection.effectiveType);
> 4G

OpenType Variable Fonts

Traditionally, one font contained only a single instance of a font family, for example one weight or one stretch. If you wanted regular, bold and italic, you’d need to include three separate fonts, increasing the weight of your page.

By adjusting the font-variation-settings CSS property, stretch, style, weight, etc, can easily be adjusted, providing an infinite number of stylistic combinations with the OpenType variable font, which is the equivalent of multiple individual fonts that can be compactly packed together.

.heading
{
  font-family: "Avenir Next Variable";
  font-size: 48px;
  font-variation-settings: 'wght' 700, 'wdth' 75;
}
.content
{
  font-family: "Avenir Next Variable";
  font-size: 24px;
  font-variation-settings: 'wght' 400;
}

OpenType variable fonts gives us a powerful new tool to create responsive typography, and reduce our page weight.

Media capture from DOM elements

You can now live-capture content into a MediaStream directly from HTMLMediaElements like audio and video, with the Media Capture from DOM Elements API. captureStream() can be invoked on an HTML media content and then the streamed content manipulate, processed, sent remotely or recorded. The possibilities here are endless. You can for example use web audio to create your own vocoder or equalizer.

Not Secure labels for some HTTP pages

When a user enters data on some HTTP page, now Chrome can mark the page as "Not Secure" with a label in the left part of the address bar. That label can also seen in Incognito mode for all HTTP pages.

Developer features and updates in Chrome 62

  • < data > element
  • < time > element
  • API for customizing HTMLMediaElement.seekable for Media Source live streams - This API lets MediaSource apps more effectively customize the HTMLMediaElement.seekable range logic by providing (or removing) a single seekable range that is union'ed with the current buffered ranges to result in a single seekable range which fits both, when media duration is infinite.
  • Accept 8 (#RRGGBBAA) and 4 (#RGBA) value hex colors - Update the CSS color parser to support 8/4-digit hex color. Legacy HTML attribute color parsing, per the "rules for parsing a legacy colour value" of the HTML micro syntax (http://bit.ly/1WF2Yre), will not be changed (see http://bit.ly/1UEDbiO), nor will the CSS hashless color quirk (link).
  • Accept-Language Headers Fix - Google wants to fix an issue in how Chrome generates the Accept-Language HTTP headers from user language preferences. As websites sometimes only accept languages without region (i.e. “en” vs “en-AU”), a user could receive websites in an unexpected language. We plan to add the base language in the correct position so that users receive webpages in their preferred language.
  • Deprecate SVGPathElement.getPathSegAtLength - This interface is removed from the spec. (See this.)
  • Dispatch mouse transition events after layout - Mouse events are not sent when the nodes under the mouse change during layout. This then represents an incorrect state in that the hover state of where the mouse actually doesn't match the current hover state of the document. To fix a variety of issues we will start dispatching mouse transitional events and update the hover state shortly after layout has been executed. This will match Firefox behavior.
  • Feature Policy: Fullscreen - Allow developers to selectively enable and disable use of Fullscreen through the Feature-Policy HTTP header or the <iframe> "allow" attribute. The identifier for the feature in policies is "fullscreen". By default, fullscreen is allowed in all top-level documents, and in same-origin frames. This is similar to the existing <iframe> "allowfullscreen" attribute, but allows control over which origins will be allowed to use the feature when hosted inside of the frame.
  • Implement visibility:collapse for table rows and row-groups - visibility:collapse is supposed to hide table rows while preserving their contribution to column widths. Right now blink treats visibility:collapse as visibility:hidden, which merely skips painting the rows, leaving blank space in their place instead of allowing their space to be used for other content.
  • Loosen up escape sequence restrictions in template literals - The restriction on escape sequences in template literals has been loosened. This enables new use cases for template tags, such as writing a LaTeX processor.
  • Media Capture from HTML Media Element (<video>/<audio>) - “Media Capture from DOM Elements” document by W3C defines captureStream() method that allows the capture of a <video>/<audio> element in the form of a MediaStream. We want to implement the necessary Blink and Chromium sections that would create this stream by accessing the <video>/<audio> output according to the given play back constraints.
  • Network Information: Network Quality signals - This API provides network performance information to developers, as perceived by the UA, in a format that’s easy to consume and act upon: UA monitors latency and throughput of recent requests and provides estimates for effective RTT, throughput, and connection type that developers should optimize for - e.g. if the recently observed latency and/or throughput is low, the effective connection type will be mapped to a “low” value like 2G or 3G, regardless of the underlying network technology.
  • OpenType variable font support - OpenType variable fonts integration in the layout engine affects at least the following aspects: 1) Axis value assignments from font-variation-settings 2) Integration of variable fonts axis parameters into layout operations 3) Font matching for: Matching based on canonical scalable axes such as width or weight or optical sizing. Matching named instances 4) Feature resolution of CSS props, feature-settings and variation settings
  • PaymentDetailsModifier.data - Need to support modifiers with the same identifier but different data. One use case for this is to support card payments with different modifiers for credit vs. debit cards. This change adds the PaymentDetailsModifier.data field to supply the different data.
  • PaymentMethodData.supportedMethods should not be a sequence - PaymentMethodData is used in the PaymentRequest constructor, the PaymentRequestEvent, and the CanMakePaymentEvent. It's supportedMethods property holds and identifier indicating the payment methods a merchant accepts. Currently, this property takes either a string or array. After this change, it will only take a string.
  • Performance.timeOrigin - Performance.timeOrigin was defined in High Resolution Time 3. The attribute is useful for developers to be able to compare timings of objects (like windows or workers) with different time origins.
  • RTCPeerConnection.getStreamById - The getStreamById method on RTCPeerConnection is being removed. See this for a replacement if you depend on this.
  • RegExp dotAll mode / s flag - The new s flag for ECMAScript regular expressions makes . match any character, including line terminators.
  • RegExp lookbehind assertions - Lookarounds are zero-width assertions that match a string without consuming anything. ECMAScript has lookahead assertions that does this in forward direction, but the language is missing a way to do this backward which the lookbehind assertions provide. With lookbehind assertions, one can make sure that a pattern is or isn't preceded by another, e.g. matching a dollar amount without capturing the dollar sign.
  • Remove Insecure usage of Notifications - Remove access to the Notifications API on insecure origins. This will prevent sites from requesting notification permission or creating non-persistent local notifications over HTTP. Sites using the Notification API for web push must already be on secure origins due to the requirement for a service worker. Removal is anticipated in Chrome 62.
  • Remove Usage of Notifications from iFrames - Remove the ability to call Notification.requestPermission() from non-main frames. This change will align the requirements for notification permission with that of push notifications, easing friction for developers. It allows us to unify notification and push permissions.
  • SharedWorker: Remove workerStart - SharedWorker.workerStart has been deprecated for a while in the spec, and is not supported by other major browsers.
  • Support FLAC in ISO-BMFF with MSE - FLAC is a lossless audio coding format, already supported in regular Chrome HTML5 playback. This feature adds support for FLAC in ISO-BMFF to Chrome HTML5 Media Source Extensions (MSE).
  • Update ol.start default value as 1 - As per the spec, "The start IDL attribute must reflect the content attribute of the same name, with a default value of 1. This means that the start IDL attribute does not necessarily match the list's starting value, in cases where the start content attribute is omitted and the reversed content attribute is specified."
  • WebAudio: OfflineAudioContext constructor with dictionary - The constructor for an OfflineAudioContext now accepts a dictionary argument to specify the options needed to construct the context. This is an addition to the existing constructor that takes three arguments.
  • WebVR v1.1 - Adds input and output support for Virtual Reality head mounted displays, such as the Oculus Rift and Google Cardboard. This API will eventually be replaced by the WebXR Device API (link). The WebVR Origin Trial will end on July 24, 2018.
  • document.rootScroller - Allow a non-document (or <body>) element to hide URL bar, generate overscroll glow, etc. on scrolling, effects normally reserved for "viewport scrolling" only.
  • visualViewport attribute event handlers - Adding attribute event handlers to visualViewport. i.e. visualViewport.onresize and visualViewport.onscroll (This is a minor fix to the shipped implementation)

Bug fixes

High-threat bug fixes

  • CVE-2017-5124: UXSS with MHTML. Reported by Anonymous on 2017-09-07
  • CVE-2017-5125: Heap overflow in Skia. Reported by Anonymous on 2017-07-26
  • CVE-2017-5126: Use after free in PDFium. Reported by Luật Nguyá»…n (@l4wio) of KeenLab, Tencent on 2017-08-30
  • CVE-2017-5127: Use after free in PDFium. Reported by Luật Nguyá»…n (@l4wio) of KeenLab, Tencent on 2017-09-14
  • CVE-2017-5128: Heap overflow in WebGL. Reported by Omair on 2017-09-14
  • CVE-2017-5129: Use after free in WebAudio. Reported by Omair on 2017-09-15
  • CVE-2017-5132: Incorrect stack manipulation in WebAssembly. Reported by Gaurav Dewan (@007gauravdewan) of Adobe Systems India Pvt. Ltd. on 2017-05-05
  • CVE-2017-5130: Heap overflow in libxml2. Reported by Pranjal Jumde (@pjumde) on 2017-05-14

Medium-threat bug fixes

  • CVE-2017-5131: Out of bounds write in Skia. Reported by Anonymous on 2017-07-16
  • CVE-2017-5133: Out of bounds write in Skia. Reported by Aleksandar Nikolic of Cisco Talos on 2017-09-05
  • CVE-2017-15386: UI spoofing in Blink. Reported by WenXu Wu of Tencent's Xuanwu Lab on 2017-08-03
  • CVE-2017-15387: Content security bypass. Reported by Jun Kokatsu (@shhnjk) on 2017-08-16
  • CVE-2017-15388: Out of bounds read in Skia. Reported by Kushal Arvind Shah of Fortinet's FortiGuard Labs on 2017-08-17
  • CVE-2017-15389: URL spoofing in OmniBox. Reported by xisigr of Tencent's Xuanwu Lab on 2017-07-06
  • CVE-2017-15390: URL spoofing in OmniBox. Reported by Haosheng Wang (@gnehsoah) on 2017-07-28

Low-threat bug fixes:

  • CVE-2017-15391: Extension limitation bypass in Extensions. Reported by João Lucas Melo Brasio (whitehathackers.com.br) on 2016-03-28
  • CVE-2017-15392: Incorrect registry key handling in PlatformIntegration. Reported by Xiaoyin Liu (@general_nfs) on 2017-04-22
  • CVE-2017-15393: Referrer leak in Devtools. Reported by Svyat Mitin on 2017-06-13
  • CVE-2017-15394: URL spoofing in extensions UI. Reported by Sam @sudosammy on 2017-07-18
  • CVE-2017-15395: Null pointer dereference in ImageCapture. Reported by Johannes Bergman (johberlvi@) on 2017-08-28

[source]

Have a great time cross-browser testing in Chrome 62 with Browserling!