Bug 1629590 - Don't show certificate categories on about:certificate if they're empty. r=carolina.jimenez.g

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

toolkit/components/certviewer/AboutCertViewerHandler.jsm

@@ -15,7 +15,6 @@ const TYPE_CA = 1;
 const TYPE_USER = 2;
 const TYPE_EMAIL = 4;
 const TYPE_SERVER = 8;
-const TYPE_ANY = 0xffff;
 
 var AboutCertViewerHandler = {
   _inited: false,
@@ -28,7 +27,6 @@ var AboutCertViewerHandler = {
       [TYPE_USER]: [],
       [TYPE_EMAIL]: [],
       [TYPE_SERVER]: [],
-      [TYPE_ANY]: [],
     };
     let certdb = Cc["@mozilla.org/security/x509certdb;1"].getService(
       Ci.nsIX509CertDB

toolkit/components/certviewer/content/certviewer.js

@@ -416,7 +416,7 @@ const render = async (certs, error, isAboutCertificate = false) => {
     const AboutCertificateSection = customElements.get(
       "about-certificate-section"
     );
-    document.querySelector("body").append(new AboutCertificateSection(certs));
+    document.querySelector("body").append(new AboutCertificateSection());
   } else {
     await customElements.whenDefined("certificate-section");
     const CertificateSection = customElements.get("certificate-section");

toolkit/components/certviewer/content/components/about-certificate-section.js

@@ -14,9 +14,8 @@ const TYPE_EMAIL = 4;
 const TYPE_SERVER = 8;
 
 export class AboutCertificateSection extends HTMLElement {
-  constructor(certs) {
+  constructor() {
     super();
-    this.certs = certs;
   }
 
   connectedCallback() {
@@ -31,29 +30,6 @@ export class AboutCertificateSection extends HTMLElement {
     this.shadowRoot.appendChild(this.certificateTabsSection.tabsElement);
     this.infoGroupsContainers = new InfoGroupContainer(true);
 
-    this.certData = {
-      [TYPE_UNKNOWN]: {
-        name: "certificate-viewer-tab-unkonwn",
-        data: null,
-      },
-      [TYPE_CA]: {
-        name: "certificate-viewer-tab-ca",
-        data: null,
-      },
-      [TYPE_USER]: {
-        name: "certificate-viewer-tab-mine",
-        data: null,
-      },
-      [TYPE_EMAIL]: {
-        name: "certificate-viewer-tab-people",
-        data: null,
-      },
-      [TYPE_SERVER]: {
-        name: "certificate-viewer-tab-servers",
-        data: null,
-      },
-    };
-
     this.render();
   }
 
@@ -69,23 +45,46 @@ export class AboutCertificateSection extends HTMLElement {
   }
 
   filterCerts(message) {
-    this.certData[TYPE_UNKNOWN].data = message.data.certs[TYPE_UNKNOWN];
-    this.certData[TYPE_CA].data = message.data.certs[TYPE_CA];
-    this.certData[TYPE_USER].data = message.data.certs[TYPE_USER];
-    this.certData[TYPE_EMAIL].data = message.data.certs[TYPE_EMAIL];
-    this.certData[TYPE_SERVER].data = message.data.certs[TYPE_SERVER];
+    let certs = [];
+    if (message.data.certs[TYPE_USER].length) {
+      certs.push({
+        name: "certificate-viewer-tab-mine",
+        data: message.data.certs[TYPE_USER],
+      });
+    }
+    if (message.data.certs[TYPE_EMAIL].length) {
+      certs.push({
+        name: "certificate-viewer-tab-people",
+        data: message.data.certs[TYPE_EMAIL],
+      });
+    }
+    if (message.data.certs[TYPE_SERVER].length) {
+      certs.push({
+        name: "certificate-viewer-tab-servers",
+        data: message.data.certs[TYPE_SERVER],
+      });
+    }
+    if (message.data.certs[TYPE_CA].length) {
+      certs.push({
+        name: "certificate-viewer-tab-ca",
+        data: message.data.certs[TYPE_CA],
+      });
+    }
+    if (message.data.certs[TYPE_UNKNOWN].length) {
+      certs.push({
+        name: "certificate-viewer-tab-unkonwn",
+        data: message.data.certs[TYPE_UNKNOWN],
+      });
+    }
 
-    let final = false;
     let i = 0;
-    for (let data of Object.values(this.certData)) {
-      if (i === this.certs.length - 1) {
-        final = true;
-      }
-      this.infoGroupsContainers.createInfoGroupsContainers({}, i, final, data);
+    for (let cert of certs) {
+      let final = i == certs.length - 1;
+      this.infoGroupsContainers.createInfoGroupsContainers({}, i, final, cert);
       this.shadowRoot.appendChild(
         this.infoGroupsContainers.infoGroupsContainers[i]
       );
-      this.certificateTabsSection.createTabSection(data.name, i);
+      this.certificateTabsSection.createTabSection(cert.name, i);
       this.infoGroupsContainers.addClass("selected", 0);
       i++;
     }

toolkit/components/certviewer/tests/browser/browser_checkStandAlonePage.js

@@ -8,129 +8,43 @@ const TYPE_CA = 1;
 const TYPE_USER = 2;
 const TYPE_EMAIL = 4;
 const TYPE_SERVER = 8;
-const TYPE_ANY = 0xffff;
-
-add_task(async function test_certificateItems() {
-  await BrowserTestUtils.openNewForegroundTab(gBrowser, () => {
-    gBrowser.selectedTab = BrowserTestUtils.addTab(
-      gBrowser,
-      "about:certificate"
-    );
-  });
-
-  await SpecialPowers.spawn(gBrowser.selectedBrowser, [], async function() {
-    let aboutCertificateSection = await ContentTaskUtils.waitForCondition(
-      () => {
-        return content.document.querySelector("about-certificate-section");
-      },
-      "Found aboutCertificateSection."
-    );
-
-    let certificateTabs = aboutCertificateSection.shadowRoot.querySelectorAll(
-      ".certificate-tab"
-    );
-    let expected = [
-      "Unknown",
-      "Authorities",
-      "Servers",
-      "People",
-      "Your Certificates",
-    ];
-    Assert.ok(certificateTabs, "Certificate tabs should exist.");
-    Assert.equal(
-      certificateTabs.length,
-      expected.length,
-      `There should be ${expected.length} tabs.`
-    );
-    let checked = []; // to avoid repeated tabs
-    for (let tab of certificateTabs) {
-      Assert.ok(
-        expected.includes(tab.textContent) &&
-          !checked.includes(tab.textContent),
-        `${tab.textContent} should be one tab`
-      );
-      checked.push(tab.textContent);
-    }
-
-    let certificateItems = aboutCertificateSection.shadowRoot.querySelectorAll(
-      "about-certificate-items"
-    );
-    Assert.ok(certificateItems, "Certificate items should exist.");
-    Assert.equal(
-      certificateItems.length,
-      certificateTabs.length,
-      `There should be ${certificateTabs.length} certificate items`
-    );
-
-    for (let item of certificateItems) {
-      let listItems = item.shadowRoot.querySelectorAll("list-item");
-      Assert.ok(listItems, "list items should exist");
-    }
-  });
-  gBrowser.removeCurrentTab(); // closes about:certificate
-});
-
-async function checkItem(expected) {
-  await BrowserTestUtils.openNewForegroundTab(gBrowser, () => {
-    gBrowser.selectedTab = BrowserTestUtils.addTab(
-      gBrowser,
-      "about:certificate"
-    );
-  });
-
-  await SpecialPowers.spawn(
-    gBrowser.selectedBrowser,
-    [expected],
-    async function(expected) {
-      let aboutCertificateSection = await ContentTaskUtils.waitForCondition(
-        () => {
-          return content.document.querySelector("about-certificate-section");
-        },
-        "Found aboutCertificateSection."
-      );
-
-      let tab = aboutCertificateSection.shadowRoot.querySelector(
-        `.certificate-tabs #certificate-viewer-tab-${expected.certificateItemsID}`
-      );
-      Assert.ok(tab, `${expected.tabName} tab should exist.`);
-      tab.click();
-
-      let certificateItems = aboutCertificateSection.shadowRoot.querySelector(
-        `.info-groups #certificate-viewer-tab-${expected.certificateItemsID}`
-      );
-
-      let listItems = certificateItems.shadowRoot.querySelectorAll("list-item");
-      if (expected.displayName == null) {
-        Assert.equal(
-          listItems.length,
-          0,
-          "There shouldn't be elements in the list"
-        );
-      } else {
-        let found = false;
-        for (let item of listItems) {
-          let name = item.shadowRoot.querySelector(".item-name").textContent;
-          if (name == expected.displayName) {
-            found = true;
-            break;
-          }
-        }
-        Assert.equal(found, true, `${expected.displayName} should be listed`);
-      }
-    }
-  );
-  gBrowser.removeCurrentTab(); // closes about:certificate
-}
 
 add_task(async function test_dbItemDisplayed() {
-  let certs = {
-    [TYPE_UNKNOWN]: null,
-    [TYPE_CA]: null,
-    [TYPE_USER]: null,
-    [TYPE_EMAIL]: null,
-    [TYPE_SERVER]: null,
-    [TYPE_ANY]: null,
-  };
+  await BrowserTestUtils.openNewForegroundTab(gBrowser, () => {
+    gBrowser.selectedTab = BrowserTestUtils.addTab(
+      gBrowser,
+      "about:certificate"
+    );
+  });
+
+  let categories = [
+    {
+      type: TYPE_UNKNOWN,
+      tabName: "Unknown",
+      id: "unkonwn",
+    },
+    {
+      type: TYPE_CA,
+      tabName: "Authorities",
+      id: "ca",
+    },
+    {
+      type: TYPE_USER,
+      tabName: "Your Certificates",
+      id: "mine",
+    },
+    {
+      type: TYPE_EMAIL,
+      tabName: "People",
+      id: "people",
+    },
+    {
+      type: TYPE_SERVER,
+      tabName: "Servers",
+      id: "servers",
+    },
+  ];
+
   let certdb = Cc["@mozilla.org/security/x509certdb;1"].getService(
     Ci.nsIX509CertDB
   );
@@ -138,48 +52,42 @@ add_task(async function test_dbItemDisplayed() {
   let certcache = certdb.getCerts();
   Assert.ok(certcache, "certcache not null");
 
-  let totalSaved = 0;
   for (let cert of certcache) {
-    if (totalSaved == certs.length) {
-      break;
-    }
-    if (certs[cert.certType] == null) {
-      totalSaved += 1;
-      certs[cert.certType] = {
-        displayName: cert.displayName,
-      };
-    }
+    let category = categories.find(({ type }) => type & cert.certType);
+
+    await SpecialPowers.spawn(
+      gBrowser.selectedBrowser,
+      [cert.displayName, category],
+      async function(displayName, category) {
+        let aboutCertificateSection = await ContentTaskUtils.waitForCondition(
+          () => {
+            return content.document.querySelector("about-certificate-section");
+          },
+          "Found aboutCertificateSection."
+        );
+
+        let tab = aboutCertificateSection.shadowRoot.querySelector(
+          `.certificate-tabs #certificate-viewer-tab-${category.id}`
+        );
+        Assert.ok(tab, `${category.tabName} tab should exist.`);
+        tab.click();
+
+        let certificateItems = aboutCertificateSection.shadowRoot.querySelector(
+          `.info-groups #certificate-viewer-tab-${category.id}`
+        );
+
+        let listItems = certificateItems.shadowRoot.querySelectorAll(
+          "list-item"
+        );
+
+        let item = Array.from(listItems).find(
+          i =>
+            i.shadowRoot.querySelector(".item-name").textContent == displayName
+        );
+        Assert.ok(item, `${displayName} should be listed`);
+      }
+    );
   }
 
-  let tests = [
-    {
-      tabName: "Unknown",
-      displayName: certs[TYPE_UNKNOWN] ? certs[TYPE_UNKNOWN].displayName : null,
-      certificateItemsID: "unkonwn",
-    },
-    {
-      tabName: "Authorities",
-      displayName: certs[TYPE_CA] ? certs[TYPE_CA].displayName : null,
-      certificateItemsID: "ca",
-    },
-    {
-      tabName: "Servers",
-      displayName: certs[TYPE_SERVER] ? certs[TYPE_SERVER].displayName : null,
-      certificateItemsID: "servers",
-    },
-    {
-      tabName: "People",
-      displayName: certs[TYPE_EMAIL] ? certs[TYPE_EMAIL].displayName : null,
-      certificateItemsID: "people",
-    },
-    {
-      tabName: "Your Certificates",
-      displayName: certs[TYPE_USER] ? certs[TYPE_USER].displayName : null,
-      certificateItemsID: "mine",
-    },
-  ];
-
-  for (let test of tests) {
-    await checkItem(test);
-  }
+  gBrowser.removeCurrentTab(); // closes about:certificate
 });