Chrome autofill leave form as invalid

[aldarund]

Versions

• vee-validate: 3.0.11
• vue: 2.6.10

Describe the bug
When chrome autofill form, vee validate still thinks form is invalid, while all fields are valid. Errors are empty. Touched is true, pristine is false but invalid is true, while it should be false

To reproduce
Open repro link click login - enter anything. click login. save chrome creds. Reload page open again

Expected behavior
form is valid after chrome autofill.

Demo link
https://1hqj7.sse.codesandbox.io/
https://codesandbox.io/s/codesandbox-nuxt-1hqj7

[logaretm]

Are you on MacOS?

[aldarund]

windows

[aldarund]

Here is video of what happening ( when autofill happens). I also fixed repro it was somehow broken
https://www.dropbox.com/s/vrhn3sk0qbb0jjw/2019-11-14_19-29-54.mp4?dl=0
See how the form touched and invalid, and when i click anywhere it become valid

[aldarund]

I asked a friend on mac to check and he says its fine on mac.
But certainly not fine on win

[saint777]

Sometimes its working ok on windows, sometimes not.

I put autocomplete="new-password" to input, to temporary fix this.
autocomplete="off" doesn't work

[logaretm]

Well this has been the problem, I haven't been able to reproduce on either windows or a mac device. @saint777 by autocompress=off you mean autocomplete, right?

Autocomplete seems to emit the proper events as well, so I don't see how this is happening yet

[saint777]

Well this has been the problem, I haven't been able to reproduce on either windows or a mac device. @saint777 by autocompress=off you mean autocomplete, right?

Autocomplete seems to emit the proper events as well, so I don't see how this is happening yet

yes, i meant autocomplete (i did a research and it's comfirmed that chrome ignores autocomplete="off" on inputs)

good luck logaretm to fix this 😆. But actually it might be a problem with Chrome(Windows) because i doesn't fire an event.

Thanks for this plugin, its nice overall!

Windows 10 1809 (build 17763.864) 64 bit
Google Chrome 78.0.3904.108 (64 bit)

[alexey2baranov]

Last days i have same problem. Many users can,t register on our site because submitting button is not active.

I just start researching this problem. Looks like some user fill registration data with autofill and vee-validate doesn,t handle this correctly.

Demo example by Dmitry is good for reproduse this scenario. I have tried them and got exactly same result as Dmitry on video.

Android Chrome latest

[messiahUA]

I have the same problem with firefox on mobile. When login page opens credentials are autofilled and vee validate reports that fields are required.

[ivomarsan]

Same problem on Windows 10 and Firefox Developer 79.0b8

[kevinjcoleman]

@logaretm I am also having this issue, Chrome on IOS. @ivomarsan, @messiahUA @alexey2baranov how did y'all fix this?

[messiahUA]

@kevinjcoleman No fix so far unfortunately.

[mahenzon]

Seems like adding name attribute to input can help

vuejs/vue#7058 (comment)

UPD: hmm now it again doesn't update when autofilled inputs.. so sad

[logaretm]

closing since browser behavior with autofill is not consistent.