Chrome 65 Released - What's new?

Good news! Chrome 65 was released today. Not only that, but we also installed it on our machines, ready to be used in a testing environment for your web apps. Its features are mostly oriented towards web developers. You will be happy to know that Chrome 65 features a lot of visual functionality (see details below). And this is a screenshot of exact Chrome 65 version running in Brwoserling:

Try it yourself on-spot!

What's new in Chrome 65?

• New extension UI.
• The CSS Paint API allows you to programmatically generate an image.
• The Server Timing API allows web servers to provide performance timing information via HTTP headers.
• The new CSS display: contents property can make boxes disappear.
• Fixed a bug that affected some timestamps.
• The syntax for specifying HSL and HSLA, and RGB and RGBA coordinates for the color property now match the CSS Color 4 spec.
• There's a new feature policy that allows you to control synchronous XHRs through an HTTP header or the iframe allow attribute.
• Last version available for OS X 10.9.
• A number of fixes and improvements.

For Android:

• Set language preferences for web content in Settings > Languages.
• Turn on the prompt for simplified view for all supported articles in Settings > Accessibility settings.
• Share and delete downloads more easily on the Downloads page.
• Disable screen capture on incognite mode.

For iOS:

• Fixed a bug that affected some streaming audio players.
• Stability and performance improvements.

CSS Paint API

With this API you can automatically generate images that you can use for CSS properties like background-image and border-image. In a way, it is very similar to a canvas element, as you can use the new paint function to draw an image instead of referencing it. See this.

<style>
  .myElem {  background-image:  **paint(checkerboard);**  }  
</style>  
<script>
  CSS.paintWorklet.addModule('checkerboard.js');
</script>

Server Timing API

With the new Server Timing API you can allow the server to pass timing information to the browser, which will give you a better picture of your performance. Before this you have probably used the navigation and resource timing APIs. But now, the Server Timing API provides you an easy way for the server to report its performance timing. You can track as many metrics as you want: database read times, start-up time, or whatever is important to you, by adding a Server-Timing header to your response: Server-Timing': 'su=42;"Start-up",db-read=142;"Database Read"'. They are shown in DevTools, but you can also pull them out of the response header and save them with your other performance analytics.

display: contents

This is a new CSS property that once added to a container element, any children take its place in the DOM, and it essentially disappears. This is something that people call it a "CSS trick".

display: contents causes an element's children to appear as if they
were direct children of the element's parent, ignoring the element
itself. This can be useful when a wrapper element should be ignored
when using CSS grid or similar layout techniques.

Source: caniuse display: conents?

Developer features and updates in Chrome 65

• Block cross-origin - To avoid what is essentially user-mediated cross-origin information leakage, Blink will start to ignore the presence of the download attribute on anchor elements with cross origin attributes.
• CSS Color 4 HSL/HSLA syntax - Update parsing of HSL() and HSLA()to the syntax described in CSS Color 4. The functions were synonymized, along with allowing whitespace to separate the parameters instead of commas, introducing a backslash as a new way to separate the alpha parameter, allowing angles to be specified as the hue, and allowing percent values for the alpha parameter.
• CSS Color 4 RGB/RGBA syntax - Update parsing of RGB() and RGBA() to the syntax described in CSS Color 4. The functions were synonymized, along with allowing whitespace to separate the channels instead of commas, introducing a backslash as a new way to separate the alpha parameter, and allowing percent values for the alpha parameter.
• CSS Paint API (Houdini) - CSS Paint API defines a new callback which is designed to allow developers to write code which produces a CSS <image> during the paint phase of the rendering engine.
• CSS Selectors 4 Pseudo-Class :any-link - The :any-link pseudo-class represents an element that acts as the source anchor of a hyperlink.
• CSS Selectors 4 Pseudo-Class :matches() - The matches-any pseudo-class, :matches(), is a functional pseudo-class taking a selector list as its argument. It represents an element that is represented by its argument.
• Feature Policy: control Synchronous XMLHttpRequest - Allows developers to selectively enable and disable use of Synchronous XMLHttpRequest requests through the feature policy HTTP header or the <iframe> "allow" attribute. The identifier for the feature in policies is "sync-xhr". By default, synchronous XHR is allowed in all frames. If developers wish to disable this on any page, they can include a header like: Feature-Policy: sync-xhr 'none' Or embed content in an frame with sync XHR disabled like: <iframe src="..." allow="sync-xhr 'none'">.
• NTLMv2 - Support NTLMv2 authentication. Currently on non-Windows platforms only NTLMv1 is used.
• PerformanceObserver takeRecords() - The takeRecords method returns a copy of the performance entries in the PerformanceObserver’s buffer, and also clears this buffer. This aligns PerformanceObserver with other *Observer implementations, like MutationObserver and IntersectionObservers, which have similar methods.
• RTCRtpSender and RTCRtpReceiver extensions to RTCPeerConnection - This feature encapsulates the addition of the following methods to RTCPeerConnection: getSenders(), getReceivers(), addTrack(MediaStreamTrack track, MediaStream... streams), and removeTrack(RTCRtpSender sender). The RTCRtpSender and RTCRtpReceiver objects will initially be limited to supporting the "track" attribute, with RTCRtpSender also supporting "replaceTrack(MediaStreamTrack withTrack)".
• RTCRtpSender.replaceTrack - This allows you to seamlessly change which track is being sent without having to renegotiate at the expense of another offer/answer cycle. For example, you might want to switch which video to send or to temporarily not send video, without any disruption in audio or at the cost of an RTT delay. It can also be used to control whether or not to send with replaceTrack(null).
• Request.destination - The Request.destination getter enables Service Worker code knowledge regarding which type of resource it is fetching.
• ServerTiming API - Add the PerformanceServerTiming Interface which makes Server-Timing header timing values available to JavaScript running in the browser.
• Support HTMLAnchorElement.relList property - The HTMLAnchorElement.relList read-only property reflects the rel attribute. It is a live DOMTokenList containing the set of link types indicating the relationship between the resource represented by the <a> element and the current document.
• Support HTMLAreaElement.relList property - The HTMLAreaElement.relList read-only property reflects the rel attribute. It is a live DOMTokenList containing the set of link types indicating the relationship between the resource represented by the <area> element and the current document.
• TLS 1.3 (draft versions) - The latest version of the Transport Layer Security (TLS) protocol. For M65, draft-23 of the protocol will be rolled out to Chrome users via a field trial.
• Wheel scroll latching and async wheel events - Latch to a single element for the duration of a wheel scroll. Only the first wheel event in a scrolling sequence is cancel-able.
• Worklets - Worklets define a new javascript execution context which is designed to allow developers to write code which is intended to be run synchronously within the rendering engine, however independent of the main user javascript. This feature was released in two stages. Worklets for paint were released in Chrome 65/Opera 52. Worklets for audio were released for Chrome 66/Opera 53.
• assignedElements on - Add assignedElements on <slot>, similar to assignedNodes(), but returning Element nodes only. The method returns elements that are assigned to a given slot.
• display: contents - "display: contents" allows you to control the box generation of an element. The element with "display: contents" won't generate any box, but its children and pseudo-elements will still do it as normal. It's like the element has been replaced by its children and pseudo-elements.
• document.all is no longer [Replaceable]. - It has been possible for web developers to overwrite document.all for a long time, but according to the web standard, document.all will be no longer overwritable, i.e. it will be readonly. [before the change] document.all = 42; console.log(document.all); // prints 42 [after the change] document.all = 42; console.log(document.all); // prints a HTMLAllCollection.
• toJSON for Performance and PerformanceEntry - Ever since WebIDL was deprecated in favor of toJSON [1], the Performance and PerformanceEntry specs added a mandatory toJSON method. This method should just call the default toJSON operation [2]. [1] The following interfaces will have toJSON added: PerformanceResourceTiming PerformanceLongTaskTiming TaskAttributionTiming.

