---
title: Firefox 60 for developers
slug: Mozilla/Firefox/Releases/60
translation_of: Mozilla/Firefox/Releases/60
---
<div>{{FirefoxSidebar}}</div><div>{{draft}}</div>

<p class="summary">This article provides information about the changes in Firefox 60 that will affect developers. Firefox 60 is the current <a href="https://www.mozilla.org/en-US/firefox/channel/desktop/#nightly">Nightly version of Firefox</a>, and will ship on <a href="https://wiki.mozilla.org/RapidRelease/Calendar#Future_branch_dates">May 8, 2018</a>.</p>

<h2 id="Stylo_comes_to_Firefox_for_Android_in_60">Stylo comes to Firefox for Android in 60</h2>

<p><a href="https://hacks.mozilla.org/2017/08/inside-a-super-fast-css-engine-quantum-css-aka-stylo/">Firefox's new parallel CSS engine</a> — also known as <strong>Quantum CSS</strong> or <strong>Stylo</strong>, which was <a href="/en-US/Firefox/Releases/57#Firefox_57_Firefox_Quantum">first enabled by default in Firefox 57 for desktop</a>, has now been enabled in Firefox for Android.</p>

<h2 id="Changes_for_web_developers">Changes for web developers</h2>

<h3 id="Developer_tools">Developer tools</h3>

