Мне нужно определить, является ли заполнитель элемента видимым с помощью JavaScript

Question

У меня есть имя пользователя и пароль на моей странице. Сначала div, который оборачивает поле имени пользователя, имеет оранжевую рамку, а после того, как имя пользователя заполнено, он снова становится белым, а затем div, который оборачивает ввод пароля, выделяется оранжевой рамкой. Он работает нормально, но когда эти входные данные автоматически заполняются браузером, граница имени пользователя остается оранжевой, пока пользователь не взаимодействует со страницей.

Мы пытались использовать javascript, когда страница загружается, чтобы прочитать длину значения в полях, но, по-видимому, значение не определяет автозаполнение, сгенерированное браузером, пользователь должен будет сначала хотя бы щелкнуть страницу (в любом месте). , даже щелчок правой кнопкой мыши), чтобы обновить это значение. Наконец, мы пришли к выводу, что мы могли бы использовать javascript для стилизации нужных нам элементов, взглянув на свойство placeholder этого элемента.

Это код, который мы используем для очистки границ

var userteste = document.getElementById('userInputContainer');    
var passteste = document.getElementById('passwordInputContainer');

console.log(userteste.value); 
// At this point, the log will be an empty value, even though there is 
// a visible value filled in the input

if (userteste.value.length > 6 && passteste.value.length > 6) {
   $("." + 'userInputContainer').css({ border: "1px solid #FFF" });
   $("." + 'passwordInputContainer').css({ border: "1px solid #FFF" });
   var img = document.getElementById('userIcon');
   img.src = "/Content/Images/Ui/Login/LoginUserEscuro.svg";
   var img = document.getElementById('passwordIcon');
   img.src = "/Content/Images/Ui/Login/LoginLockEscuro.svg";
   $('.btn-login').removeAttr('disabled', 'disabled');
}    

Учитывая, что в то же время заполнитель не отображается, но «значение» ввода пусто, как мы можем использовать javascript для обнаружения видимости заполнителя для элемента, независимо от его значения?

Возможный ответ: Обнаружение браузера Автозаполнение

В этом сообщается, что браузеры на самом деле не запускают событие, когда они автоматически заполняют ввод, после того, как я это понял, я решил попытаться по возможности взглянуть на возможность решения с заполнителем ввода.