Firefox 22 for developers

  • Revision slug: Mozilla/Firefox/Releases/22
  • Revision title: Firefox 22 for developers
  • Revision id: 464685
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment

Revision Content

Want to help document Firefox 22? See the list of bugs that need to be written about and pitch in!

Changes for Web developers

HTML

  • The HTML5 {{HTMLElement("data")}} element has been implemented ({{bug(839371)}}).
  • The range state of the {{HTMLElement("input")}} element (<input type="range">) has been implemented, behind the preference dom.experimental_forms_range, only enabled by default on Nightly and Aurora channel ({{bug(841948)}}).
  • The support for the {{HTMLElement("template")}} element, part of the Web component specification has been implemented ({{bug(818976)}}).

JavaScript

  • Asm.js optimizations are enabled, making it possible to compile C/C++ applications to a subset of Javascript for better performance.
  • ES6 Arrow Function syntax has been implemented ({{bug(846406)}}).
  • The new Object.is function has been added ({{bug(839979)}}).

DOM

  • Support for the multipart property on XMLHttpRequest and multipart/x-mixed-replace responses in XMLHttpRequest has been removed. This was a Gecko-only feature that was never standardized. Server-Sent Events, Web Sockets or inspecting responseText from progress events can be used instead.
  • Support for Web Notifications has been landed ({{bug(782211)}}).
  • The {{domxref("FormData")}}  append method now accepts a third optional filename parameter ({{bug(690659)}}).
  • {{domxref("Node.isSupported")}} has been removed ({{bug(801562)}}).
  • {{domxref("Node.setUserData")}} and {{domxref("Node.getUserData")}} has been removed for web content and are deprecated for chrome content ({{bug(842372)}}).
  • The {{domxref("Element.attributes")}} property has been moved there from {{domxref("Node")}} as required by the spec ({{bug("844134")}}).
  • The Mac OS X backend for {{domxref("DeviceLightEvent", "Ambient Light Events")}} has been implemented.
  • Elements in the HTML namespace with local names {{HTMLElement("bgsound")}}, {{HTMLElement("multicol")}}, and {{HTMLElement("image")}} no longer implement the {{domxref("HTMLSpanElement")}} interface.  {{HTMLElement("bgsound")}} and {{HTMLElement("bgsound")}} implement {{domxref("HTMLUnknownElement")}} and {{HTMLElement("image")}} implements {{domxref("HTMLElement")}}.
  • The {{ domxref("NodeIterator.detach") }} method has been changed to do nothing ({{bug("823549")}}).
  • The {{domxref("BlobEvent")}} interface has been implemented ({{bug("834165")}}).
  • The properties HTMLMediaElement.crossorigin and HTMLInputElement.inputmode has been removed to match the spec in {{domxref("HTMLMediaElement.crossOrigin")}} and HTMLInputElement.inputMode, respectively ({{bug("847370")}} and {{bug("850346")}}).
  • WebRTC: the Media Stream API and Peer Connection API are now supported by default.
  • Web Components: the {{domxref("Document.register")}} method has been implemented ({{bug("783129")}}).
  • The {{domxref("ProgressEvent.initProgressEvent()")}} constructor method has been removed. Uses the standard constructor, {{domxref("ProgressEvent.ProgressEvent", "ProgressEvent()")}} to construc and initialize {{domxref("ProgressEvent")}} ({{bug("843489")}}).
  • Manipulated data associated with a {{event("cut")}}, {{event("copy")}}, or {{event("paste")}} event can now be accessed via the {{domxref("ClipboardEvent.clipboardData")}} property ({{bug("407983")}}).

CSS

  • Support for CSS Flexbox layout has been enabled by default ({{bug("841876")}}).
  • Following a spec change, the initial value for {{cssxref("min-width")}} and {{cssxref("min-height")}} has been changed back to 0, even on flex items ({{bug("848539")}}).
  • Support for CSS Conditionals ({{cssxref("@supports")}} and {{domxref("CSS.supports")}}) has been enabled by default ({{bug("855455")}}).
  • Support for {{cssxref("background-clip")}} and {{cssxref("background-origin")}} properties in the {{cssxref("background")}} shorthand has been implemented ({{bug("570896")}}).

Changes for add-on and Mozilla developers

  • The properties parameter has been removed from the {{ifmethod('nsITreeView','getCellProperties')}}, {{ifmethod('nsITreeView','getColumnProperties')}} and {{ifmethod('nsITreeView','getRowProperties')}} methods of {{interface('nsITreeView')}}. These methods should now return a string of space-separated property names. ({{bug('407956')}})
  • The {{ifmethod('inIDOMUtils', 'getCSSPropertyNames')}} method has been implemented and will return all supported CSS property names.
  • See here for more changes.

