Bug: eMail input auto trims value and resets cursor position

[RichardWepnerTU]

Steps to reproduce:

• set up an Input of type="email" (The code is basically the same as in issue input element loses focus after typing  #23, with the FormInput seperated into another component. You can see the code in the Github project.)
• type in spaces
• type in a letter

Behaviour
All leading and trailing whitespaces are removed, and the cursor is set in front of the input value.
This behaviour seems to appear for all inputs except for spaces, if there are leading or trailing whitespaces after the user input was applied.

Expected Behaviour

• The cursor stays at the same position within the user input.
• The spaces are handled consistently:
  • Either: removing all whitespaces
  • Or: don't remove any whitespaces

It might still be a problem related to the setup.

Btw: I'll try to implement the other things you suggested the next days. (There are e. g. functions implemented for the validation, even though they are currently not in use.)

And thank you for your help so far. ;)

[gaperton]

Interesting. I would propose not to use 'email' input type, just 'text' instead. It looks like this trimming is happening inside of the input. Another problem of these smart input types is that they don't behave consistently across different browsers.

When you have inline validation logic as yours, you just don't need extra smart "email" input type. It's better to wrap it to your own <EmailInput/> component once and forget about that.