search

asciinema / asciinema-server

Platform for hosting and sharing terminal session recordings
https://docs.asciinema.org/manual/server/
Apache License 2.0
2.31k stars 266 forks source link

Broken format using web player on asciinema.org #384

Closed peterbrittain closed 8 months ago

peterbrittain commented 4 years ago

When I play this sample (https://asciinema.org/a/45946?autoplay=1) on asciinema.org, it looks like it's missing some characters, or maybe using a font that isn't monospaced.

Downloading and playing on my terminal works fine, though.

I'm using Firefox mobile edition to view the asciicast on an Android device.

peterbrittain commented 4 years ago

Doesn't look like it's affecting my other recordings on a random trawl. I guess it must be something about that file or the characters used in it.

Letme know ifvthere's anyting else I can do to help.

ku1ik commented 4 years ago

I checked now on Safari on iOS and it looks perfectly fine, so it must be something font/CSS related on FF/Android...

Are you able to take a screenshot showing the issue?

peterbrittain commented 4 years ago

Screenshot_20200920-151359

peterbrittain commented 4 years ago

Also just tested on Chrome and that looks fine.

ku1ik commented 2 years ago

I've recently upgraded the player on asciinema.org to the latest, new version. I don't have android device at hand, but on all other browsers and OSes it looks ok. If you still see weird rendering on Android FF then it must be CSS issue for this particular combo (FF + Android).

peterbrittain commented 2 years ago

Still broken on FF +Android, when I just checked. Can I get any diags to help?

neyder commented 2 years ago

I can confirm that on FF any characters to end are not rendered.

Also confirming this is not true on chrome/webkit based browsers.

neyder commented 2 years ago

I think this is more like a player issue.

I got the same behavior on FF with embedded on my blog.

Firefox imagen

Chrome imagen

From inspecting, i got that

container size in FF got a smaller value than in chrome, both has same 80ch on pre, but to render correctly i had to add 20% more ch, so from 80ch goes to 96ch.

ku1ik commented 1 year ago

Do you still see this problem on Firefox? If so, what FF version?

peterbrittain commented 1 year ago

Yup. Still seeing it on FF on Android. Version is 110.0.1 (Build #2015933339), 43c570380+

neyder commented 1 year ago

Also on 109.0.1 (64-bit) Ubuntu 20.04

It's still the same bug on player.

ku1ik commented 10 months ago

It looks like this has been due to the missing support for ch CSS unit in FF on Android. According to https://caniuse.com/ch-unit it has been finally implemented in October 2023, so I hope we can finally close this :crossed_fingers:

peterbrittain commented 10 months ago

Just upgraded to 121.1.0 (Build #2015996455), 62d5117f79+... Still have the same misaligned output, I'm afraid.

ku1ik commented 10 months ago

Bummer :/ I hoped this was it.

ku1ik commented 10 months ago

Can you check how the player here - https://docs.asciinema.org/manual/player/ - renders?

peterbrittain commented 10 months ago

Not sure what you want me to test there... That looks like your docs with different recordings from the original one I flagged as failing (https://asciinema.org/a/45946?autoplay=1).

ku1ik commented 8 months ago

There's been several updates to rendering and character alignment recently, which hopefully fixed the issue once and for all :crossed_fingers:

peterbrittain commented 8 months ago

All looks good this time! Thanks for persevering.

ku1ik commented 8 months ago

Woohoo! 🎉