Revision 1077072 of Firefox 29 for developers

<p>Firefox 29 was released on April 29, 2014. This article lists key changes that are useful not only for web developers, but also Firefox and Gecko developers as well as add-on developers.</p>

<h2 id="Changes_for_Web_developers">Changes for Web developers</h2>

<h3 id="Developer_Tools">Developer Tools</h3>

<p>Major changes include:</p>

<ul>
 <li>Vastly improved web console - Arrays are shown inline without clicking to bring up in the right inspector, window objects show their url, etc.</li>
 <li>Added the <a href="https://developer.mozilla.org/docs/Web/API/console">console API</a> to Web Workers (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=620935">bug 620935</a>). Now you can log messages to the Web Console from Web Workers.</li>
 <li>The <a href="/en-US/docs/Tools/Network_Monitor">Network Monitor</a> tool now shows performance statistics using pie charts ({{bug(846601)}}).</li>
 <li>On the <a href="/en-US/docs/Tools/Page_Inspector">Inspector</a>, preview tooltips of CSS transforms are now available ({{bug(726427)}}).</li>
 <li>DOM elements seen in the debugger and console can be removed or inspected directly, via the new buttons to the right of the variable listing.</li>
 <li>A CSS source map is now supported by the <a href="/en-US/docs/Tools/Style_Editor">Style Editor</a> ({{bug(926014)}}).</li>
 <li>Autocompletion of CSS properties and values has been added to the <a href="/en-US/docs/Tools/Style_Editor">Style Editor</a> ({{bug(717369)}}).</li>
</ul>

<p><em>See the <a href="https://hacks.mozilla.org/2014/02/css-source-map-support-network-performance-analysis-more-firefox-developer-tools-episode-29/" title="CSS source map support, network performance analysis &amp; more – Firefox Developer Tools Episode 29 ✩ Mozilla Hacks – the Web developer blog">Mozilla Hacks blog post</a> for details and other smaller changes.</em></p>

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

<ul>
 <li><a href="/en-US/docs/Web/CSS/Using_CSS_variables">CSS variables</a> have been implemented ({{bug("773296")}}). Mozilla Hacks article can be found <a href="https://hacks.mozilla.org/2013/12/css-variables-in-firefox-nightly/">here</a>. They are enabled by default only for non-release builds (on release builds flip the pref <code>layout.css.variables.enabled</code> to <code>true</code> if you want to play with them).</li>
 <li>Flexboxes now support {{cssxref("visibility")}}<code>: collapse</code> ({{bug(783470)}}).</li>
 <li>The {{cssxref("box-sizing")}} property has been unprefixed ({{bug(243412)}}).</li>
 <li>The {{cssxref("will-change")}} property, a hint to that something will animate has been added. The preference <code>layout.css.will-change.enabled</code> must be switched to <code>true</code> to enable it. ({{bug(940842)}})</li>
 <li>Scientific exponential notation, like <code>3e1</code> or <code>10e+0</code>, is now supported for {{cssxref("&lt;number&gt;")}} values and derivatives, like {{Xref_csspercentage}} and unit values, but not {{cssxref("&lt;integer&gt;")}}&nbsp; ({{bug(964529)}}).</li>
 <li>Images of type {{cssxref("&lt;gradient&gt;")}} are now supported in {{cssxref("border-image")}} ({{bug(709587)}}).</li>
 <li>The {{cssxref("touch-action")}} property has been implemented. It is not activated by default; the <code>layout.css.touch_action.enabled</code> pref controls it. ({{bug(795567)}})</li>
 <li>Remove redundant default style for &lt;pre&gt; element from quirk.css&nbsp;({{bug(948914)}}).</li>
 <li>CSS Variables fallback incorrectly implemented (primary cycles)&nbsp;&nbsp;({{bug(950497)}}).</li>
 <li>@supports conditions with tokens after a declaration's priority should evaluate to false&nbsp;({{bug(909170)}}).</li>
</ul>

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

<ul>
 <li><code>&lt;input type=color&gt;</code> and <code>&lt;input type=number&gt;</code> are available by default.</li>
 <li>Support for the non standard <code>&lt;pre cols&gt;</code> has been removed, as well as the layout effect of <code>&lt;pre wrap&gt;</code> . Both effects can, and should, be achieved using CSS. ({{bug("949879")}})</li>
</ul>

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

<ul>
 <li>New ECMAScript 6 String methods: {{jsxref("String.prototype.codePointAt()")}} and {{jsxref("String.prototype.fromCodePoint()")}} have been implemented ({{bug("918879")}}).</li>
 <li>The <a href="https://www.ecma-international.org/ecma-402/1.0/">ECMAScript Internationalization API (ECMA-402)</a> has been implemented and is now enabled by default in Firefox Desktop ({{bug("853301")}}):
  <ul>
   <li>New objects in the new {{jsxref("Intl")}} object namespace:
    <ul>
     <li>{{jsxref("Collator", "Intl.Collator")}}</li>
     <li>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}</li>
     <li>{{jsxref("NumberFormat", "Intl.NumberFormat")}}</li>
    </ul>
   </li>
   <li>The following methods of {{jsxref("String")}}, {{jsxref("Number")}} and {{jsxref("Date")}} have been updated to include the <code>locales</code> and <code>options</code> arguments per ECMA-402:
    <ul>
     <li>{{jsxref("String.prototype.localeCompare()")}}</li>
     <li>{{jsxref("Number.prototype.toLocaleString()")}}</li>
     <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
     <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
     <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li>
    </ul>
   </li>
  </ul>
 </li>
 <li>To match the updated ECMAScript6 draft specification, the {{jsxref("Map")}} and {{jsxref("Set")}} objects now treat <code>-0</code> and <code>+0</code> as the same when checking for key and value equality.</li>
 <li><code>Promise</code> has been enabled by default ({{bug(918806)}}).</li>
 <li>Completed <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">generators</a> now return an <code>IteratorResult</code> object instead of throwing ({{bug(958951)}}).</li>
 <li>A malformed JSON string parsed by {{jsxref("JSON.parse()")}} now yields a more detailed error message containing the line and column number that caused the parsing error. This is useful when debugging large JSON data.</li>
 <li>The {{jsxref("ArrayBuffer.isView()")}} method has been added ({{bug(896105)}}).</li>
