🔑 Caps Lock + пароли = боль. Вот решение

Вы когда-нибудь набирали пароль, он не подходил, а потом оказывалось, что включён Caps Lock? В обычных инпутах это видно сразу, но в type="password" — сюрприз!

Проблема простая: пользователь не понимает, что пароль неверный, потому что регистр был включён. Итог — раздражение, лишние попытки, и неверный UX.

Хорошая новость — это легко отловить в браузере! Используйте KeyboardEvent.getModifierState('CapsLock') и покажите подсказку:

document.querySelector('input[type=password]')
  .addEventListener('keyup', e => {
    const capsLockOn = e.getModifierState('CapsLock');
    if (capsLockOn) {
      console.warn('Caps Lock is ON!');
    }
  });

А getModifierState умеет определять не только Caps Lock, но и NumLock, ScrollLock, Fn и даже Super (да, та самая Win/Command-клавиша).

#js_tips@js_for_devs