Description
Describe the bug
When commit messages have some emojis, the UI layout can break. So far, I've seen this with the lightning emoji ⚡️.
The part of the UI that I've observed breaking is the vertical line/bars that separates the viewports (e.g. staged/unstaged changes from commits/reflog.)
Because of the misplaced border, the diff itself gets affected. The text's indentation will be off by one column on that line, and in some cases, a character may be duplicated, even if it's not really part of the actual diff.
To Reproduce
- Make a commit that includes the zap/lightning emoji ⚡️ in the summary line of the commit message.
- Look at the viewport borders around the commits/reflog area.
- The commit message's row should have a misplaced vertical bar at the border. (See context notes.)
Expected behavior
The UI borders don't break and the displayed diff matches the actual diff
Screenshots
Notice the misplaced bar on the far right side, and the -
diff symbol occupying the space where the border bar should be:
In the following pic, the ⚡️ is followed by ➖, which does not break the border, but does make it seem like there's a typo in the commit message itself (notice the ttests
instead of tests
):
Compare the above with the output of git log
, which shows that there's no actual typo in the commit message for hash a94a...
:
And here are 2 examples of how the diffs look different. Notice the duplicated double-quotes in the highlighted lines, in addition to the off-by-one column alignment:
The issue follows the highlighted line as you move up/down due to the broken layout.
Version info:
LazyGit version: commit=71ad3fac63a3ef3326021837b49e9497d332818b, build date=2024-07-13T10:24:19Z, build source=binaryRelease, version=0.43.1, os=linux, arch=amd64, git version=2.43.0
Git version: git version 2.43.0
Additional context
For the issue to show up, the ⚡️ emoji might need to be followed by text. It seems emoji order and/or different combinations can make a difference, so there're issues I may not have noticed (yet). If more than just the ⚡️ is used, the issue may manifest itself differently (e.g. bar vs typo).
Also, the duplicated diff chars, which don't always show up, also seem to go away if you scroll enough to move them "off-screen" within the staged/unstaged changes viewport --assuming the diff has enough changes to allow for this.