A collapsed Firefox tab group is hovered, showing a dropdown listing three tabs in a group labeled “Firefox stuff!” The results include “Download Firefox for Desktop — from Mozilla,” “Firefox browser features — Firefox” (currently open), and “Firefox - Wikipedia.”
Categories: News

Getting Better Every Day – These Weeks in Firefox: Issue 192

Highlights

  • Collapsed tab group hover preview is going live in Firefox 145!
    • A collapsed Firefox tab group is hovered, showing a dropdown listing three tabs in a group labeled “Firefox stuff!” The results include “Download Firefox for Desktop — from Mozilla,” “Firefox browser features — Firefox” (currently open), and “Firefox - Wikipedia.”
  • Nicolas Chevobbe added a feature that collapses unreferenced CSS variables declarations in the Rules view (#1719461)
    • The Firefox Developer Tools Style Rules view showing a list of CSS rules applied from multiple stylesheets, including activity-stream.css, tokens-brand.css, and tokens-shared.css. Each rule is shown with its selector, and links to the line numbers in their respective stylesheets. Some rules include expandable boxes with messages similar to “Show 45 unused custom CSS properties,” indicating detection of unused variables or properties.
  • Alexandre Poirot [:ochameau] added a setting to enable automatic pretty printing in the Debugger (#1994128)
    • The Firefox Developer Tools Debugger settings menu is expanded. The settings gear icon is selected, displaying options such as “Disable JavaScript,” “Inline Variable Preview,” “Wrap Lines,” “Source Maps,” “Hide Ignored Sources,” “Ignore Known Third-party Scripts,” “Show paused overlay,” and “Automatic pretty printing,” with several options checked, and the last one hovered. A tooltip at the bottom says, “All sources in the debugger will be automatically pretty printed.”
  • Improved performance on pages making heavy usage of CSS variables
    • A table comparing performance improvements in selecting the body element across four websites. The table has three columns: “Before (ms),” “After (ms),” and “%.” For hh.ru, the time improved from 3000 ms to 400 ms (−86.67%). For pinterest, 640 ms to 140 ms (−78.13%). For bulma, 820 ms to 250 ms (−69.51%). For youtube, 250 ms to 100 ms (−60%). All percentage improvements are shown in bold. The header row is shaded blue, and the first column cells are shaded green.
  • Jared H added a “copy this profile” button to the app menu (bug 1992199)
    • The Firefox profile management menu with three options: “New profile” with a plus icon, “Copy this profile” with a duplicate icon (hovered), and “Manage profiles.”

Friends of the Firefox team

Resolved bugs (excluding employees)

Volunteers that fixed more than one bug

  • Khalid AlHaddad
  • Kyler Riggs [:kylr]

New contributors (🌟 = first patch)

  • Alex Stout
  • Khalid AlHaddad
  • Jim Gong
  • Mason Abbruzzese
  • PhuongNam
  • Thomas J Faughnan Jr
  • Mingyuan Zhao [:MagentaManifold]

Project Updates

Add-ons / Web Extensions

WebExtensions Framework
  • Fixed an issue that was preventing dynamic import from resolving moz-extensions ES modules when called from content scripts attached to sandboxed sub frames – Bug 1988419
    • Thanks to Yoshi Cheng-Hao Huang from the Spidermonkey Team for looking into and fixing this issue hitting dynamic imports usage from content scripts
Addon Manager & about:addons
  • As a followup to the work to improve the extensions button panel’s empty states, starting from Nightly 146 Firefox Desktop will be showing a message bar notice in both the extensions button panel and about:addons to highlight to the users when Firefox is running in Troubleshoot mode (also known as Safe mode) and all add-ons are expected to be disabled, along with a “Learn more link” pointing the user to the SUMO page describing Troubleshoot mode in more details – Bug 1992983 / Bug 1994074 / Bug 1727828
    • Firefox Extensions panel showing a message stating, “All extensions have been disabled by Troubleshoot Mode.” Below the message is an illustration of a fox peeking through a cityscape made of puzzle pieces. A message beneath the image says, “You have extensions installed, but not enabled. Select ‘Manage extensions’ to manage them in settings.” A “Manage extensions” link is displayed at the bottom.

DevTools

WebDriver

Lint, Docs and Workflow

  • ESLint
    • We are working on rolling out automatically fixable JSDoc rules across the whole tree. The aim being to reduce the amount of disabled rules in roll-outs, and make it simpler for enabling JSDDoc rules on new areas.
      • jsdoc/no-bad-blocks has now been enabled.
        • jsdoc comments are required to have two stars at the start, this will raise an issue if it looks like it should be a jsdoc comment (e.g. has an @ symbol) but only one star.
      • jsdoc/multiline-blocks has also been enabled.
        • This is being used mainly for layout consistency of multi-line comments, so that the text of the comment does not start on the first line, nor ends on the last line. This also helps with automatically fixing other rules.
  • StyleLint

Migration Improvements

New Tab Page

Performance Tools (aka Firefox Profiler)

  • Marker tooltips now have a ‘filter’ button to quickly filter the marker chart to similar markers:

Profile Management

  • Profiles is rolling out to all non-win10 users in 144, looking healthy so far
  • Niklas refactored the BackupService to support using it to copy profiles (bug 1992203)
  • Jared H added per-profile desktop shortcuts on Windows (bug 1958955), available via a toggle on the about:editprofile page
  • Dave fixed an intermittent test crash in debug builds (bug 1994849) caused by a race between deleting a directory and attempting to open a lock file. nsProfileLock::LockWithFcntl now returns a warning instead of an error in this case.

Search and Navigation

Storybook/Reusable Components/Acorn Design System

  • <moz-message-bar> now supports arbitrary content with slot=”message” elements
    • Ideally this is still something short, like a message as opposed to inputs, etc
    • <moz-message-bar><span slot=”message” data-l10n-id=”my-message”><a data-l10n-name=”link”></a></span></moz-message-bar>
    • Note: if you’re using Lit, @click listeners etc set on Fluent elements (data-l10n-name) won’t work, you’ll need to attach it to the data-l10n-id element or another parent

No comments yet

Post a comment

Leave a Reply

Your email address will not be published. Required fields are marked *