</ul>

<h3 id="InterfacesAPIsDOM">Interfaces/APIs/DOM</h3>

<ul>
 <li>A new type of workers, {{domxref("SharedWorker")}}, is now available by default ({{bug(924089)}}).</li>
 <li>The {{domxref("URLUtils")}} interface now supports the {{domxref("URLUtils.searchParams", "searchParams")}} property returning a {{domxref("URLSearchParams")}} object, allowing to modify the search params of an URL ({{bug(887836)}}). The {{domxref("URLSearchParams")}} constructor allows easier parsing of query strings.</li>
 <li>The {{domxref("NavigatorOnLine.onLine")}} property is now supported on {{domxref("WorkerNavigator")}} , allowing to know the online/offline status in workers ({{bug(925437)}}).</li>
 <li>As part of the implementation of Web Components, the {{domxref("HTMLShadowElement")}} interface has been implemented behind the <code>dom.webcomponents.enabled</code>. Flip it to <code>true</code> if you want to use it. ({{bug(887538)}}).</li>
 <li>The read-only property {{domxref("HTMLIFrameElement.sandbox")}} is no longer a {{domxref("string")}} but an {{domxref("HTMLSettableToken")}} ({{bug(845057)}}).</li>
 <li>On {{domxref("HTMLCanvasElement.getContext()")}}, the value <code>moz-webgl</code> is no longer supported. Use the standard <code>webgl</code> value ({{bug(913597)}}).</li>
 <li>The constructor for {{domxref("ImageData")}} has been added. This interface can be used in a {{domxref("Worker")}}. ({{bug(959958)}})</li>
 <li>The property {{domxref("URLUtilsReadOnly.origin", "location.origin")}} is now available in workers (via {{domxref("WorkerLocation")}}) ({{bug(964148)}}).</li>
 <li>The {{domxref("ValidityState.badInput")}} property has been implemented ({{bug(827161)}}).</li>
 <li>The deprecated {{domxref("Window.pkcs11")}} property has been removed; it was returning <code>null</code> since Firefox 3.0.14. ({{bug(964964)}})</li>
 <li>The {{domxref("Node.cloneNode()")}} and {{domxref("Document.importNode()")}} methods take the Boolean <code>deep</code> argument. Until now, if omitted, these methods acted as if the value of <code>deep</code> was <code>true</code>. But this behavior has been changed as per the latest spec, and if omitted, the methods will act as if the value was <code>false</code>. ({{bug(937461)}})</li>
 <li>{{domxref("Window._content")}} is no longer available to Web content ({{bug(946564)}}).</li>
 <li>{{domxref("URLUtils.port")}} behavior has been slightly changed: set to <code>''</code> will set it to the default port associated with the protocol, and <code>0</code> to <code>0.</code> ({{bug(930450)}})</li>
 <li>{{domxref("Document.referrer")}} is now based on the incumbent script ({{bug(887928)}}).</li>
 <li>The <a href="/en-US/docs/Web/Guide/API/Gamepad">Gamepad API</a> is enabled by default ({{bug(878828)}}).</li>
 <li>The {{domxref("CanvasRenderingContext2D.drawSystemFocusRing()")}} method got renamed to {{domxref("CanvasRenderingContext2D.drawFocusIfNeeded()")}} ({{bug(959820)}}).</li>
</ul>

<h3 id="MathML">MathML</h3>

<p><em>No change.</em></p>

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

<p><em>No change.</em></p>

<h2 id="Security">Security</h2>

<ul>
 <li>The CSP 1.1 experimental <code>hash-source</code> directive has been implemented. The preference <code>security.csp.experimentalEnabled</code> should be set to <code>true</code> to enable this functionality ({{bug(883975)}}).</li>
</ul>

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

<ul>
 <li><a href="/en-US/Firefox/Australis_add-on_compat">Australis and add-on compatibility</a> - This is a major Firefox theme change that affects most extensions that involving the Firefox user interface.</li>
 <li><code>nsISecurityCheckedComponent</code> has been removed ({{bug(794943)}}). Most consumers can simply remove nsISecurityCheckedComponent from their interface definition and they will continue to work.</li>
</ul>

<p>Non-Australis changes TBD.</p>

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

<ul>
 <li><a href="https://www.fxsitecompat.com/en-US/versions/29/">Site Compatibility for Firefox 29</a></li>
</ul>

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

<p>{{Firefox_for_developers('28')}}</p>