<ul>
 <li>In the CSS Pane rules view (see <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS">Examine and edit CSS</a>), the keyboard shortcuts for precise value increments (increase/decrease by 0.1) have changed from <kbd>Alt</kbd> + <kbd>Up</kbd>/<kbd>Down</kbd> to <kbd>Ctrl</kbd> + <kbd>Up</kbd>/<kbd>Down</kbd> on Linux and Windows, to avoid clashes with default OS-level shortcuts (see {{bug("1413314")}}).</li>
 <li>Also in the CSS Pane rules view, <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables">CSS variable names</a> will now auto-complete ({{bug(1422635)}}). If you enter <code>var(</code> into a property value and then type a dash (<code>-</code>), any variables you have declared in your CSS will then appear in an autocomplete list.</li>
</ul>

<h3 id="HTML">HTML</h3>

<p>Pressing the Enter key in <code>designMode</code> and <code>contenteditable</code> now inserts <code>&lt;div&gt;</code> elements when the caret is in an inline element or text node which is a child of a block level editing host — instead of inserting <code>&lt;br&gt;</code> elements like it used to. If you want to use the old behavior on your app, you can do it with <code>document.execCommand()</code>. See <a href="/en-US/docs/Web/Guide/HTML/Editable_content#Differences_in_markup_generation">Differences in markup generation</a> for more details.</p>

<h3 id="CSS">CSS</h3>

<ul>
 <li>The {{cssxref("align-content")}}, {{cssxref("align-items")}}, {{cssxref("align-self")}}, {{cssxref("justify-content")}}, and {{cssxref("place-content")}} property values have been updated as per the latest <a href="https://drafts.csswg.org/css-align-3/">CSS Box Alignment Module Level 3</a> spec ({{bug(1430817)}}).</li>
 <li>The {{cssxref("paint-order")}} property has been implemented ({{bug(1426146)}}).</li>
</ul>

<h3 id="SVG">SVG</h3>

<p><em>No changes.</em></p>

<h3 id="JavaScript">JavaScript</h3>

<p>The {{jsxref("Array.prototype.values()")}} method has been added again ({{bug(1420101)}}). It was disabled due to <a href="https://www.fxsitecompat.com/en-CA/docs/2016/array-prototype-values-breaks-some-legacy-apps/">compatibilty issues</a> in earlier versions. Make sure your code doesn't have any custom implementation of this method.</p>

<h3 id="APIs">APIs</h3>

<h4 id="New_APIs">New APIs</h4>

<p><em>No changes.</em></p>

<h4 id="DOM">DOM</h4>

<ul>
 <li>In the <a href="/en-US/docs/Web/API/Web_Authentication_API">Web Authentication API</a>, the <code>MakePublicKeyCredentialOptions</code> dictionary object has been renamed {{domxref("PublicKeyCredentialCreationOptions")}}; this change has been made in Firefox ({{bug(1436473)}}).</li>
 <li>The <code>dom.workers.enabled</code> pref has been removed, meaning workers can no longer be disabled ({{bug(1434934)}}).</li>
 <li>The {{domxref("Document.body","body")}} property is now implemented on the {{domxref("Document")}} interface, rather than the {{domxref("HTMLDocument")}} interface ({{bug(1276438)}}).</li>
 <li>{{domxref("PerformanceResourceTiming")}} is now available in workers ({{bug(1425458)}}).</li>
 <li>The {{domxref("PerformanceObserver.takeRecords()")}} method has been implemented ({{bug(1436692)}}).</li>
 <li>The {{domxref("KeyboardEvent.keyCode")}} attribute of punctuation key becomes non-zero even if active keyboard layout doesn't produce ASCII character. See <a href="/en-US/docs/Web/API/KeyboardEvent/keyCode#keyCode_of_punctuation_keys_on_some_keyboard_layout">the detail</a>. Note that please do <strong>not</strong> use <code>KeyboardEvent.keyCode</code> in new applications. Please consider to use {{domxref("KeyboardEvent.key")}} or {{domxref("KeyboardEvent.code")}} instead.</li>
 <li>The {{domxref("Animation.updatePlaybackRate()")}} method has been implemented ({{bug("1436659")}}).</li>
 <li>New rules have been included for determining <a href="/en-US/docs/Web/API/KeyboardEvent/keyCode#keyCode_of_punctuation_keys_on_some_keyboard_layout">keyCode values of punctuation keys</a> ({{bug(1036008)}}).</li>
</ul>

<h4 id="DOM_events">DOM events</h4>

<p><em>No changes.</em></p>

<h4 id="Service_workers">Service workers</h4>

<p><em>No changes.</em></p>

<h4 id="Media_and_WebRTC">Media and WebRTC</h4>

<ul>
 <li>When recording or sharing media obtained using {{domxref("MediaDevices.getUserMedia", "getUserMedia()")}}, muting the camera by setting the corresponding track's {{domxref("MediaStreamTrack.enabled")}} property to <code>false</code> now turns off the camera's "in use" indicator light, to help the user more easily see that the camera is not in use ({{bug(1299515)}}).</li>
 <li>Removing a track from an {{domxref("RTCPeerConnection")}} using {{domxref("RTCPeerConnection.removeTrack", "removeTrack()")}} no longer removes the track's {{domxref("RTCRtpSender")}} from the peer connection's list of senders as reported by {{domxref("RTCPeerConnection.getSenders", "getSenders()")}} ({{bug(1290949)}}).</li>
 <li>The {{domxref("RTCRtpContributingSource")}} and {{domxref("RTCRtpSynchronizationSource")}} objects' timestamps were previously being reported based on values returned by {{jsxref("Date.getTime()")}}. In Firefox 60, these have been fixed to correctly use the <a href="/en-US/docs/Web/API/Performance_API">Performance Timing API</a> instead ({{bug(1433576)}}).</li>
</ul>

<h4 id="Canvas_and_WebGL">Canvas and WebGL</h4>

<p><em>No changes.</em></p>

<h3 id="CSSOM">CSSOM</h3>

<p><em>No changes.</em></p>

<h3 id="HTTP">HTTP</h3>

<p><em>No changes.</em></p>

<h3 id="Security">Security</h3>

<p><em>No changes.</em></p>

<h3 id="Plugins">Plugins</h3>

<p><em>No changes.</em></p>

<h3 id="Other">Other</h3>

<p><em>No changes.</em></p>

<h2 id="Removals_from_the_web_platform">Removals from the web platform</h2>

<h3 id="HTML_2">HTML</h3>

<p><em>No changes.</em></p>

<h3 id="CSS_2">CSS</h3>

<ul>
 <li>The proprietary {{cssxref("-moz-user-input")}} property's <code>enabled</code> and <code>disabled</code> values are no longer available ({{bug("1405087")}}).</li>
 <li>The proprietary {{cssxref("-moz-border-top-colors")}}, {{cssxref("-moz-border-right-colors")}}, {{cssxref("-moz-border-bottom-colors")}}, and {{cssxref("-moz-border-left-colors")}} properties have been removed from the platform completely ({{bug(1429723)}}).</li>
</ul>

<h3 id="JavaScript_2">JavaScript</h3>

<p>The non-standard <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Expression_closures">expression closure</a> syntax has been removed ({{bug(1426519)}}).</p>

<h3 id="APIs_2">APIs</h3>

<p><em>No changes.</em></p>

<h3 id="SVG_2">SVG</h3>

<p><em>No changes.</em></p>

<h3 id="Other_2">Other</h3>

<p><em>No changes.</em></p>

<h2 id="Changes_for_add-on_and_Mozilla_developers">Changes for add-on and Mozilla developers</h2>

<h3 id="WebExtensions">WebExtensions</h3>

<p><em>No changes.</em></p>

<h2 id="See_also">See also</h2>

<ul>
 <li>Site compatibility for Firefox 60</li>
</ul>

<h2 id="Older_versions">Older versions</h2>

<p>{{Firefox_for_developers(58)}}</p>

<p> </p>