InputText and TextBlock work incorrectly with Unicode characters (Emoji, for example)

Hi there,

InputText and TextBlock work incorrectly with Unicode characters (Emoji, for example). Here is an example. Unfortunatelly, when I save the file, all emoji replaces with question marks… So, you should change line 28: the value should be " :blush:a​:wink:b​:smirk:c​:kissing_heart:d​:heart_eyes:e​:innocent:f​:money_mouth_face:g".

There are two problems:

  1. If you try to use backspace to delete some characters, Unicode characters will be broken.
  2. textWrapping (BABYLON.GUI.TextWrapping.Ellipsis) of the TextBlock cuts Unicode characters between bytes.

Screenshot

It’s a known limitation of the Playground that won’t save the source code in Unicode/Utf8.

Try in jsfiddle instead:

https://jsfiddle.net/3ph9m0cx/

This sample also demonstrates the custom word splitting function you need to use if splitting at space boundaries does not work.

This post is not about the Playground. It’s about InputText and TextBlock.

  1. InputText removes only part of a Unicode character.
  2. TextBlock splits in a wrong way.

Isn’t it a bug?

My bad, didn’t fully understand the question (still, my answer explains your comment “When I save this file, all emoji replaces with question marks :(”).

There’s a problem indeed with characters using more than 16 bits for their representation… I think you can create an issue in the repo about this.

Done: InputText and TextBlock work incorrectly with Unicode characters (Emoji, for example) · Issue #8822 · BabylonJS/Babylon.js · GitHub
There is a link to a new repro: https://jsfiddle.net/wizardos/gd9Lo637/2/

1 Like