Editor sometimes truncates first letter
Thanks in advance for your bug report!
- [ ] Have you reproduced issue in safe mode?
- [x] Have you used the debugging guide to try to resolve the issue?
- [x] Have you checked our FAQs to make sure your question isn't answered there?
- [x] Have you checked to make sure your issue does not already exist?
- [x] Have you checked you are on the latest release of Pulsar?
What happened?
We have a plane with class "editor" where all text is placed. It includes "gutter" and div with text itself.
If to add any extension (like "minimap" or "vertical-tabs") - first letters of text will be truncated onto 1 or 2 pixels. Those extensions are placed inside "editor" div, sometimes on right side, sometimes on left side - it doesn't matter.
If to check in DevTools - everything works well if "editor" is 1020px, it's truncated when it's 1021px, 1022px, 1023px, 1024px, but is ok on 1025px, 1026px.
Pulsar version
1.128.0
Which OS does this happen on?
🐧 Debian based (Linux Mint, Ubuntu, etc.)
OS details
Both: Windows, Linux Mint, I think it doesn't depend on OS
Which CPU architecture are you running this on?
None
What steps are needed to reproduce this?
- open pulsar
- write "@" character (bc it takes all available space at left side of character)
- enable any extension like "minimap", "vertical-tabs"
- resize editor by handle between Tree View and Editor
- see that sometimes first character is truncated
Additional Information:
Additional Information: Images
Look to "@" character in text editor.
Looks good here:
Is truncated here:
Is ok if width is 1020px:
Is truncated if width is 1021px:
Is truncated if width is 1024px:
Is ok again if width is 1025px:
Additional Information: Discussion
I had discussed this with somebody in Pulsar Discord long time ago, but had not time to return to it and create issue. As I remember - problem was in calculating child divs sizes when even-odd sizes. But as I see now, it's not just about even-odd sizes.
Gonna check this in code a little bit later.
I remember I suggested to use "flex" container for "editor" div, but guy from channel told that it's risky - we can break something. Anyway I wanna try "flex" or "grid" container for this - it'll simplify code and allow not to make manual size calculations.
~~Could you illustrate this with some screenshots?~~ (Never mind, you hid them in details elements!)
I have noticed this myself. I'll be glad to know the exact root cause here!
EDIT: It's true that it would be incredibly risky to switch the layout strategy of the editor div. I would be very interested in a simpler fix than that, even if it's not as elegant.
I think you're right that it's not just about even/odd sizes, but I suspect it has to do with high-DPI displays and pixel ratios. I think it can be explained as a result of rounding errors now that we've all got super-nice monitors.
I'm not sure if my problem is similar, but I often notice that the cursor is indented on an empty line. It's shifted by about one a character, but I can't measure it precisely. Cursor movement do not resolve it, but any input does.
Res 2560x1440 Scale 100% Win 10x64. Newest PulsarNext of this https://github.com/pulsar-edit/pulsar/pull/1299 branch.