Клавиатура стирает введённое слово при вводе цифры

Есть инпут, который при вводе в который меняется вводимый текст, например, приводится в верхний регистр: https://jsfiddle.net/dbmh9qoy/

document.querySelector('input').addEventListener('input', e => {
  var val = e.target.value
  var upper = val.toUpperCase()
  
  if (val !== upper) {
    var { selectionStart, selectionEnd } = e.target

    e.target.value = upper
    e.target.selectionStart = selectionStart
    e.target.selectionEnd = selectionEnd
  }
})
<input>

Проблема в том, что на телефонах Сяоми при использовании стандартной клавиатуры Emoji&Font Keyboard если вводимый текст модифицировался, по при вводе цифры или пробела после слова это слово стирается. На скринвидео слово не стирается только если включен caps lock.

Можно как-то исправить?

Скринвидео:

скринвидео

Ошибка не в обработчике события, проблема в том, что значение в input'е вообще меняется программно. Я добавил вывод того, что вообще приходит в обработчик input и видно, что версии с текстом и цифрой одновременно туда вообще не приходит: https://jsfiddle.net/dbmh9qoy/1


Ответы (1 шт):

Автор решения: stylok

Если дело действительно только в последней цифре, то, как я и предлагал, попробуйте проверяться так:

document.querySelector('input').addEventListener('input', e => {
    let val = e.target.value
    if(!Number(val[val.length - 1]) || val[val.length - 1] !== ' ' ) e.target.value = val.toUpperCase();
});

UPD: Не знаю кто и за что влепил мне минус .) но с учётом вашего добавления внёс правку с проверкой на пробел.

Попробуете, так будем знать куда двигаться. Мой код касается только последнего символа.

→ Ссылка