Bug 1549814 - Update the login-list count on login additions and removals. r?MattN draft
authorpulselistener
Sat, 18 May 2019 06:44:22 +0000
changeset 2008538 e299c2edd5ed5295e9e5e66073f7d09ac131f9b7
parent 2008537 aa28ec1268222e4bbafb24f43b8489d05b8bf218
child 2008539 a4376acc05b7c94b226d14671f04b681b44ddb96
push id363921
push userreviewbot
push dateSat, 18 May 2019 06:44:53 +0000
treeherdertry@feb98ece6f65 [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);