Firefox 57 (Quantum) for developers
This article provides information about the changes in Firefox 57 (a.k.a. Firefox Quantum) that will affect developers. Firefox 57 was released on November 14, 2017.
Firefox 57 === Firefox Quantum
Firefox 57 has been given the release name Quantum, after the Firefox Quantum engineering project that has aimed to rebuild Firefox from the ground up, bringing with it major performance, stability, and visual improvements. This is the first version of Firefox to ship some of these improvements, so we wanted to mark the occasion.
Note: To read more about the Quantum features in this release, see Firefox Quantum Developer Edition: the fastest Firefox ever with Photon UI and better tooling by Dan Callahan.
Firefox's new parallel CSS engine — also known as Quantum CSS or Stylo — is enabled by default in Firefox 57 for desktop, with Mobile versions of Firefox to follow later on. Developers shouldn't notice anything significantly different, aside from a whole host of performance improvements. There are however a number of minor functional differences in Stylo, implemented to fix non-standard Gecko behavior that should be eliminated. We will report on such differences on reference pages and in the release notes as appropriate (see Quantum CSS notes).
Changes for Web developers
Developer Tools
No changes.
HTML
- The date and time
<input>
types are now enabled in all builds (Firefox bug 1399036).
CSS
- The
minimal-ui
andstandalone
values of thedisplay-mode
media query are now supported (Firefox bug 1369815). See also the Web app manifestdisplay
field. - The
grid-row-gap
andgrid-column-gap
properties are no longer reset by thegrid
shorthand (Firefox bug 1387410). - The
layout.css.clip-path-shapes.enabled
preference has been removed (Firefox bug 1399767). This preference allowed disabling the<basic-shape>
support inclip-path
. This support was shipped in Firefox 54 and can no longer be disabled.
Quantum CSS notes
Following bugs have been fixed in Quantum:
- Radial gradient values like
radial-gradient(circle gold,red)
will work in the old Gecko style system, even though they shouldn't because of the missing comma betweencircle
andgold
(Firefox bug 1383323). - When you animate an offscreen element onscreen but specify a delay, Gecko does not repaint on some platforms, e.g. Windows (Firefox bug 1383239).
- In Gecko,
<details>
elements can't be made open by default using theopen
attribute if they have ananimation
active on them (Firefox bug 1382124). - In Gecko,
transitions
will not work when transitioning from atext-shadow
with a color specified to atext-shadow
without a color specified (Firefox bug 726550). - In Gecko, cancelling a filling animation (e.g. with
animation-fill-mode: forwards
set) can trigger a transition set on the same element, although only once (see Firefox bug 1192592 and these test cases for more information). In general declarative animations should not trigger transitions. - Animations using em units are not affected by changes to the
font-size
on the animated element's parent in Gecko, whereas they should be (Firefox bug 1254424). - Gecko also deals with
font-size
inheritance differently from Quantum CSS, meaning that for some language settings inherited font sizes end up being smaller than expected (see Firefox bug 1391341). - Gecko reuses the same mechanism used when parsing a url-token when parsing the
domain()
orurl-prefix()
URL matching functions for a@-moz-document
rule. Quantum CSS does not use the same mechanism and it does not consider tokens invalid when they contain brackets or quotes (Firefox bug 1362333). - In Gecko, when you set a system font as the value of a canvas 2D context's
font
(e.g.menu
), getting the font value fails to return the expected font (it returns nothing). This has been fixed in Quantum. (Firefox bug 1374885). - In Gecko, when you create a detached subtree (e.g. a
<div>
created usingcreateElement()
that is not yet inserted into the DOM), the subtree's root element is set as a block-level element. In Quantum CSS this is set as inline, as per spec (Firefox bug 1374994). - In Gecko,
calc()
expressions are rejected — causing the value to be invalid — when used as the radius component of aradial-gradient()
function (Firefox bug 1376019). - In Gecko,
calc(1*2*3)
is not parsed successfully; Quantum CSS fixes this (Firefox bug 1379467). - In Quantum CSS,
calc()
is supported everywhere that the spec explains it should be (Firefox bug 1350857). In Gecko it is not. - Gecko has a bug whereby the
::before
and::after
pseudo-elements are still generated even if thecontent
property value is set tonormal
ornone
. As per spec, they shouldn't be (Firefox bug 1387931). - Another Gecko bug means that the
background-position
property can't be transitioned between two values containing different numbers of<position>
values, for examplebackground-position: 10px 10px;
andbackground-position: 20px 20px, 30px 30px;
(see Firefox bug 1390446).
SVG
No changes.
JavaScript
- The non-standard
for each...in
(E4X) loop has been removed. Please usefor...of
instead and see Warning: JavaScript 1.6's for-each-in loops are deprecated for migration help. (Firefox bug 1083470). - The
Object.prototype.watch()
andunwatch()
methods are deprecated, will now throw a warning when used, and will be removed soon (Firefox bug 934669). - The non-standard
Iterator
andStopIteration
objects as well as the legacy iteration protocol have been removed (Firefox bug 1098412). - Async generator is now enabled (Firefox bug 1352312).
- for await (... of ...) syntax is now enabled (Firefox bug 1352312).
APIs
New APIs
- The
PerformanceObserver
API is now enabled by default (Firefox bug 1386021). - The
AbortController
andAbortSignal
interfaces (known as the Abort API) have been added, allowing DOM requests (such as fetch requests) to be aborted if desired (Firefox bug 1378342). - [2] The Storage API is implemented and enabled by default (Firefox bug 1399038).
DOM
- The
Selection.type
property of the Selection API is now implemented (Firefox bug 1359157). Document.createEvent('FocusEvent')
is now supported (Firefox bug 1388069).- The
files
property of theHTMLInputElement
interface is now settable (Firefox bug 1384030). - The
HTMLDocument.getSelection()
method has been moved to theDocument
interface so it is available to XML documents (Firefox bug 718711). - The
messageerror
event is now implemented, and can have code run in response to it firing via event handlers implemented on message targets — seeMessagePort.messageerror_event
,DedicatedWorkerGlobalScope.messageerror_event
,Worker.messageerror_event
,BroadcastChannel.messageerror_event
, andWindow.messageerror_event
(Firefox bug 1359017). - When
Headers
values are iterated over, they are automatically sorted in lexicographical order, and values from duplicate header names are combined (Firefox bug 1396848).
DOM events
No changes.
Media and WebRTC
- Support for messages of arbitrary size (up to 1GiB, although 256kiB is more interoperable) is now supported on
RTCDataChannel
through use of the end-of-record (EOR) flag on SCTP messages. See Understanding message size limits for more information (Firefox bug 979417).Note: Because Firefox doesn't yet support the SCTP ndata protocol that provides the ability to interleave SCTP messages from multiple sources, sending large data objects can cause significant delays on all other SCTP traffic. See Firefox bug 1381145 to track progress on implementing and deploying ndata support in Firefox.
- The
RTCDataChannel.send()
method can now throw aTypeError
exception if the size of the message you're trying to send is not compatible with the receiving user agent (this is implemented as part of Firefox bug 979417). - The MediaStream Recording API has been updated so that
error
events sent to report problems that occur while recording are now of typeMediaRecorderErrorEvent
rather than being generic events. - Updated the documentation around
OfflineAudioContext
since its constructor's inputs can now be specified in an object rather than as a list of parameters (Firefox bug 1388591). - The Web Audio API now properly supports multi-channel output (Firefox bug 1378070).
Security
resource://
URLs no longer leak information (Firefox bug 863246)- Data URLs are now treated as unique opaque origins, rather than inheriting the origin of the settings object responsible for the navigation (Firefox bug 1324406).
Plugins
No changes.
Other
- Firefox headless mode now includes a
-screenshot
flag that allows you to take website screenshots directly from the command line (Firefox bug 1378010).
Removals from the web platform
HTML
<link rel="preload">
(see Preloading content with rel="preload") has been disabled in Firefox 57 because of various web compatibility issues (e.g. Firefox bug 1405761). An improved version that works for non-cacheable resources is expected to land in Firefox 58.
APIs
- Mozilla's proprietary Social API has been completely removed (Firefox bug 1388902).
SVG
No changes.
Changes for add-on and Mozilla developers
Note: Starting in Firefox 57, all support for XPCOM-based add-ons has been removed. All extensions must be converted into the new browser extensions (also known as WebExtensions) or they will not work.
WebExtensions
The following APIs have been added or extended:
bookmarks
- support for separators through
bookmarks.BookmarkTreeNodeType
- support for separators through
browser_action
theme_icons
property for light/dark theme icons
browserAction
browserSettings
browsingData
clipboard
contextualIdentities
onCreated
onRemoved
onUpdated
colorCode
andiconUrl
incontextualIdentities.ContextualIdentity
devtools.panels
downloads
incognito
option indownloads.download()
estimatedEndTime
property indownloads.DownloadItem
find
pageAction.openPopup()
privacy
proxy
FindProxyForURL()
can now return an object
runtime
runtime.openOptionsPage()
support on Android
sessions
sidebarAction
storage
tabs
loadReplace
option intabs.update()
discarded
property intabs.Tab
,tabs.onUpdated
, andtabs.query()
tabs.create()
can open "view-source:" URLsopenerTabId
property intabs.Tab
,tabs.create()
,tabs.query()
, andtabs.update()
theme
colors.toolbar
colors.toolbar_field
colors.toolbar_field_text
colors.toolbar_text
theme
windowId
option totheme.update()
webRequest
filterResponseData()
proxyInfo
property inwebRequest
events
windows
allowScriptsToClose
option inwindows.create()
Older versions
- Firefox 56 for developers
- Firefox 55 for developers
- Firefox 54 for developers
- Firefox 53 for developers
- Firefox 52 for developers
- Firefox 51 for developers
- Firefox 50 for developers
- Firefox 49 for developers
- Firefox 48 for developers
- Firefox 47 for developers
- Firefox 46 for developers
- Firefox 45 for developers
- Firefox 44 for developers
- Firefox 43 for developers
- Firefox 42 for developers
- Firefox 41 for developers
- Firefox 40 for developers
- Firefox 39 for developers
- Firefox 38 for developers
- Firefox 37 for developers
- Firefox 36 for developers
- Firefox 35 for developers
- Firefox 34 for developers
- Firefox 33 for developers
- Firefox 32 for developers
- Firefox 31 for developers
- Firefox 30 for developers
- Firefox 29 for developers
- Firefox 28 for developers
- Firefox 27 for developers
- Firefox 26 for developers