Bug 1549814 - Update the login-list count on login additions and removals. r?MattN draft
authorpulselistener
Sat, 18 May 2019 06:49:12 +0000
changeset 2008571 3ebd89cfd9b0912b860c3e94adaa3c595d5f22cd
parent 2008570 4b660b1afcb53fd21005aecb145722671ad4b630
child 2008572 5d36f520c456447f354447c462c5c6364d85c04d
push id363923
push userreviewbot
push dateSat, 18 May 2019 06:49:52 +0000
treeherdertry@6eb4ec2cb49f [default view] [failures only]
reviewersMattN
bugs1549814
milestone68.0a1
Bug 1549814 - Update the login-list count on login additions and removals. r?MattN Differential Revision: https://phabricator.services.mozilla.com/D31710 Differential Diff: PHID-DIFF-dhcnsmaj2kmrjtqd3suk
browser/components/aboutlogins/content/components/login-list.js
--- a/browser/components/aboutlogins/content/components/login-list.js
+++ b/browser/components/aboutlogins/content/components/login-list.js
@@ -24,16 +24,17 @@ class LoginList extends ReflectedFluentE
     this.render();
 
     window.addEventListener("AboutLoginsLoginSelected", this);
     window.addEventListener("AboutLoginsFilterLogins", this);
   }
 
   render() {
     let list = this.shadowRoot.querySelector("ol");
+    list.textContent = "";
     for (let login of this._logins) {
       list.append(new LoginListItem(login));
     }
     document.l10n.setAttributes(this, "login-list", {count: this._logins.length});
   }
 
   handleEvent(event) {
     switch (event.type) {
@@ -60,44 +61,43 @@ class LoginList extends ReflectedFluentE
         document.l10n.setAttributes(this, "login-list", {count: matchingLoginGuids.length});
         break;
       }
       case "AboutLoginsLoginSelected": {
         if (this._selectedItem) {
           if (this._selectedItem.getAttribute("guid") == event.detail.guid) {
             return;
           }
-          this._selectedItem.classList.toggle("selected", false);
+          this._selectedItem.classList.remove("selected");
         }
         this._selectedItem = this.shadowRoot.querySelector(`login-list-item[guid="${event.detail.guid}"]`);
-        this._selectedItem.classList.toggle("selected", true);
+        this._selectedItem.classList.add("selected");
         break;
       }
     }
   }
 
   static get reflectedFluentIDs() {
     return ["count"];
   }
 
   static get observedAttributes() {
     return this.reflectedFluentIDs;
   }
 
   setLogins(logins) {
-    let list = this.shadowRoot.querySelector("ol");
-    list.textContent = "";
     this._logins = logins;
     this.render();
   }
 
   loginAdded(login) {
     this._logins.push(login);
     let list = this.shadowRoot.querySelector("ol");
     list.append(new LoginListItem(login));
+    document.l10n.setAttributes(this, "login-list", {count: this._logins.length});
   }
 
   loginModified(login) {
     for (let i = 0; i < this._logins.length; i++) {
       if (this._logins[i].guid == login.guid) {
         this._logins[i] = login;
         break;
       }
@@ -115,11 +115,12 @@ class LoginList extends ReflectedFluentE
     this._logins = this._logins.filter(l => l.guid != login.guid);
     let list = this.shadowRoot.querySelector("ol");
     for (let loginListItem of list.children) {
       if (loginListItem.getAttribute("guid") == login.guid) {
         loginListItem.remove();
         break;
       }
     }
+    document.l10n.setAttributes(this, "login-list", {count: this._logins.length});
   }
 }
 customElements.define("login-list", LoginList);