Q:

Not able to call a function using document.getElementById('password').addEventListener() with a webpack & ES6 setup

I am using webpack & ES6 classes.  I am trying to call 'onblur' function on input#password but its not working.  It neither throws any error nor it calls the callback function.  If I try and find input#password outside eventListener using console.log(document.getElementById('password')) then it gives me the input#password as a DOM object.  I don't know where I am going wrong with this.  Below is my code:
index.html
    <head>
      <script src="./bundle.js"></script>
    </head>
    <body>
       <input id="password" type="password" placeholder="Please enter your password" autofocus="autofocus">
    </body>

webpack-config.js
const path = require('path');

module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'bundle.js',
    },
    devServer: {
        contentBase: path.join(__dirname, 'dist')
    }
};

index.js
import { Password } from './app/main';

document.getElementById('password').addEventListener('onblur', () => {
    console.log('im here');
    var initPwd = new Password();
    initPwd.init();
})

main.js
class Password {
    init() {
        console.log('I am inside init.') 
    }
}

export { Password }

Please help! 

A:

document.getElementById('password').addEventListener('onblur', () => {

=> 
document.getElementById('password').addEventListener('blur', () => {

onblur would work with element.onblur = function() {}, so when you using addEventListener interface you should not write on in the event name. 

A:

The problem is that the event name is blur, while you can assign handlers by assigning to the onblur property of the element.  They're not the same, which can be a bit confusing. 
When you attach a listener by assigning to a property, you use <element>.on<eventName> syntax, eg:
element.onclick = () => ...
element.onblur = () => ...

When you use addEventListener, you just use the plain event name:
element.addEventListener('click', () => ...
element.addEventListener('blur', () => ...

So, change to:
document.getElementById('password').addEventListener('blur', () => {

document.getElementById('password').addEventListener('blur', () => {
  console.log('blur');
});
<input id="password" type="password" placeholder="Please enter your password" autofocus="autofocus">

