Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Incorrect character order during typing animation #399

Open
alishenriques opened this issue Nov 29, 2024 · 0 comments
Open

Incorrect character order during typing animation #399

alishenriques opened this issue Nov 29, 2024 · 0 comments

Comments

@alishenriques
Copy link

alishenriques commented Nov 29, 2024

Hey guys! Fisrt of all thanks for the great library!

So... While using the TypeIt library to display long texts, I've noticed an unusual behavior where some characters are reversed during the typing animation. This results in typos in the displayed text, which impacts the accuracy of the output. The issue seems to occur intermittently and is more noticeable with longer strings of text.

Steps to Reproduce

  1. Initialize a TypeIt instance with a long string of text.
  2. Observe the typing animation as it progresses.
  3. Note that certain characters are occasionally swapped or reversed in the final output.

Expected Behavior

The text should appear exactly as provided in the strings option, with no reversed or swapped characters during the typing animation.

Actual Behavior

Characters are occasionally reversed during the typing animation, causing spelling errors in the displayed text.

Thats how I'm using the lib:

<Styles.Answer>
  <TypeIt
    options={{
      speed: 40,
      cursor: true,
      cursorChar: '⬤',
      breakLines: true,
      loop: false,
      waitUntilVisible: true,
      afterComplete: (instance: any) => {
        setShowChildren(true);
        if (onComplete) {
          onComplete(instance);
        }
        instance.destroy();
      },
    }}
    getAfterInit={(instance) => {
      answer.forEach((item, index) => {
        instance.type(item); // Here is the problem. I've tryed instance.type(item, { instant: true }).flush(); like the docs, but didn't work.
        if (index < answer.length - 1) {
          instance.pause(500);
        }
      });
      instance.go();
      return instance;
    }}
  />
</Styles.Answer>

Environment

  • Library Version: ^2.7.7
  • Browser: Chrome (desktop e mobile), Edge.
  • App Framework: React.js

Additional Information

  • This behavior appears to be more frequent with long strings or when the typing speed is set to high (but not necessarily);

Let me know if further details or a demo is required to investigate this issue.

@alishenriques alishenriques changed the title Incorrect Character Order During Typing Animation with Long Texts Incorrect character order during typing animation Nov 29, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant