Change password detection: is not Chromium forms compliant

Hi guys,

thank you for the amazing product!

As a web developer I am really confused with the following issue.

This https://community.bitwarden.com/t/detect-password-changes/35 claims to implement the password change detection.

However it is not working properly if I follow the Chromium recommendations:

https://dev.chromium.org/developers/design-documents/form-styles-that-chromium-understands

Issue appears when I have in my form the recommended username input:

<input hidden type=“text” [value]=“username” autocomplete=“username”>

Chrome and Enpass understand it properly, they update the password for the corresponding user and take the correct password from the second password field. Furhtermore, Chromium-based browsers will save password with “No username” username if I do not have this field on the form.

However bitwarden has two “modes” I found that are both not working:

  • if I add input before three password fields, then it thinks I make a login and offers to update the password taken from the first field which is super wrong. It makes user think that the password gets updated but it is updated to the old value => super wrong
  • if I add input after first password field (to fix the issue above), then Chrome and Enpass still react properly, however bitwarden stops reacting at all. So it is not recognising the form as login and not recognizing the form as change-password kind.

For me it is just kinda no go. Chromium is way bigger, I cannot not support Chromium. So, the only thing I can do is to put the username field as a second field that bitwarden does not react anyhow => not user friendly, but at least not misleading as in first case

Could the bitwarden also understand the chromium-recommended autocomplete properties and allow the username field for password-change forms?

Can you post example HTML of what your form looks like please?

Sure, thank you for quick reply. Here it is:

<form onsubmit="return false;">
  <input hidden type="text" value="some-username" autocomplete="username">

  <input type="password" id="current-password" name="current-password" autocomplete="current-password">
  <input type="password" id="new-password" name="new-password" autocomplete="new-password">
  <input type="password" id="new-password-repeat" name="new-password-repeat" autocomplete="new-password">
  
  <button>Go</button>
</form>

and here is a reproduction on jsfiddle:

https://jsfiddle.net/ya6oLzx5/1/

The markers I refer to are:

autocomplete=“username”
autocomplete=“current-password”
autocomplete=“new-password”