Firefox Developer Tools

  • Font inspector shows which fonts on your computer are applied to the page.
  • Visual paint feedback mode shows when and where a page is repainted.
  • The dev tools may now be docked to the right side, not just the bottom of the browser.
  • Some panes within the dev tools have switched from XUL to HTML. For example, the css rule viewer is now chrome://browser/content/devtools/cssruleview.xhtml, not cssruleview.xul. Instead of adding an overlay directly to extend features of these panes, you may add an overlay and script to the outer xul document, to add load listeners and change these html documents.
  • The stack trace is now shown as a breadcrumb near the top, and the script listing is now at the left panel of the debugger.

See also

Versions

{{Firefox_for_developers}}

Revision Source

<p>Want to help document Firefox 22? See the <a href="http://beta.elchi3.de/doctracker/#list=fx&amp;version=22.0">list of bugs that need to be written about</a> and pitch in!</p>
<h2 id="Changes_for_Web_developers">Changes for Web developers</h2>
<h3 id="HTML">HTML</h3>
<ul>
  <li>The HTML5 {{HTMLElement("data")}} element has been implemented ({{bug(839371)}}).</li>
  <li>The <code>range</code> state of the {{HTMLElement("input")}} element (<code>&lt;input type="range"&gt;</code>) has been implemented, behind the preference <code>dom.experimental_forms_range</code>, only enabled by default on Nightly and Aurora channel ({{bug(841948)}}).</li>
  <li>The support for the {{HTMLElement("template")}} element, part of the Web component specification has been implemented ({{bug(818976)}}).</li>
</ul>
<h3 id="JavaScript">JavaScript</h3>
<ul>
  <li><a href="http://asmjs.org/spec/latest/" title="http://asmjs.org/spec/latest/">Asm.js </a>optimizations are enabled, making it possible to compile C/C++ applications to a subset of Javascript for better performance.</li>
  <li>ES6 <a href="/en-US/docs/JavaScript/Reference/arrow_functions" title="/en-US/docs/JavaScript/Reference/arrow_functions">Arrow Function</a> syntax has been implemented ({{bug(846406)}}).</li>
  <li>The new <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is">Object.is</a> function has been added ({{bug(839979)}}).</li>
</ul>
<h3 id="DOM">DOM</h3>
<ul>
  <li>Support for the <code>multipart</code> property on <code>XMLHttpRequest</code> and <code>multipart/x-mixed-replace</code> responses in <code>XMLHttpRequest</code> has been removed. This was a Gecko-only feature that was never standardized. <a href="/en-US/docs/Server-sent_events" title="Server-sent_events">Server-Sent Events</a>, <a href="/en-US/docs/WebSockets" title="WebSockets">Web Sockets</a> or inspecting <code>responseText</code> from progress events can be used instead.</li>
  <li>Support for <a href="/en-US/docs/WebAPI/Using_Web_Notifications" title="/en-US/docs/WebAPI/Using_Web_Notifications">Web Notifications</a> has been landed ({{bug(782211)}}).</li>
  <li>The {{domxref("FormData")}}&nbsp; <code>append</code> method now accepts a third optional <code>filename</code> parameter ({{bug(690659)}}).</li>
  <li>{{domxref("Node.isSupported")}} has been removed ({{bug(801562)}}).</li>
  <li>{{domxref("Node.setUserData")}} and {{domxref("Node.getUserData")}} has been removed for web content and are deprecated for chrome content ({{bug(842372)}}).</li>
  <li>The {{domxref("Element.attributes")}} property has been moved there from {{domxref("Node")}} as required by the spec ({{bug("844134")}}).</li>
  <li>The Mac OS X backend for {{domxref("DeviceLightEvent", "Ambient Light Events")}} has been implemented.</li>
  <li>Elements in the HTML namespace with local names {{HTMLElement("bgsound")}}, {{HTMLElement("multicol")}}, and {{HTMLElement("image")}} no longer implement the {{domxref("HTMLSpanElement")}} interface.&nbsp; {{HTMLElement("bgsound")}} and {{HTMLElement("bgsound")}} implement {{domxref("HTMLUnknownElement")}} and {{HTMLElement("image")}} implements {{domxref("HTMLElement")}}.</li>
  <li>The {{ domxref("NodeIterator.detach") }} method has been changed to do nothing ({{bug("823549")}}).</li>
  <li>The {{domxref("BlobEvent")}} interface has been implemented ({{bug("834165")}}).</li>
  <li>The properties <code>HTMLMediaElement.crossorigin</code> and <code>HTMLInputElement.inputmode</code> has been removed to match the spec in {{domxref("HTMLMediaElement.crossOrigin")}} and <code>HTMLInputElement.inputMode</code>, respectively ({{bug("847370")}} and {{bug("850346")}}).</li>
  <li>WebRTC: the Media Stream API and Peer Connection API are now supported by default.</li>
  <li>Web Components: the {{domxref("Document.register")}} method has been implemented ({{bug("783129")}}).</li>
  <li>The {{domxref("ProgressEvent.initProgressEvent()")}} constructor method has been removed. Uses the standard constructor, {{domxref("ProgressEvent.ProgressEvent", "ProgressEvent()")}} to construc and initialize {{domxref("ProgressEvent")}} ({{bug("843489")}}).</li>
  <li>Manipulated data associated with a {{event("cut")}}, {{event("copy")}}, or {{event("paste")}} event can now be accessed via the {{domxref("ClipboardEvent.clipboardData")}} property ({{bug("407983")}}).</li>
