Firefox DevTools Newsletter — 118 – Firefox Developer Experience

By admin
Developer Tools help developers write and debug websites on

Firefox
ORG

. This newsletter gives an overview of the work we’ve done as part of the Firefox

118
CARDINAL

Nightly release cycle.

Firefox being an open source project, we are grateful to get contributions from people outside of

Mozilla
ORG

:


Krishna Ravishankar
PERSON

made it possible to copy WebSocket binary payload to the clipboard in

the Network Monitor
ORG

(#

1578994
MONEY

)

made it possible to copy WebSocket binary payload to the clipboard in

the Network Monitor
ORG

(#

1578994
MONEY

)

Andrew de Rozario
PERSON

fixed an issue in

the Network Monitor
ORG

where form data query parameters were truncated (#

1791983
MONEY

)

fixed an issue in

the Network Monitor
ORG

where form data query parameters were truncated (#

1791983
MONEY

)

Sebastian Zartner
PERSON

improved the Inactive CSS feature so we will show warnings when empty-cells is used on elements who don’t have a table-cell display value (#

1583906
MONEY

) column-related properties are used on non-multi-column containers (#

1583912
MONEY

) ignored properties are used on ::

first
ORDINAL

-line pseudo-elements (#

1842174
MONEY

)

improved the Inactive CSS feature so we will show warnings when

Sebastian
PERSON

also revived the work from

Takeshi Kurosawa
PERSON

to add links on

ARIA
ORG

attributes referring to other elements (#

1546003
MONEY

)

Here, the ul element has an aria-labelledby attribute linking to an element whose id is references-button . Right-clicking on the attribute will offer the possibility to select the references-button element in the inspector.

Ctrl+click
PERSON

(

Cmd+click
CARDINAL

on

OSX
ORG

) on the attribute will also select the referred element.


Gregory Pappas
PERSON

removed the unused devtools.storage.test.forceLegacyActors pref (#

1847285
MONEY

)

removed the unused pref (#

1847285
MONEY

)

jackyzy823
PERSON

fixed a typo in a utility function (#

1847513
MONEY

)

Want to help? DevTools are written in HTML,

CSS
ORG

and JS so any web developer can contribute! Read how to setup the work environment and check the list of mentored issues


Better Debugger Tooltip
ORG

We refreshed the Debugger tooltip (#

1687440
MONEY

) to make it easier to understand what the hovered value actually is. This is especially useful for values for which we used to display less than ideal result, like Date instances.

Faster Inspector

In

Firefox 117
LAW

, we landed the initial support for CSS nesting. We then got a report that the inspector could be quite slow when trying to display deeply nested

CSS
ORG

rules (#

1844446
MONEY

). We managed to tame that regression (#

1845731
MONEY

) and we’re now actively monitoring the performances on such situation (#

1846947
MONEY

).

Another fixes we did for this particular issue ended making other use cases (e.g. expanding the whole element tree in the markup view) significantly faster (#1845730).

Stronger tools

This version comes with a wide variety of bug fixes:

No more hang when inspecting element on Astro.js powered pages in development mode (#

1847440
MONEY

)

Show event listener popup on click, for some specific flavor of jQuery event listeners (#

1792737
MONEY

)

Remove stylesheets from the

StyleEditor
ORG

when <style> / <link> node are removed from the

DOM
ORG

(#

1771113
MONEY

)

/ node are removed from the

DOM
ORG

(#

1771113
MONEY

) Avoid doing too many computation that would lead to browser lock-up in the Debugger on pages with many evaluated sources (#

1841573
MONEY

)…

… which also revealed some issues in the Debugger tab context menus on evaluated sources (#

1848011
MONEY

)

Ensure that the “Map scope” feature can be enabled after the Debugger paused (#

1849987
MONEY

)

Inline preview for exception in the Debugger now work when the exception occurs on the

first
ORDINAL

line of inline scripts (#

1849144
MONEY

)

Resent request are no longer blocked by

Opaque Request Blocking
ORG

(#

1824658
MONEY

)

Thank you for reading this and using our tools, see you

next month
DATE

for a new round of exciting updates 🙂