[GH-ISSUE #236] Combined emojis don't render correctly #182

Closed
opened 2026-03-04 01:02:42 +03:00 by kerem · 9 comments
Owner

Originally created by @Bios-Marcel on GitHub (Feb 16, 2019).
Original GitHub issue: https://github.com/rivo/tview/issues/236

Hey,

I do have a terminal that can render emojis, however combined emojis like region flags, different genders of an emoji and differenet skin tones don't actually render as a single emoji. Instead they are two or more seperate emojis and sometimes they leave weird artifacts as well.

Here is what it looks like:
https://cdn.discordapp.com/attachments/484508952948899841/546348622359429120/img.png

He uses iranian flags on both sides.

I am unsure if this is a tview problem though, since I am not very well versed on this topic.

Originally created by @Bios-Marcel on GitHub (Feb 16, 2019). Original GitHub issue: https://github.com/rivo/tview/issues/236 Hey, I do have a terminal that can render emojis, however combined emojis like region flags, different genders of an emoji and differenet skin tones don't actually render as a single emoji. Instead they are two or more seperate emojis and sometimes they leave weird artifacts as well. Here is what it looks like: https://cdn.discordapp.com/attachments/484508952948899841/546348622359429120/img.png He uses iranian flags on both sides. I am unsure if this is a tview problem though, since I am not very well versed on this topic.
kerem closed this issue 2026-03-04 01:02:42 +03:00
Author
Owner

@rivo commented on GitHub (Mar 8, 2019):

I added support for this in #161 so it should theoretically work. But it also depends heavily on your terminal and your OS's support for these emojis. If you can post a short code sample here, I may be able to find out where the problem is.

<!-- gh-comment-id:471040910 --> @rivo commented on GitHub (Mar 8, 2019): I added support for this in #161 so it should theoretically work. But it also depends heavily on your terminal and your OS's support for these emojis. If you can post a short code sample here, I may be able to find out where the problem is.
Author
Owner

@Bios-Marcel commented on GitHub (Mar 8, 2019):

Tested using this (It shows my fork in the image, but don't worry, I tested with your repo as well):

package main

import "github.com/rivo/tview"

func main() {
	label := tview.NewTextView()
	label.SetText("🇩🇪 vs 🏳️‍🌈")
	tview.NewApplication().SetRoot(label, true).Run()
}

bugtview

My terminal is a VTE terminal.

<!-- gh-comment-id:471044764 --> @Bios-Marcel commented on GitHub (Mar 8, 2019): Tested using this (It shows my fork in the image, but don't worry, I tested with your repo as well): ```go package main import "github.com/rivo/tview" func main() { label := tview.NewTextView() label.SetText("🇩🇪 vs 🏳️‍🌈") tview.NewApplication().SetRoot(label, true).Run() } ``` ![bugtview](https://user-images.githubusercontent.com/19377618/54050402-66387800-41df-11e9-9876-1e7bb025d4b4.png) My terminal is a VTE terminal.
Author
Owner

@rivo commented on GitHub (Mar 9, 2019):

This is what I see on macOS (iTerm2):

image

So it seems that the second flag is processed correctly because of the zero-width joiner for which I added support a while back. Your terminal doesn't appear to be able to render that flag so it resorts to a fallback (white flag). I think this is correct.

But the German flag is more interesting as it's composed of two unicode characters 0x1f1e9 + 0x1f1ea, which are regional indicators "D" and "E". I didn't even know I needed to detect regional indicators and combine them to flags...

At this point, before I hardcode this specific case into tview, I think I need a full list of rules for composite unicode characters - if there is one. I haven't been able to find such a list yet.

I'd appreciate if anyone had pointers.

<!-- gh-comment-id:471161630 --> @rivo commented on GitHub (Mar 9, 2019): This is what I see on macOS (iTerm2): ![image](https://user-images.githubusercontent.com/480930/54069103-573fdd00-4254-11e9-844d-76c5af134846.png) So it seems that the second flag is processed correctly because of the zero-width joiner for which I added support a while back. Your terminal doesn't appear to be able to render that flag so it resorts to a fallback (white flag). I think this is correct. But the German flag is more interesting as it's composed of two unicode characters `0x1f1e9 + 0x1f1ea`, which are regional indicators "D" and "E". I didn't even know I needed to detect regional indicators and combine them to flags... At this point, before I hardcode this specific case into `tview`, I think I need a full list of rules for composite unicode characters - if there is one. I haven't been able to find such a list yet. I'd appreciate if anyone had pointers.
Author
Owner

@rivo commented on GitHub (Mar 19, 2019):

So your issue took me down a huge rabbit hole... I don't know if you are interested in the specifics of what caused this problem and how I ended up solving it (see gdamore/tcell#264 for a discussion). But I even wrote an entire new package to deal with this properly: rivo/uniseg.

In any case, your example (and hopefully all other similar ones) works now:

image

There may still be an issue with terminals that are not fully up to date with the Unicode specification (especially emojis) but that's nothing I can fix on my end. In those cases, you would have to submit issues with the maintainers of those terminals.

ps. You'll need to update tcell to make this work properly.

<!-- gh-comment-id:474323833 --> @rivo commented on GitHub (Mar 19, 2019): So your issue took me down a huge rabbit hole... I don't know if you are interested in the specifics of what caused this problem and how I ended up solving it (see gdamore/tcell#264 for a discussion). But I even wrote an entire new package to deal with this properly: [`rivo/uniseg`](https://github.com/rivo/uniseg). In any case, your example (and hopefully all other similar ones) works now: ![image](https://user-images.githubusercontent.com/480930/54602673-9505e800-4a42-11e9-91ca-5c943dc78488.png) There may still be an issue with terminals that are not fully up to date with the Unicode specification (especially emojis) but that's nothing I can fix on my end. In those cases, you would have to submit issues with the maintainers of those terminals. ps. You'll need to update [`tcell`](https://github.com/gdamore/tcell/) to make this work properly.
Author
Owner

@Bios-Marcel commented on GitHub (Mar 19, 2019):

Thanks for looking into this. Seems like my terminal is still not able to do this, but I guess that can't be helped. Thanks anyway!

<!-- gh-comment-id:474370732 --> @Bios-Marcel commented on GitHub (Mar 19, 2019): Thanks for looking into this. Seems like my terminal is still not able to do this, but I guess that can't be helped. Thanks anyway!
Author
Owner

@normen commented on GitHub (Nov 22, 2020):

Thanks for looking into this. Seems like my terminal is still not able to do this, but I guess that can't be helped. Thanks anyway!

By now it looks like cordless has no issues with emoji on the default MacOS Terminal, they seem to work fine for me. My own app based on tview does still have issues though - how did you circumvent the issue? Or did I just not see it?

<!-- gh-comment-id:731737409 --> @normen commented on GitHub (Nov 22, 2020): > Thanks for looking into this. Seems like my terminal is still not able to do this, but I guess that can't be helped. Thanks anyway! By now it looks like cordless has no issues with emoji on the default MacOS Terminal, they seem to work fine for me. My own app based on tview does still have issues though - how did you circumvent the issue? Or did I just not see it?
Author
Owner

@Bios-Marcel commented on GitHub (Nov 22, 2020):

For the chatview I currently still use tview.TextArea, so there's nothing I personally did.

<!-- gh-comment-id:731755971 --> @Bios-Marcel commented on GitHub (Nov 22, 2020): For the chatview I currently still use tview.TextArea, so there's nothing I personally did.
Author
Owner

@normen commented on GitHub (Nov 22, 2020):

Okay thanks, maybe I just didn't try the right emoji at the right moon phase. Thanks again!

Am 22.11.2020 06:24 schrieb Marcel Schramm:

For the chatview I currently still use tview.TextArea, so there's nothing I personally did.

--
You are receiving this because you commented.
Reply to this email directly or view it on GitHub:
https://github.com/rivo/tview/issues/236#issuecomment-731755971

<!-- gh-comment-id:731761623 --> @normen commented on GitHub (Nov 22, 2020): Okay thanks, maybe I just didn't try the right emoji at the right moon phase. Thanks again! Am 22.11.2020 06:24 schrieb Marcel Schramm: >For the chatview I currently still use tview.TextArea, so there's nothing I personally did. > >-- >You are receiving this because you commented. >Reply to this email directly or view it on GitHub: >https://github.com/rivo/tview/issues/236#issuecomment-731755971
Author
Owner

@justjosias commented on GitHub (Jul 28, 2021):

Downstream problem: https://github.com/RasmusLindroth/tut/issues/38

<!-- gh-comment-id:888412141 --> @justjosias commented on GitHub (Jul 28, 2021): Downstream problem: https://github.com/RasmusLindroth/tut/issues/38
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/tview#182
No description provided.