</ul>
<h3 id="CSS">CSS</h3>
<ul>
  <li>Support for <a href="/en-US/docs/CSS/Tutorials/Using_CSS_flexible_boxes" title="CSS/Tutorials/Using_CSS_flexible_boxes">CSS Flexbox layout</a> has been enabled by default ({{bug("841876")}}).</li>
  <li>Following a spec change, the initial value for {{cssxref("min-width")}} and {{cssxref("min-height")}} has been changed back to <code>0</code>, even on flex items ({{bug("848539")}}).</li>
  <li>Support for CSS Conditionals ({{cssxref("@supports")}} and {{domxref("CSS.supports")}}) has been enabled by default ({{bug("855455")}}).</li>
  <li>Support for {{cssxref("background-clip")}} and {{cssxref("background-origin")}} properties in the {{cssxref("background")}} shorthand has been implemented ({{bug("570896")}}).</li>
</ul>
<h2 id="Changes_for_add-on_and_Mozilla_developers">Changes for add-on and Mozilla developers</h2>
<ul>
  <li>The <code>properties</code> parameter has been removed from the {{ifmethod('nsITreeView','getCellProperties')}}, {{ifmethod('nsITreeView','getColumnProperties')}} and {{ifmethod('nsITreeView','getRowProperties')}} methods of {{interface('nsITreeView')}}. These methods should now return a string of space-separated property names. ({{bug('407956')}})</li>
  <li>The {{ifmethod('inIDOMUtils', 'getCSSPropertyNames')}} method has been implemented and will return all supported <a href="/en-US/docs/CSS/CSS_Reference" title="/en-US/docs/CSS/CSS_Reference">CSS property</a> names.</li>
  <li>See <a href="https://blog.mozilla.org/addons/2013/06/03/compatibility-for-firefox-22/" title="https://blog.mozilla.org/addons/2013/06/03/compatibility-for-firefox-22/">here </a>for more changes.</li>
</ul>
<h3 id="Firefox_Developer_Tools">Firefox Developer Tools</h3>
<ul>
  <li><a href="https://hacks.mozilla.org/2013/04/developer-tools-update-firefox-22/" title="https://hacks.mozilla.org/2013/04/developer-tools-update-firefox-22/">Font inspector</a> shows which fonts on your computer are applied to the page.</li>
  <li>Visual paint feedback mode shows when and where a page is repainted.</li>
  <li>The dev tools may now be docked to the right side, not just the bottom of the browser.</li>
  <li>Some panes within the dev tools have switched from <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=875727" title="https://bugzilla.mozilla.org/show_bug.cgi?id=875727">XUL to HTML</a>. For example, the css rule viewer is now chrome://browser/content/devtools/cssruleview.xhtml, not <span class="comment-copy"><code>cssruleview.xul</code></span>. Instead of adding an overlay directly to extend features of these panes, you may add an overlay and script to the outer xul document, to add load listeners and change these html documents.</li>
  <li>The stack trace is now shown as a breadcrumb near the top, and the script listing is now at the left panel of the debugger.</li>
</ul>
<h2 id="See_also">See also</h2>
<ul>
  <li><a href="http://www.mozilla.org/en-US/firefox/22.0beta/releasenotes/">Firefox&nbsp;22 Beta Release Notes</a></li>
  <li><a href="/en-US/docs/Site_Compatibility_for_Firefox_22">Site Compatibility for Firefox&nbsp;22</a></li>
  <li><a href="https://blog.mozilla.org/addons/2013/06/03/compatibility-for-firefox-22/">Add-on Compatibility for Firefox&nbsp;22</a></li>
</ul>
<h3 id="Versions">Versions</h3>
<div>
  {{Firefox_for_developers}}</div>
Revert to this revision