The addon is not working in Safari

[jcgueriaud1]

When I'm trying to fill the value in the demo, the valuechange event is not necessary called when I'm using Safari. (Version 15.6 (17613.3.9.1.5))
It happens when the TextField has the ValueChangeMode set to ValueChangeMode.ON_CHANGE.

It seems ok in the other modes.
Apparently the change event is not fired from the client side.

Screen.Recording.2023-08-15.at.14.22.07.mov

[jcgueriaud1]

The change is not fired in the imask demo: https://imask.js.org/

If you add this to the number input, the changed event is called all the time in Chrome and sometimes in Safari.
$0.addEventListener("change", e=> { console.error("changed")});

One workaround is to use on blur instead of on change.

I also tried the latest version of imask and I have the same issue.

[jcgueriaud1]

The workaround can be (for the textfield you want to extend)

        if (VaadinSession.getCurrent().getBrowser().isSafari()) {
            setValueChangeMode(ValueChangeMode.ON_BLUR);
        }

[gidravlic]

The workaround can be (for the textfield you want to extend)

        if (VaadinSession.getCurrent().getBrowser().isSafari()) {
            setValueChangeMode(ValueChangeMode.ON_BLUR);
        }

Please try in iOS with Chrome 115

[jcgueriaud1]

What do you mean?
Does it work?

[gidravlic]

@jcgueriaud1 sorry, i mean that component not work with iOS with Chrome 115 on value change