I'm working on a login form using React 18, and I have a backend that determines where to redirect users next based on their login attempts. If they fail to log in, I want to send them to a password reset page. However, every time I test this, Chrome insists on saving the new password, which isn't what I want. I understand why this happens, but I'm looking for a way to make Chrome recognize that the password is wrong. Currently, I use a workaround that limits saving after several failed attempts, but this feels unreliable since it creates discrepancies in the logic. Someone told me there's no way to change Chrome's behavior, while another suggested using 'window.href', which I previously tried without success. What are some common strategies to handle this situation? I've already looked into adding delays, clearing the password field, and other suggestions, but none seem practical. Any thoughts?
3 Answers
Instead of redirecting users after failed attempts, consider just returning a generic error message that keeps them on the same page. This way, you can avoid triggering Chrome's password-saving function, which occurs when it thinks the form was successfully submitted. Just let users know the combo was incorrect without redirecting them.
I get where you're coming from! One thing to consider is changing the input type to something like 'favoriteColor' temporarily, which might trick Chrome into not saving it as a password. It's a bit of a hack, but it could work. Just make sure you handle it in your app logic!
Honestly, I think showing a 'Forgot Password?' link instead might be the way to go. If users click it intentionally, Chrome may see that as a different action, so it won't save the wrong password. This can also guide users better without confusion.
Related Questions
How to Build a Custom GPT Journalist That Posts Directly to WordPress
Cloudflare Origin SSL Certificate Setup Guide
How To Effectively Monetize A Site With Ads