Bug fixes

High-threat bug fixes

• CVE-2017-11215: Use after free in Flash. Reported by JieZeng of Tencent Zhanlu Lab on 2017-08-25
• CVE-2017-11225: Use after free in Flash. Reported by JieZeng of Tencent Zhanlu Lab on 2017-08-25
• CVE-2018-6060: Use after free in Blink. Reported by Omair on 2017-11-02
• CVE-2018-6061: Race condition in V8. Reported by Guang Gong of Alpha Team, Qihoo 360 on 2017-12-12
• CVE-2018-6062: Heap buffer overflow in Skia. Reported by Anonymous on 2017-10-31
• CVE-2018-6057: Incorrect permissions on shared memory. Reported by Gal Beniamini of Google Project Zero on 2017-11-30
• CVE-2018-6063: Incorrect permissions on shared memory. Reported by Gal Beniamini of Google Project Zero on 2017-12-07
• CVE-2018-6064: Type confusion in V8. Reported by lokihardt of Google Project Zero on 2018-01-03
• CVE-2018-6065: Integer overflow in V8. Reported by Mark Brand of Google Project Zero on 2018-02-01

Medium-threat bug fixes

• CVE-2018-6066: Same Origin Bypass via canvas. Reported by Masato Kinugawa on 2018-01-05
• CVE-2018-6067: Buffer overflow in Skia. Reported by Ned Williamson on 2017-10-30
• CVE-2018-6068: Object lifecycle issues in Chrome Custom Tab. Reported by Luan Herrera on 2018-01-04
• CVE-2018-6069: Stack buffer overflow in Skia. Reported by Wanglu & Yangkang(@dnpushme) of Qihoo360 Qex Team on 2018-01-08
• CVE-2018-6070: CSP bypass through extensions. Reported by Rob Wu on 2016-11-25
• CVE-2018-6071: Heap bufffer overflow in Skia. Reported by Anonymous on 2017-10-23
• CVE-2018-6072: Integer overflow in PDFium. Reported by Atte Kettunen of OUSPG on 2017-12-01
• CVE-2018-6073: Heap bufffer overflow in WebGL. Reported by Omair on 2018-01-20
• CVE-2018-6074: Mark-of-the-Web bypass. Reported by Abdulrahman Alqabandi (@qab) on 2018-02-06
• CVE-2018-6075: Overly permissive cross origin downloads. Reported by Inti De Ceukelaire (intigriti.com) on 2016-05-03
• CVE-2018-6076: Incorrect handling of URL fragment identifiers in Blink. Reported by Mateusz Krzeszowiec on 2017-08-24
• CVE-2018-6077: Timing attack using SVG filters. Reported by Khalil Zhani on 2017-10-26
• CVE-2018-6078: URL Spoof in OmniBox. Reported by Khalil Zhani on 2017-12-10
• CVE-2018-6079: Information disclosure via texture data in WebGL. Reported by Ivars Atteka on 2017-11-24
• CVE-2018-6080: Information disclosure in IPC call. Reported by Gal Beniamini of Google Project Zero on 2017-12-05

Low-threat bug fixes:

• CVE-2018-6081: XSS in interstitials. Reported by Rob Wu on 2017-12-24
• CVE-2018-6082: Circumvention of port blocking. Reported by WenXu Wu of Tencent's Xuanwu Lab on 2017-09-21
• CVE-2018-6083: Incorrect processing of AppManifests. Reported by Jun Kokatsu (@shhnjk) on 2017-10-04

[source]

Have fun cross-browser testing your code in Chrome 65 and see you next time!