Bug: [@pierre/trees] file names show stray ellipsis/truncation artifacts at certain browser zoom levels

[Alek99]

Prerequisites

• I have searched for duplicate or closed issues
• I have read the contributing guidelines

Describe the issue

In FileTreeView, row names are rendered through MiddleTruncate, and the truncation/ellipsis rendering breaks at non-100% browser zoom levels. At certain zoom steps the names render with spurious ellipses ("…") in the middle even when there's enough room to show the full name. The filetree sidebar behaves differently from the previous implementation, and the issue is more noticeable on wide/large monitors.
The artifacts appear to be tied to sub-pixel rounding at fractional device-pixel ratios produced by zooming:

Chrome: Fine at 100% and one step out. Zooming two levels in or two levels out triggers the artifacts.
Safari: Only reproduces at two zoom levels in.

Reproduction

Open https://trees.software/ (also reproduces in any app embedding the filetree sidebar).
In Chrome, zoom out two levels (Cmd/Ctrl + "-" twice) from 100%, or zoom in two levels.
Observe filenames in the tree rendering with ellipses / collapsed characters where the full name should fit.

Reproduces most readily on a wide monitor.

What browser(s) are you seeing the problem on?

Safari, Chrome

What version of @pierre/diffs are you using?

1.0.0-beta.4

[Alek99]

Same behavior on the main website

[Pipluppp]

Can also reproduce in Chrome (14in 2880x1880 screen) but only on 90% zoom level.

On the main page https://trees.software

and on https://trees.software/trees-dev/density (only shows on the ones with compact density)

[SlexAxton]

Can confirm that this is an issue. In a near future update i'm going to kill the truncation technique we're currently using and replace it with a more 'regular css' one. It has some visual tradeoffs but avoids these kinds of edges.

[Alek99]

Hi any timeline when this will be fixed?

[SlexAxton]

Hi!

I have a branch that I'd say is 90% of the way there on replacing the truncation stuff, but not good enough at the moment. There's just a lottt of edge cases to work through. I will likely get to finish it before the end of the month! (but hopefully sooner)

In progress PR is here: #939

[Alek99]

Awesome thank you!