Переполнение текста: многоточие не работает для динамического заполнителя (в фокусе) |угловая

Question

У меня есть вход с динамическим заполнителем. В фокусе я меняю местозаполнитель, но по какой-то причине я теряю переполнение текста: свойство ellipsis. Но когда размыто, я возвращаюсь. Есть какие-нибудь мысли о том, почему это происходит?

Я подготовил стекаблит для игры:

https://stackblitz.com/edit/angular-jadz6i

Спасибо!

Answer 1

Он основан на функциях браузера по умолчанию. Цель заполнителя - показать всю информацию пользователю. Но вы можете попробовать это в Firefox, это работает. Мой 69.0.1 (64-битный) Firefox. Chrome не поддерживает его.

Предложения

• делают ввод немного больше
• Упростите заполнитель

Answer 2

Попробуй так:

input:focus {
   text-overflow: ellipsis;
}