Bug 1571748 - Properly update password field width after saving changes. r=MattN

Differential Revision: https://phabricator.services.mozilla.com/D42418

--HG--
extra : moz-landing-system : lando

browser/components/aboutlogins/content/components/login-item.js

@@ -481,8 +481,8 @@ export default class LoginItem extends HTMLElement {
       return;
     }
 
-    this._toggleEditing(false);
     this._login = login;
+    this._toggleEditing(false);
     this.render();
   }
 
@@ -498,8 +498,8 @@ export default class LoginItem extends HTMLElement {
       return;
     }
 
-    this._toggleEditing(false);
     this._login = {};
+    this._toggleEditing(false);
     this.render();
   }
 

browser/components/aboutlogins/tests/browser/browser_updateLogin.js

@@ -105,6 +105,11 @@ add_task(async function test_login_item() {
           login.password,
           "Password change should be reverted"
         );
+        is(
+          passwordInput.style.width,
+          login.password.length + "ch",
+          "Password field width shouldn't have changed"
+        );
       }
 
       await test_discard_dialog(loginList._createLoginButton);
@@ -125,12 +130,6 @@ add_task(async function test_login_item() {
       );
       saveChangesButton.click();
 
-      usernameInput = loginItem.shadowRoot.querySelector(
-        "input[name='username']"
-      );
-      passwordInput = loginItem.shadowRoot.querySelector(
-        "input[name='password']"
-      );
       await ContentTaskUtils.waitForCondition(() => {
         let guid = loginList._loginGuidsSortedOrder[0];
         let updatedLogin = loginList._logins[guid].login;
@@ -145,6 +144,11 @@ add_task(async function test_login_item() {
         !loginItem.dataset.editing,
         "LoginItem should not be in 'edit' mode after saving"
       );
+      is(
+        passwordInput.style.width,
+        passwordInput.value.length + "ch",
+        "Password field width should be correctly updated"
+      );
 
       editButton.click();
       await Promise.resolve();