The custom glyphs does not seem to render correctly.

[HichamELBSI]

Details

• Browser and browser version: Google Chrome Version 108.0.5359.98
• OS version: macOS Ventura 13.0.1
• xterm.js version: 5.0.0

An API returns logs that I need to display and for that I'm using Xterm.js to do that.

Here is what the api returns:

2022-12-09T13:05:41.493882608Z �[34m╭────────────�[34m�[30m�[44m git repo clone �[0m�[0m�[34m───────────╼�[0m

This is what I should have rendered:

And this is what I have now:

It seems that some custom glyphs are not rendering correctly. I have a codesandbox that can be used to test this.

Could you tell me if my config is wrong or did I miss something, please?

[jerch]

Those ─ are an double encoding issue at the task, that creates your logs.txt, means that file is already wrongly encoded/corrupted. xterm.js understands JS strings (which are utf-16 under the hood) or byte sequences (utf-8 bytes) as input.

What could cause the issue in the first place? Well, whoever writes the log file entries, prolly gets utf-8 bytes as input, but decodes them wrongly with an 8bit encoding, then re-encodes them as utf-8, example:

>>> original_char =  '─'
>>> incoming_bytes = original_char.encode('utf-8')
>>> incoming_bytes
b'\xe2\x94\x80
>>> corrupted_bytes = incoming_bytes.decode('cp1252').encode('utf-8')
>>> # now corrupted_bytes get saved to your file
>>> # then the following happens in the browser/xterm.js:
>>> print(corrupted_bytes.decode('utf-8'))
─

The decode('cp1252') is wrong here, the incoming data is utf-8, thus should be treated as utf-8, or that weird double encoding issue will appear. Crosscheck (good case):

...
>>> good_bytes = incoming_bytes.decode('utf-8').encode('utf-8')
>>> # now good_bytes get saved to your file
>>> # then the following happens in the browser/xterm.js:
>>> print(good_bytes.decode('utf-8'))
─

(Used python to illustrate the issue, as JS lacks default encoders for the wrongly applied 8bit encoding here.)

This has nothing to do with xterm.js, thus gonna close the issue.

[HichamELBSI]

Hi @jerch, thanks for the detailed answer, very helpful!