search

gsoft-inc / ov-igloo-ui

Officevibe design system
https://igloo.officevibe.design
Apache License 2.0
19 stars 6 forks source link

[Bug]: Can surpass maxLength in Textarea with an emoji, leading to negative character indicator #366

Closed Ignotos closed 1 year ago

Ignotos commented 1 year ago

Contact Details

michael.ignoto@gsoft.com

What happened?

Steps to reproduce:

  1. Write until the character indicator shows 1
  2. Add an emoji

Textarea-emoji-bug

Result: We surpass the maxLength specified and the character indicator shows a negative number

Component

Textarea

Component Version

0.1.5

Which browsers are you seeing the problem on?

Chrome

Mobile Device

No response

Relevant log output

No response

jgclement91 commented 1 year ago

Another related issue is that even though the text area is in an error state, is doesn't displays the expected error state as documented in Storybook

franckgaudin commented 1 year ago

@jgclement91 I don't quite understand the issue you are talking about, do you have a screen shot so I can visualize the problem.

jgclement91 commented 1 year ago

Yes, sorry for the delay! When the counter is negative, the textarea is in error state (When hovering it, an error message appears) image

I would expect the border to be red image

franckgaudin commented 1 year ago

We have just released a fix that makes it impossible to add an emoji when there is only one character left, so this should not happen again.

Regarding the rendering of the error, the component does not handle logic, it only handles the rendering. To display an error, the parent must pass it the error: true props;

jgclement91 commented 1 year ago

Great! I didn't realize that the validation message was from built-in input validation