keepWords doesn't work during typing animation

[jcubic]

Issue summary

When you echo with typing animation and keepWords it the word wrapping only happen after the animation

Expected behavior

keepWords should work during animation

Actual behavior

I only work after the animation finishes

Steps to reproduce

1. Open CodePen demo
2. Change the echo to:

await term.echo(para, { typing: true, delay: 50, keepWords: true });

Browser and OS

NA

[jmacwhyte]

It would appear keepWords and wrapping also do not work correctly if you echo something that is too long to fit on the current line. Is this related?

[jcubic]

@jmacwhyte Are you talking about animation? Can you show an example?

[jmacwhyte]

@jcubic Apologies, the issue I encountered was not related to animation. It appears to be some sort of rendering issue. On my computer, text entered manually will be indented on the left by 1px until you press enter, then the indent disappears. If lined up exactly with word wrap, this can cause characters to jump from a second line back to the first.

[jcubic]

What browser do you use and what OS? Also, can you create a demo that reproduces the issue? Just in case I can't reproduce it can you record a video of the bug?

[jmacwhyte]

I'm using chrome on OSX. Here is the setup (very boring): https://jsfiddle.net/03ngcLwq/

I zoomed in to make it easy to see the issue, then recorded this video. I start by typing "12345" and you can see it looks like it is doing wordwrap because the 5 moves down to the second line. But when I press enter, everything shifts enough for the 5 to be on the same line. For the following lines, you can see they don't line up perfectly until I press enter. When not zoomed in, it seems to be a change of only 1px.

Screen.Recording.2023-06-02.at.7.57.58.PM.mov

[jcubic]

Oh, I see. This is kind of off by one error, because the cursor can't fit into the space. This has nothing to do with word wrapping. I'm not sure if you can do anything about this. But you can report an issue for this. I will look at it when I will have time.

Do you really have a use case for this, or just was testing how it performs in such extreme conditions?

[jcubic]

I've just tested it on Chrome Linux and I don't see a jump but the first line gets one less character.

[jmacwhyte]

Do you really have a use case for this

No, it isn't very important :)

I was trying to learn how wordwrapping works, and made the screen quite small just so I wouldn't have to type as much before it wrapped. That's when I noticed the behaviour, which at first confused me because I thought it was wrapping inconsistently.

I think I now have everything I need. Thanks for the amazing project!

[jcubic]

Created an issue for it. It was long ago when I was testing wrapping, there are a lot of unit tests for this, but I think that this is something with CSS and the Browser that's why it needs to be tested manually (there are no visual tests).

[jcubic]

Just tested with the prompt, it only happens when the prompt is an empty string.

[jcubic]

The issue with wrapping is solved in the devel branch. It was caused by the prompt being Zero-With Space in DOM when the prompt was empty.

[jmacwhyte]

Awesome, great work! Thanks for the quick action.