Issue with typing animation in AI Chatbot

Ask the Community Customization
1

One more thing …

I may have found a bug or CSS selector issue related to the new attachment feature.

Now, when I initiate a conversation with the chatbot, the chatbot response initiates with a small conversation bubble (no dots inside), then it follows the CSS rules in our configurator (it initiates with three dots). See below.

Can you please revisit this with your developers and provide a solution?

Thank you!

screenshot-ai-chatbot-bubble-answer
screenshot-ai-chatbot-bubble-answer644×867 72.3 KB

3

@Petar_Dietrich I’ve just checked your widget and I saw the opposite issue. Firstly, the dots are displayed in the bubble, but then they disappear.

Anyway, I’ve passed it on to the devs for investigation and I’ll update you once it’s fixed :slightly_smiling_face:

4

Actually, you are correct! Glad you were able to replicate my issue. Looking forward to the solution. As you can imagine, my finding may affect other users who have custom CSS rules for configuring the chatbot’s response format (bubble vs dots). Thank you!

5

Hi @Max,

Just a friendly reminder … bug still present. Fix appreciated. I am definitely interested in knowing what caused it.

Thank you!

6

Hi @Petar_Dietrich :waving_hand:

Thank you for waiting!

We’re still investigating the issue and I’ll update you as soon as it’s fixed.

7

Hi there, @Petar_Dietrich :waving_hand:

Thank you for waiting!

We’ve adjusted the CSS code responsible for the typing animation. Here is how it looks now:

/* hide Thinking... */
.es-message-assistant [class*="dialog-message-loader__ThinkingText-sc"] {
  display: none !important;
}

/* always display dots while thinking */
.es-message-assistant [class*="dialog-message-loader__SlideWrapper-sc"]:has([class*="dialog-message-loader__DotsContainer-sc"]) {
  opacity: 1 !important;
  transform: none;
}

[class*="dialog-message-loader__Container-sc"] {
  min-height: 20px;
}

Please check your widget and let me know if the animation is working fine now :slightly_smiling_face:

8

Thanks, Max! Yes, bug solved. If it resurfaces, I’ll let you know. I guess the lesson learned here is to ensure new CSS selectors created by your developers do not conflict with current ones. Correct?

9

Yep, that’s right!