1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
|
---
title: Firefox 47 for developers
slug: Mozilla/Firefox/เปิดผนึก/47
translation_of: Mozilla/Firefox/Releases/47
---
<div>{{FirefoxSidebar}}</div><p><a href="https://www.mozilla.org/firefox/developer/" style="float: right; margin-bottom: 20px; padding: 10px; text-align: center; border-radius: 4px; display: inline-block; background-color: #81BC2E; white-space: nowrap; color: white; text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.25); box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.2), 0px -1px 0px 0px rgba(0, 0, 0, 0.3) inset;">To test the latest developer features of Firefox,<br>
install Firefox Developer Edition</a>Firefox 47 was released on June 6, 2016. 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>
<ul>
<li><a href="https://developer.mozilla.org/en-US/docs/Browser_detection_using_the_user_agent">User-agent spoofing</a> from the <a href="https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_Mode">Responsive mode</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/Memory/Dominators_view#Retaining_Paths_panel">Retaining paths panel</a> in memory tool</li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorker">Service workers</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/API/Push_API">Push API</a> debugging
<ul>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/about:debugging">about:debugging</a> dashboard for workers</li>
<li>Cached requests are now shown in <a href="https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor">Network Monitor</a></li>
<li>Support for <a href="https://developer.mozilla.org/en-US/docs/Web/API/Cache">cache storage</a> in <a href="https://developer.mozilla.org/en-US/docs/Tools/Storage_Inspector">Storage Inspector</a></li>
</ul>
</li>
<li>Ability to filter <a href="https://developer.mozilla.org/en-US/docs/Tools/Storage_Inspector">Storage Inspector</a> entries</li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/Web_Console">Console</a> now detects incomplete input and switches multi-line mode</li>
<li>Updated breakpoint style in <a href="https://developer.mozilla.org/en-US/docs/Tools/Debugger">Debugger</a></li>
<li>Prevent panels from hiding automatically using the <a href="https://developer.mozilla.org/en-US/docs/Tools/Browser_Toolbox">Browser Toolbox</a>, to aid browser and add-on debugging</li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/UI_Tour#Fonts_view">Font inspector</a> has been disabled by default</li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/3D_View">3D view</a> has been removed</li>
<li>Developer tools theme refresh</li>
<li>Disable the Font Panel ({{bug(1247723)}}).</li>
</ul>
<h3 id="HTML">HTML</h3>
<p><em>No change.</em></p>
<h3 id="CSS">CSS</h3>
<ul>
<li>Support for the {{cssxref("::backdrop")}} pseudo-element has been added ({{bug(1064843)}}).</li>
<li>The case-insensitive modifier <code>i</code> (like in <code>[foo=bar i]</code>) for <a href="/en-US/docs/Web/CSS/Attribute_selectors">attribute selectors</a> has been implemented ({{bug(888190)}}).</li>
<li>An experimental implementation of CSS Mask Image properties landed. For the moment, this will only be available on Nightly versions of Firefox.y: shorthand version of {{cssxref("mask")}}, as well as {{cssxref("mask-repeat")}}, {{cssxref("mask-position")}}, {{cssxref("mask-size")}} are now available ({{bug(686281)}}).</li>
<li>The {{cssxref("clip-path")}} property now experimentally supports <code>polygon()</code>, <code>ellipse()</code>, and <code>circle()</code> on HTML elements (does not support <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1246762">inset()</a> and <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1246764">path()</a>), behind the pref <code>layout.css.clip-path-shapes.enabled</code> that defaults to <code>false</code> ({{bug(1075457)}}). Interpolation (and therefore animation) of these values is not yet supported.</li>
<li>Our still experimental grid implementation has been updated:
<ul>
<li>{{cssxref("align-content")}}: <code>normal</code> behaves now as <code>stretch</code> for grid containers ({{bug(1237754)}}).</li>
<li>The order of column/row values for {{cssxref('grid')}}, {{cssxref('grid-template')}}, and {{cssxref('grid-gap')}} properties has been swapped ({{bug(1251999)}}).</li>
</ul>
</li>
<li>The {{cssxref("@media/display-mode", "display-mode")}} media feature is now supported ({{bug("1104916")}}).</li>
<li>The value <code>true</code> of {{cssxref("text-align")}} and {{cssxref("text-align-last")}} has been renamed to <code>unsafe</code> ({{bug("1250342")}}).</li>
</ul>
<h3 id="JavaScript">JavaScript</h3>
<ul>
<li>The new ES2017 {{jsxref("Object.values()")}} and {{jsxref("Object.entries()")}} methods have been implemented ({{bug(1232639)}}).</li>
<li>The deprecated <a href="/en-US/docs/Archive/Web/Old_Proxy_API">old Proxy API</a> (<code>Proxy.create</code> and <code>Proxy.createFunction</code>) now presents a deprecation warning in the console and will be removed in a future version. Use the standard {{jsxref("Proxy")}} object instead ({{bug(892903)}}).</li>
<li>Support for the deprecated non-standard <code>flags</code> argument of <code>String.prototype.</code>{{jsxref("String.prototype.match", "match")}}/{{jsxref("String.prototype.search", "search")}}/{{jsxref("String.prototype.replace", "replace")}} has been dropped in non-release builds ({{bug(1245801)}}).</li>
<li>As per the new ES2016 specification, the {{jsxref("Proxy")}} <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/enumerate">enumerate</a> trap for <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></code> statements has been removed ({{bug(1246318)}}).</li>
<li>The {{jsxref("Array.prototype.indexOf()")}} and {{jsxref("Array.prototype.lastIndexOf()")}} methods (and their {{jsxref("TypedArray")}} equivalents) have been updated to never return <code>-0</code> as per the ECMAScript specification ({{bug(1242043)}}).</li>
</ul>
<h3 id="InterfacesAPIsDOM">Interfaces/APIs/DOM</h3>
<h4 id="DOM_HTML_DOM">DOM & HTML DOM</h4>
<ul>
<li>The property {{domxref("Document.scrollingElement")}} has been implemented behind the pref <code>dom.document.scrollingElement.enabled</code> that defaults to <code>false</code> ({{bug(1153322)}}).</li>
</ul>
<h4 id="WebGL">WebGL</h4>
<p><em>No change.</em></p>
<h4 id="IndexedDB">IndexedDB</h4>
<ul>
<li>The {{domxref("IDBKeyRange.includes()")}} method has been implemented ({{bug("1251498")}}).</li>
</ul>
<h4 id="Service_Worker_and_related_APIs">Service Worker and related APIs</h4>
<ul>
<li>The {{domxref("Request.Request()")}} constructor can now accept a referrer option in its init object ({{bug(1251448)}}).</li>
<li>The {{domxref("Request.referrerPolicy")}} property is now supported ({{bug(1251872)}}).</li>
<li>
<p><a href="/en-US/docs/Web/API/Service_Worker_API">Service workers</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/API/Push_API">Push</a> have been disabled in the <a class="external external-icon" href="https://www.mozilla.org/en-US/firefox/organizations/">Firefox 45 Extended Support Release</a> (ESR) ({{bug(1232029)}}).</p>
</li>
</ul>
<h4 id="WebRTC">WebRTC</h4>
<ul>
<li>Support for the {{domxref("RTCIceServer")}} dictionary has been updated in keeping with revisions to the WebGL 1.0 specification by adding support for the {{domxref("RTCIceServer.credentialType", "credentialType")}} property. This property is a string which specifies whether the credential is a password or a token. Currently, Firefox only supports <code>"password"</code>.</li>
</ul>
<h4 id="New_APIs">New APIs</h4>
<p><em>No change.</em></p>
<h4 id="Others">Others</h4>
<ul>
<li>{{domxref("Cache.add()")}} and {{domxref("Cache.addAll()")}} now raises a <code>TypeError</code> exception if the response status is not in the <code>200</code> range ({{bug(1244764)}}).</li>
<li>The <a href="/en-US/docs/Mozilla/Firefox_OS/API/App_installation_and_management_APIs">App installation and management APIs</a> (<code>navigator.mozApps.*</code>) are no longer exposed to non-Firefox OS platforms ({{bug("1238576")}}).</li>
<li><a href="/en-US/docs/Web/API/Web_Crypto_API">Web Crypto API</a> methods can now use the RSA-PSS cryptographic algorithm ({{bug (1191936)}}).</li>
<li>The <a href="/en-US/docs/Web/API/Permissions_API">Permissions API</a> has had the {{domxref("Permissions.revoke()")}} method added ({{bug("1197461")}}).</li>
<li>The <a href="/en-US/docs/Web/API/Browser_API">Browser API</a>, which extends the functionality of {{htmlelement("iframe")}}s to allow the creation of frames for displaying web content using HTML — and was previously only available in Firefox OS — is now available to desktop chrome code too ({{bug(1238160)}}).</li>
<li>The <a href="/en-US/docs/Web/API/notification">Notification API</a>'s {{domxref("Notification.requestPermission()","requestPermission()")}} method has been updated from a callback to a promised-based syntax ({{bug(1241278)}}).</li>
<li>The <a href="/en-US/docs/Web/API/Fullscreen_API">Fullscreen API</a> has been updated to the latest spec and unprefixed. Some methods have been renamed or have seen their capitalization changed ({{bug(743198)}}). Note that this is behind the <code>full-screen-api.unprefix.enabled</code> preference, defaulting to false ({{bug(1268749)}}).</li>
</ul>
<h3 id="AudioVideo">Audio/Video</h3>
<ul>
<li>Now WAV file with u-law compression encoding can be played({{bug(851530)}}).</li>
<li><a href="https://www.widevine.com/">Widevine</a> Content Decryption Module provided by Google Inc. is available via the <a href="/en-US/docs/Web/API/Encrypted_Media_Extensions_API">Encrypted Media Extensions API</a> for use with MP4 (only; see {{bug(1257716)}} for EME-with-WebM support) on Windows Vista and later and on Mac OS X enabling migration off Silverlight ({{bug(1265270)}}).</li>
</ul>
<h2 id="HTTP">HTTP</h2>
<ul>
<li>The default value of the {{HTTPHeader("Accept")}} header for images is now <code>*/*</code> instead of <code>image/png,image/*;q=0.8,*/*;q=0.5</code> ({{bug(1249474)}}).</li>
</ul>
<h2 id="Networking">Networking</h2>
<p><em>No change.</em></p>
<h2 id="Security">Security</h2>
<ul>
<li>URL with the <code>view-source:</code> protocol don't open the <a href="/en-US/docs/Tools/View_source">View Source</a> tool anymore when used from a Web page ({{bug(1172165)}}).</li>
<li>The Firefox <a href="https://blog.mozilla.org/futurereleases/2013/09/24/plugin-activation-in-firefox/">click-to-activate plugin whitelist</a> has been removed: only Flash doesn't need to be clicked to be activated ({{bug(1263630)}}).</li>
</ul>
<h2 id="Changes_for_add-on_and_Mozilla_developers">Changes for add-on and Mozilla developers</h2>
<h3 id="Interfaces">Interfaces</h3>
<ul>
<li>The CSS tokenizer is now available in JavaScript for add-ons ({{bug(1152033)}}).</li>
</ul>
<h3 id="FUEL">FUEL</h3>
<p>The <a href="/en-US/docs/Mozilla/Tech/Toolkit_API/FUEL">FUEL</a> JavaScript library, introduced back in Firefox 3, <strong>has been removed</strong>. This library was designed to aid in add-on development and with the introduction of the <a href="/en-US/docs/Mozilla/Add-ons/SDK">Add-on SDK</a> and, now, by <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions">WebExtensions</a> support, is no longer useful. ({{bug(1090880)}})</p>
<h3 id="XUL">XUL</h3>
<p><em>No change.</em></p>
<h3 id="JavaScript_code_modules">JavaScript code modules</h3>
<p><em>No change.</em></p>
<h3 id="XPCOM">XPCOM</h3>
<p><em>No change.</em></p>
<h3 id="Other">Other</h3>
<p><em>No change.</em></p>
<h2 id="See_also">See also</h2>
<ul>
<li><a href="https://www.fxsitecompat.com/en-US/versions/47">Site Compatibility for Firefox 47</a></li>
</ul>
<h2 id="Older_versions">Older versions</h2>
<p>{{Firefox_for_developers(46)}}</p>
|
