DevTools: Rendered fonts overlap properties list

A11yCat

I just noticed this today after installing 5.4.2753.33 stable, but it may have been present for a while.

The "Computed" tab in the developer tools normally shows the rendered fonts information at the bottom. Now it appears just below the search field and overlaps the first few items in the properties list.

This makes the search feature almost useless. Applying a filter to reduce the number of properties listed means the actual results become hidden by the Rendered fonts info.

Is this a known bug, or should I report it?

Screenshot:

DoctorG

@A11yCat Any URL where i can see such info with the rendered font Consolas?
Is that attached dev tools (where: down, left, right) or a dev tools window?

//EDIT: Ah, i can reproduce at apple.com.

I will report the issue to Vivaldi bug tracker.
VB-91038 "[DevTools] information for Rendered Font overlaps other text"

A11yCat

The screenshot was from an application under development on my localhost, but it shouldn't matter what font face is used.

I tested it on this forum page, and the same problem occurs (the rendered font was Segoe UI on the span element iI selected).

I think you need to select an element in the Elements pane, or no rendered font information is displayed in the Computed tab.

The dev tools is attached (down).

DoctorG

@A11yCat Good find

A11yCat

@DoctorG Thank you kindly!

DoctorG

Oh, same on Chromium 104.0.5112.81.
~~I will test Chromium 105 and 106 now.~~
Same bug on Edge 104.0.1293.54, Chromium 104.0.5112.81 Windows and Chrome 104.0.5112.79 Linux
Works correct in Chrome 105.0.5195.28 & 106.0.5231.2

DoctorG

Resizing DevTools window or dragging attached horizontal DevTools pane by divider to get a higher pane could help, but not on all websites.

Nasty bug!

A11yCat

@DoctorG Oh, it's more weird than I thought. When increasing the dev tool height, the rendered fonts info seem to stay at a fixed distance from the bottom of the window.
At least that provides a workaround if it is obscuring something relevant!
It looks like a position:sticky issue from a web developer's point of view.

DoctorG

I reported it to Chromium bug tracker: https://bugs.chromium.org/p/chromium/issues/detail?id=1352805

DoctorG

Bug ist behoben und in der Chromium 105 drin.

A11yCat

@DoctorG That is great news. Thank you!