I've been trying to search for some documentation on how to hint Google Smart Lock for Chrome to use a specific input field as the one associated with the username without any luck.
For the password it works perfectly as it is using type="password"
but when it comes down to the username in a multi field form, where the username is not specified before the password or not as the first field in the form it picks another of the fields in the form as the username.
Does anyone have any clue on how to hint Google Smart Lock to use a specific input field as the username?
You can use
display: none
css to hide a username input. The following code snippet is taken from Chromium design document. They discuss a few use cases there.Check out this article that explains how to make it work on Chrome, Firefox and Safari for 3 different cases: normal login, username first login and reset password page with verification input first.
I have also made a CodePen where you can try it out.
You just need to put:
on the required field (usually the user's email, or site's user name).
then it will know to use it as the key to the smartlock feature (tested on chrome).
Google smart lock is a build-in feature of chrome, there is the same function on firefox. It based on the last input type="password" to detect password field would be saved. Here are some things I have tested on FireFox and Chrome