Proper HTML markup and authentication flow for password manager compatibility?

Question

I'm working on a webapp written in angular that seems to have trouble interacting with the various password managers (Dashlane, LastPass, etc) that are out there. Are there any guidelines around HTML markup and authentication flow to ensure compatibility? This is not just for login flow, but also includes things like password reset, user name changes, and so on.

Answer 1

It appears that this question has already been asked, but not in the context of AngularJS.

From https://lastpass.com/support.php?cmd=showfaq&id=3385

While LastPass can work on most website logins, if you are developing your own site you can help make it LastPass-compatible by using a simple form submit with a username, password, and submit field.

Here's an example:

<form action="https://mypage.com/blah" method="post">
  <input type="text" name="username" id="username" value=""/>
  <input type="password" name="password" id="password" value=""/>
  <input type="submit" value="LOGIN"/>
</form>

As far as what to avoid -- always create the form on page load, even if you hide and show it to people clicking log in, it's better to be there on page load. Avoid ajax for logging in and avoid method=GET

So besides giving name attributes to your controls, LastPass recommends having the login form markup already in the HTML when it is first loaded.