How to detect Caps lock in JavaScript

To check the caps lock status, you use the getModifierState() method of the KeyboardEvent object:

The getModifierState() method returns boolean. If modifier is active it returns true otherwise false

Here is a sample example of getModifierState() for password inputs where you can check the status of caps lock and return appropriate alert.

const password = document.querySelector("input[name=password]")

password.addEventListener('keyup', (event) => {
    if (event.getModifierState('CapsLock')) {
        alert('CapsLock is on')
    }
})