Login button disabled when username and password are auto filled

[xkopenreview]

noticed this in Celeste's workshop

If user has chrome to remember the username and password, it looks like now we don't catch the auto fill
so the login button is disabled although user see both inputs are filled.

[xkopenreview]

didn't really find a solution for this.
but it seems that although disabled, user can still click the login button and log in (clicking on the disabled button only once)

[zbialecki]

I found this open issue for React: facebook/react#1159

It sounds browsers won't file the change event because it would be a security vulnerability, so it's difficult to detect. This comment suggests that the best way to handle forms is to never disable the submit button and do all validation on submit: facebook/react#1159 (comment)

I also noticed this does not happen when the login page is accessed via client side navigation.

[zbialecki]

I did find one interesting solution that uses CSS to detect the autofill event: https://github.com/klarna/ui/blob/v4.10.0/Field/index.jsx#L104-L114 and https://github.com/klarna/ui/blob/v4.10.0/Field/styles.scss#L228-L241

[xkopenreview]

I did find one interesting solution that uses CSS to detect the autofill event: https://github.com/klarna/ui/blob/v4.10.0/Field/index.jsx#L104-L114 and https://github.com/klarna/ui/blob/v4.10.0/Field/styles.scss#L228-L241

i tried this solution but couldn't get it to work. do you want to give it another try?

[xkopenreview]

according to https://bugs.chromium.org/p/chromium/issues/detail?id=1166619
this is intended behavior of chrome, so close this issue