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
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
|
---
title: Firefox 41 for developers
slug: Mozilla/Firefox/Releases/41
tags:
- Firefox
- Firefox 41
translation_of: Mozilla/Firefox/Releases/41
---
<div>{{FirefoxSidebar}}</div><div class="column-container zone-callout"><a 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;" href="https://nightly.mozilla.org/">To test the latest developer features of Firefox,<br>
install Firefox Developer Edition</a> Firefox 41 was released on September 22, 2015. 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.</div>
<h2 id="Changes_for_Web_developers">Changes for Web developers</h2>
<h3 id="开发工具">开发工具</h3>
<p>Highlights:</p>
<ul>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#Element_popup_menu">Take a screenshot of a DOM node</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor#CopySave_All_As_HAR">Copy as HAR/save as HAR</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS#Add_rules">"Add Rule" button in the Rules view</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/View_source">View source in a tab</a> (Disabled by default)</li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS#Copy_rules">More options to copy CSS rules</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/View_background_images">Copy image as data: URI in the Rules view</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Tools/GCLI/Display_security_information">Added command to GCLI to display CSP info</a></li>
</ul>
<p><a href="https://bugzilla.mozilla.org/buglist.cgi?resolution=FIXED&classification=Client%20Software&chfieldto=2015-06-29&query_format=advanced&chfield=resolution&chfieldfrom=2015-05-11&chfieldvalue=FIXED&bug_status=RESOLVED&bug_status=VERIFIED&component=Developer%20Tools&component=Developer%20Tools%3A%203D%20View&component=Developer%20Tools%3A%20Canvas%20Debugger&component=Developer%20Tools%3A%20Console&component=Developer%20Tools%3A%20Debugger&component=Developer%20Tools%3A%20Framework&component=Developer%20Tools%3A%20Graphic%20Commandline%20and%20Toolbar&component=Developer%20Tools%3A%20Inspector&component=Developer%20Tools%3A%20Memory&component=Developer%20Tools%3A%20Netmonitor&component=Developer%20Tools%3A%20Object%20Inspector&component=Developer%20Tools%3A%20Performance%20Tools%20%28Profiler%2FTimeline%29&component=Developer%20Tools%3A%20Responsive%20Mode&component=Developer%20Tools%3A%20Scratchpad&component=Developer%20Tools%3A%20Source%20Editor&component=Developer%20Tools%3A%20Storage%20Inspector&component=Developer%20Tools%3A%20Style%20Editor&component=Developer%20Tools%3A%20User%20Stories&component=Developer%20Tools%3A%20Web%20Audio%20Editor&component=Developer%20Tools%3A%20WebGL%20Shader%20Editor&component=Developer%20Tools%3A%20WebIDE&product=Firefox&list_id=12283503">All devtools bugs fixed between Firefox 40 and Firefox 41</a>: note that many of these bugs, especially those relating to the performance tools, were uplifted to Firefox 40.</p>
<h3 id="CSS">CSS</h3>
<ul>
<li>Support for laying out vertical scripts has been activated by default ({{bug(1138384)}}). That means that the following CSS properties are now available:
<ul>
<li>Choosing the direction of writing: {{cssxref("writing-mode")}}.</li>
<li>Controlling orientation of characters: {{cssxref("text-orientation")}}.</li>
<li>Direction-independent equivalents of {{cssxref("width")}} and {{cssxref("height")}}: {{cssxref("block-size")}} and {{cssxref("inline-size")}}.</li>
<li>Direction-independent equivalents of {{cssxref("min-width")}} and {{cssxref("min-height")}}: {{cssxref("min-block-size")}} and {{cssxref("min-inline-size")}}.</li>
<li>Direction-independent equivalents of {{cssxref("max-width")}} and {{cssxref("max-height")}}: {{cssxref("max-block-size")}} and {{cssxref("max-block-size")}}.</li>
<li>Direction-independent equivalents of {{cssxref("margin-top")}}, {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}} and {{cssxref("margin-left")}}: {{cssxref("margin-block-start")}}, {{cssxref("margin-block-end")}}, {{cssxref("margin-inline-start")}} and {{cssxref("margin-inline-end")}}.</li>
<li>Direction-independent equivalents of {{cssxref("padding-top")}}, {{cssxref("padding-right")}}, {{cssxref("padding-bottom")}} and {{cssxref("padding-left")}}: {{cssxref("padding-block-start")}}, {{cssxref("padding-block-end")}}, {{cssxref("padding-inline-start")}} and {{cssxref("padding-inline-end")}}.</li>
<li>Direction-independent equivalents of {{cssxref("border-top")}}, {{cssxref("border-right")}}, {{cssxref("border-bottom")}} and {{cssxref("border-left")}} and their longhands for width, style and color: {{cssxref("border-block-start")}}, {{cssxref("border-block-start-width")}}, {{cssxref("border-block-start-style")}}, {{cssxref("border-block-start-color")}}, {{cssxref("border-block-end")}}, {{cssxref("border-block-end-width")}}, {{cssxref("border-block-end-style")}}, {{cssxref("border-block-end-color")}}, {{cssxref("border-inline-start")}}, {{cssxref("border-inline-start-width")}}, {{cssxref("border-inline-start-style")}}, {{cssxref("border-inline-start-color")}}, {{cssxref("border-inline-end")}}, {{cssxref("border-inline-end-width")}}, {{cssxref("border-inline-end-style")}} and {{cssxref("border-inline-end-color")}}.</li>
<li>Direction-independent equivalents of {{cssxref("top")}}, {{cssxref("right")}}, {{cssxref("bottom")}} and {{cssxref("left")}}: {{cssxref("offset-block-start")}}, {{cssxref("offset-block-end")}}, {{cssxref("offset-inline-start")}} and {{cssxref("offset-inline-end")}}.</li>
</ul>
</li>
<li>Support the {{cssxref("transform-origin")}} property in SVG and implement the {{cssxref("transform-box")}} property ({{bug(923193)}}).</li>
</ul>
<h3 id="HTML">HTML</h3>
<ul>
<li>{{HTMLElement("a")}} 没有 <code>href</code> 属性,并且不再被分类为交互内容. 点击 {{HTMLElement("label")}} 将会激活标签内容({{bug(1167816)}}).</li>
<li>SVG 图标现在支持站点图标(偏爱图标和快捷方式图标)({{bug(366324)}}).</li>
<li>The {{htmlattrxref('crossorigin', 'link')}} attribute is now supported for <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link"><link rel='preconnect'></a> ({{bug(1174152)}}).</li>
<li> The picture element does not react to resize/viewport changes ({{bug(1135812)}}).</li>
</ul>
<h3 id="JavaScript">JavaScript</h3>
<ul>
<li>{{jsxref("Date.prototype")}}现在是一个普通对象, 不再是一个 {{jsxref("Date")}} 实例 ({{bug(861219)}}).</li>
<li>{{jsxref("Date.prototype.toString")}} 现在是一般方法({{bug(861219)}}).</li>
<li>{{jsxref("Symbol.species")}}被增加到({{bug(1131043)}}).</li>
<li>{{jsxref("Map.@@species", "Map[@@species]")}} 和{{jsxref("Set.@@species", "Set[@@species]")}} 获取已经被增加 ({{bug(1131043)}}).</li>
<li>非标准 {{jsxref("Statements/let", "let expression", "#let_expressions", 1)}} 支持已经被废弃({{bug(1023609)}}).</li>
<li>{{jsxref("Functions/Default_parameters", "Destructured parameters with default value assignment","#Destructured_parameter_with_default_value_assignment", 1)}} 现在已经被支持 ({{bug(1018628)}}).</li>
<li>Per ES2015, <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions">方法定义</a> 需要尖括号. 从现在开始语法没有尖括号将会失败({{bug(1150855)}}).</li>
<li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions">方法定义</a> (除了生成方法) 已经不再可构造 ({{bug(1059908)}} 和{{bug(1166950)}}).</li>
<li>As part of ES2015 specification compliance, parenthesized <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">destructuring</a> patterns, like <code>([a, b]) = [1, 2]</code> or <code>({a, b}) = { a: 1, b: 2 }</code>, are now considered invalid and will throw a {{jsxref("SyntaxError")}}. See <a href="http://whereswalden.com/2015/06/20/new-changes-to-make-spidermonkeys-and-firefoxs-parsing-of-destructuring-patterns-more-spec-compliant/">Jeff Walden's blog post</a> for more details.</li>
<li>The <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new.target">new.target</a></code> syntax has been added ({{bug(1141865)}}).</li>
</ul>
<h3 id="InterfacesAPIsDOM">Interfaces/APIs/DOM</h3>
<ul>
<li>剪切、复制和粘贴命令处理已经被重新编码,并且现在允许JS编程实现网页内容复制和剪切。
<ul>
<li>使用 <code>'paste'</code>名利作为参数, {{domxref("Document.queryCommandSupported()")}}现在会返回<span style="font-family: courier,andale mono,monospace;">false如果不充分的权限被执行</span>({{bug(1161721)}}).</li>
<li>使用<code>'cut'</code> 或 <code>'copy'</code> 命令作为参数, {{domxref("Document.queryCommandSupported()")}} 现在返回<code style="font-style: normal;">true</code> 如果调用的上下文中包括用户发起的或特权代码({{bug(1162952)}}).</li>
<li>使用 <code>'cut'</code> 或<code>'copy' 命令作为参数</code>, {{domxref("Document.execCommand()")}} 将会执行, 但是仅仅在用户发起的或特权代码的上下文下({{bug(1012662)}}).</li>
</ul>
</li>
</ul>
<h4 id="Events">Events</h4>
<ul>
<li>非标准的{{domxref("CloseEvent.initCloseEvent()")}} 方法和创建 {{domxref("CloseEvent")}} 使用 {{domxref("Event.createEvent", "Event.createEvent('CloseEvent')")}} 方法已经被移除. 相反可以使用标准的构造器{{domxref("CloseEvent.CloseEvent", "CloseEvent()")}} . ({{bug(1161950)}}).</li>
<li>On Desktop, {{domxref("PointerEvent")}} is now activated by default in Nightly; it is not activated in Developer Edition, Beta or Release and won't be for at least some versions ({{bug(1166347)}}).</li>
<li>The unprefixed version of {{domxref("MouseEvent.movementX")}} and {{domxref("MouseEvent.movementY")}}}} have been added; the prefixed versions are deprecated and will be removed at some point in the future ({{bug(1164981)}}).</li>
</ul>
<h4 id="Web_Crypto">Web Crypto</h4>
<ul>
<li>{{domxref("SubtleCrypto.importKey()")}} 和{{domxref("SubtleCrypto.exportKey()")}} 现在支持 <code>ECDH</code> keys ({{bug(1050175)}}).</li>
</ul>
<h4 id="Canvas_API">Canvas API</h4>
<ul>
<li>{{domxref("HTMLCanvasElement.captureStream()")}} and {{domxref("CanvasCaptureMediaStream")}} have been added and allow to stream the display of a {{HTMLElement("canvas")}} in real-time ({{bug(1032848)}}).</li>
<li>{{domxref("MediaStream.id")}} now returns the unique id of a stream ({{bug(1089798)}}).</li>
<li>The initial value of {{domxref("CanvasRenderingContext2D.filter")}} is now correctly set to <code>none</code> ({{bug(1163124)}}).</li>
</ul>
<h4 id="Service_Workers">Service Workers</h4>
<ul>
<li>Improvement to our experimental <a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorker_API">Service Worker</a> implementation:
<ul>
<li>{{domxref("ServiceWorkerGlobalScope.skipWaiting()")}} has been implemented ({{bug(1131352)}}).</li>
<li>{{domxref("Clients.claim()")}} has been added ({{bug(1130684)}}).</li>
<li>The other functional events of Service Workers have been made to inherit from {{domxref("ExtendableEvent")}}, giving them access to the {{domxref("ExtendableEvent.waitUntil","waitUntil()")}} method ({{bug("1160527")}}).</li>
</ul>
</li>
<li>The {{domxref("CacheStorage")}} and {{domxref("Cache")}} interfaces are now supported ({{bug("1110144")}}).</li>
</ul>
<h4 id="WebGL">WebGL</h4>
<ul>
<li>The <code>failIfMajorPerformanceCaveat</code> WebGL context attribute has been added and can be set when creating a WebGL context with {{domxref("HTMLCanvasElement.getContext()")}} to indicate if a context creation should fail if the system performance is low ({{bug(1164970)}}).</li>
</ul>
<h4 id="WebRTC">WebRTC</h4>
<ul>
<li>Firefox no longer offers a default STUN server to be used if none are specified when constructing a new {{domxref("RTCPeerConnection")}}. You'll need to provide one in order to successfully establish a WebRTC connection.</li>
</ul>
<h4 id="Miscellaneous">Miscellaneous</h4>
<ul>
<li>On OS X and Windows, {{domxref("NavigatorOnLine.onLine", "Navigator.onLine")}} now changes regarding network connectivity (it always returned <code>true</code>, , unless "Work offline" mode was selected) before ({{bug(654579)}}).</li>
<li>{{domxref("MessagePort")}} and {{domxref("MessageChannel")}} now available in <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API">Web workers</a>, and are enabled by default in all contexts ({{bug(952139)}}) and ({{bug(911972)}}).</li>
<li>The User Timing API is now available in <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API">Web workers</a> ({{bug(1155761)}}).</li>
<li>The <a href="https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API">Notifications API</a> is now available in <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API">Web workers</a> ({{bug(916893)}}).</li>
<li>{{domxref("DOMRequest")}} and {{domxref("DOMCursor")}} are now available in <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API">Web workers</a> ({{bug(1167650)}}).</li>
<li>The <a href="https://developer.mozilla.org/en-US/docs/Web/API/CSSFontLoading_API">CSS Font Loading API</a> has been completely implemented and is now enabled by default ({{bug(1149381)}}).</li>
<li>Shared workers can no longer be shared between private (i.e. browsing in a private window) and non-private documents (see {{bug(1177621)}}).</li>
<li>The {{domxref("URLUtilsSearchParams.searchParams")}} property is now read-only ({{bug(1174731)}}).</li>
<li>
<p>The {{domxref('URLUtils.hash')}} property no longer decodes URL fragment ({{bug(1093611)}}).</p>
</li>
</ul>
<h3 id="MathML">MathML</h3>
<h4 id="新的默认、支持字体处理">新的默认、支持字体处理</h4>
<p>数学公式需要特殊的字体. 到目前为止, 这些字体被硬编码在用户默认样式 <code>mathml.css</code> (使用{{MathMLElement("math")}} 标志设置字体组) 和偏好选项<code>font.mathfont-family</code> (为拉伸和大操作数设置支持字体). Firefox 41 引入一个能够自动设置<span style="font-family: courier,andale mono,monospace;"><math>标志和相应偏好选项的</span>内置<code>x-math</code> 语言 (例如<code>font.name.serif.x-math</code>). 用户默认样式现在将<span style="font-family: courier,andale mono,monospace;"><math>标志字体</span>设置为serif 并且<code>font.mathfont-family</code> 被替换为 <code>font.name.serif.x-math</code>. 所有平台现在基本使用相同列表的支持字体, "Latin Modern Math" 是首选.在标准的 per-language字体偏好菜单中,默认支持字体能够被设置. 更多细节,请参照{{bug(947654)}} 和 {{bug(1160456)}}.</p>
<h3 id="SVG">SVG</h3>
<ul>
<li>站点图片(偏爱图标,快捷方式图标) 现在支持SVG({{bug(366324)}})</li>
</ul>
<h3 id="音频视频">音频/视频</h3>
<ul>
<li>The <code>media.autoplay.enabled</code> preference now also apply to untrusted {{domxref("HTMLMediaElement.play()")}} invocations too, that is calls from non-users activated scripts ({{bug(659285)}}).</li>
</ul>
<h2 id="Networking">Networking</h2>
<ul>
<li>The <code>X-Content-Duration</code> header is no longer supported ({{Bug(1160695)}}).</li>
<li>Draft versions of the HTTP/2 protocol are no more supported ({{bug(1132357)}}).</li>
</ul>
<h2 id="Security">Security</h2>
<ul>
<li>The <a href="https://developer.mozilla.org/en-US/docs/Web/Security/CSP">CSP</a> 1.1 <code>manifest-src</code> <a href="https://developer.mozilla.org/en-US/docs/Web/Security/CSP/CSP_policy_directives">directive</a> 已经被支持 ({{bug(1089255)}}).</li>
<li>Previous versions of Firefox incorrectly expected the <a href="https://developer.mozilla.org/en-US/docs/Web/Security/CSP">Content Security Policy</a> <a href="https://developer.mozilla.org/en-US/docs/Web/Security/CSP/CSP_policy_directives#referrer">referrer</a>directive's value <code>origin-when-cross-origin</code> to be spelled <code>origin-when-crossorigin</code>. This has been corrected to include the missing dash character.</li>
</ul>
<h2 id="Changes_for_add-on_and_Mozilla_developers">Changes for add-on and Mozilla developers</h2>
<h3 id="XUL">XUL</h3>
<p><em>没有变化。</em></p>
<h3 id="JavaScript_code_modules">JavaScript code modules</h3>
<p><em>没有变化。</em></p>
<h3 id="XPCOM">XPCOM</h3>
<p><em>没有变化。</em></p>
<h3 id="其他">其他</h3>
<ul>
<li>A new, internal, and chrome-context-only API to render the root widget of a window into a {{HTMLElement("canvas")}} has been added: {{domxref("CanvasRenderingContext2D.drawWidgetAsOnScreen()")}}. This API uses the operating system to snapshot the widget on-screen. For more details see {{bug(1167477)}}.</li>
</ul>
<h2 id="See_also">See also</h2>
<ul>
<li><a href="/en-US/docs/Mozilla/Firefox/Releases/41/Site_Compatibility">Site Compatibility for Firefox 41</a></li>
</ul>
<h2 id="之前版本">之前版本</h2>
<p>{{Firefox_for_developers('40')}}</p>
|