Text-mask: vanilla import error

[AliveDD]

i'm install plugin

import maskInput from './vendor/vanillaTextMask'
console.log(maskInput);

_console say's:_
function o(e){var r=e.inputElement,t=(0,a["default"])(e),n=function(e){var r=e.target.value;return t.update(r)};return r.addEventListener("input",n),{textMaskInputElement:t,destroy:function(){r.removeEventListener("input",n)}}}

and init it

maskInput({ inputElement: $userPhone, mask: mask });

_console say's:_
TypeError: r.addEventListener is not a function. (In 'r.addEventListener("input",n)', 'r.addEventListener' is undefined)

[msafi]

Can you show a more complete setup, perhaps create on minimum project on GitHub showing your setup and share a link to that? I can't really tell what's going on just by what you've posted above.

[billcolumbia]

In the example (for vanilla) notice masker.maskInput is not called, but maskInput() is. So for anyone else, this should work:

import maskInput from 'vanilla-text-mask'

//...

maskInput({
  inputElement: inputElement
  //options etc...
})

[msafi]

I'll close this issue for now, but please feel free to continue to post here when there's more information.

[Galeups]

Hello!
I repeat this problem with vanilla-text-mask.
My call:

var myInput = document.querySelectorAll('input[data-mask="date"]');

console.log( myInput );

var date = [/\d/, /\d/, '.', /\d/, /\d/, '.', /\d/, /\d/, /\d/, /\d/];

var maskedInputController = vanillaTextMask.maskInput({
  inputElement: myInput,
  mask: date
});

in console:
Uncaught TypeError: t.addEventListener is not a function

I dont use webpack and ES6. File js added from./node_modules/vanilla-text-mask/dist/vanillaTextMask.js`

Thank`s )

[MikeChugunov]

For anyone who encounter the same TypeError - make sure that inputElement is truly an element, not NodeList. For example:

maskInput({
  inputElement: document.querySelectorAll(foo),
  mask: date
});

will throw TypeError: r.addEventListener is not a function. (In 'r.addEventListener("input",n)', 'r.addEventListener' is undefined) cause r is nodeList

so you should use (ES6)

for (let input of document.querySelectorAll(foo)) {
maskInput({
  inputElement: input,
  mask: date
});
vanillaTextMask.maskInput({
  inputElement: input,
  mask: date
});
}