Readable flows are currently enabled by default, allowing programmers to process data chunk by chunk as it happens over the system, e.g. in the fetch() request.

Note: The steps() purpose was formerly called frames(), but a few details changed, along with also the CSS Working Group decided to rename it to something less confusing.
Animation: move-across 2s unlimited alternate steps(5, jump-end);

CSS environment factors are now supported, obtained via env() in stylesheets. These factors are usable in almost any part of a property value or descriptor, and are scoped internationally to a particular record, whereas tradition houses are scoped to the element(s) they’re declared on. These were initially supplied by the iOS browser to permit developers to place their material in a secure area of the viewport, i.e., from the region covered by the notch.
As an Example, to stop a page break occurring in a list or paragraph:

Advanced color contrast ratio

ol, ul, p

break-inside: avoid;

JavaScript/APIs

At Mozilla, we believe that new features of this web platform are often best understood with the support of intuitive, visual tools. That’s why our DevTools staff has spent getting feedback from the area, and assigning innovative new tooling to permit internet devs and designers to inspect, edit, comprehend, and tinker with UI attributes. This drive Resulted in the launch of this CSS Grid Inspector, Font Editor, and Shape Path Editor.

Fracture -* properties

We have included an innovative color contrast ratio screen. While using the Accessibility Inspector’s accessibility picker, hovering over the text content of an element displays its color contrast ratio, even if its background is complicated (for instance a gradient or detailed image), in which case it shows a range of color contrast values, together with a WCAG rating.
It is possible to use the Swing image > element on your HTML to offer both WebP and traditional image formats, which makes the final choice to the user’s browser. You can also find WebP support on the server-side and function images as appropriate, as encouraged browsers send an Accept: image/webp header when requesting images.
Padding:
    env(safe-area-inset-top, 20px)
    env(safe-area-inset-right, 20px)
    env(safe-area-inset-bottom, 20px)
    env(safe-area-inset-left, 20px);

steps() animation timing function

|}

  • When displaying stack traces (e.g. in console logs or with the JavaScript debugger), calls to frame methods are identified and dropped by default, making it easier to home in on your code.
  • In the same manner as native terminals, you can now use reverse lookup to find entries in your JavaScript console (F9 (Windows/Linux) or Ctrl + R (macOS) and form a search phrase, followed by Ctrl + R/Ctrl + S to toggle through outcomes ).
  • The JavaScript console’s $0 dictionary (references the now inspected element on the page) now has autocomplete accessible, so for example you could sort $0. Te to acquire a suggestion of $0. TextContent to mention text content.

Learn more

CSS platform enhancements

When you’re done tweaking your site’s interface using these programs, our newest Changes panel monitors and summarizes all of the CSS alterations you’ve made during the present session, so you can work out what you did to correct a specific issue, and also can copy and paste your fixes back out to your code editor.

  • Support for Handoff involving iOS and macOS devices is now available.
  • Preferences for articles blocking have been completely redesigned to give people greater and more obvious control on how Firefox protects them in third-party tracking.
  • The about:functionality dashboard now reports that the memory used by tabs and extensions.
  • WebSockets have been executed over HTTP/2.
  • Finally, for Windows administrators, Firefox is currently available as an MSI package in addition to a classic self-extracting EXE.

WebExtensions improvements

Firefox 65 features several DevTools improvements. The highlights are as follows: