RobinHerbots/Inputmask

Autofill shows TypeError in Chrome console.

Closed this issue · 1 comments

When I use autofill to populate a value in an input mask field, the following error appears in the console:

Uncaught TypeError: Cannot read properties of undefined (reading 'length')

image

This error occurs because event.key is undefined in chrome when autofill is used, causing a failure in eventhandlers.js.

var EventHandlers = {
    keyEvent: function (e, checkval, writeOut, strict, ndx) {
        const inputmask = this.inputmask,
            opts = inputmask.opts,
            $ = inputmask.dependencyLib,
            maskset = inputmask.maskset,
            input = this,
            $input = $(input),
            c = e.key, // <---------- e.key is undefined here

            // ...

        inputmask.ignorable =
            c.length > 1 && // <----------- Uncaught TypeError: Cannot read properties of undefined (reading 'length')
            !(input.tagName.toLowerCase() === "textarea" && c == keys.Enter);
  • Browser: Chrome (official build) 127.0.6533.89 (64 bit)
  • Inputmask version: 5.0.9-beta.62

@RobinHerbots
photo_2024-12-02_18-16-42
https://codepen.io/ArtBro/pen/KwPprZq
The issue is fixed, but the mask doesn't work correctly when the value is autofilled.
When the value is inserted into the field through the browser's autocomplete suggestions, the mask doesn't apply correctly.
For example, if the field initially contains "100" and we select the suggested value "1000000", the result in the field will be "1000", and the thousand separator mask is not applied.

Thank you very much for your hard work on this library! It’s incredibly useful, and I really appreciate the effort you put into it.