Bug 1687485 - [devtools] Fix error count on navigation when console isn't enabled. r=ladybenko.

We used to not do anything on navigation for the error count
at the toolbox level, but the test we had to check that the
count was reset on navigation was working; this is because
there's a hook in the console panel to clear the error count
when the console is cleared, and in the test, the console panel
was selected.
This patch fixes that and adds a new test that run some assertion
on reload, without ever enabling the console panel.
Since some assertions seem redundant with the test we already had,
we remove them from the old test.

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

devtools/client/framework/test/browser.ini

@@ -92,6 +92,7 @@ skip-if = fission # Disable frequent fission intermittents Bug 1675020
 [browser_toolbox_browsertoolbox_host.js]
 [browser_toolbox_contentpage_contextmenu.js]
 [browser_toolbox_dynamic_registration.js]
+[browser_toolbox_error_count_reset_on_navigation.js]
 [browser_toolbox_error_count.js]
 [browser_toolbox_getpanelwhenready.js]
 [browser_toolbox_highlight.js]

devtools/client/framework/test/browser_toolbox_error_count.js

@@ -101,6 +101,24 @@ add_task(async function() {
     () => webconsoleDoc.querySelectorAll(".message.error").length === 0
   );
 
+  info("Check that the error count is capped at 99");
+  expectedErrorCount = 100;
+  ContentTask.spawn(tab.linkedBrowser, expectedErrorCount, function(count) {
+    for (let i = 0; i < count; i++) {
+      content.console.error(i);
+    }
+  });
+
+  // Wait until all the messages are displayed in the console
+  await waitFor(
+    () =>
+      webconsoleDoc.querySelectorAll(".message.error").length ===
+      expectedErrorCount
+  );
+
+  await waitFor(() => getErrorIconCount(toolbox) === "99+");
+  ok(true, "The message count doesn't go higher than 99");
+
   info(
     "Reload the page and check that the error icon has the expected content"
   );
@@ -159,48 +177,6 @@ add_task(async function() {
     true,
     "The error is displayed again, with the correct error count, after enabling it from the settings panel"
   );
-  await toolbox.selectTool("webconsole");
-
-  info(
-    "Navigate to an error-less page and check that the error icon is hidden"
-  );
-  await navigateTo(`data:text/html;charset=utf8,No errors`);
-  await waitFor(() => !getErrorIcon(toolbox));
-  ok(
-    true,
-    "The error icon was hidden when navigating to a new page without errors"
-  );
-
-  info("Check that the error count is capped at 99");
-  expectedErrorCount = 100;
-  ContentTask.spawn(tab.linkedBrowser, expectedErrorCount, function(count) {
-    for (let i = 0; i < count; i++) {
-      content.console.error(i);
-    }
-  });
-
-  // Wait until all the messages are displayed in the console
-  await waitFor(
-    () =>
-      webconsoleDoc.querySelectorAll(".message.error").length ===
-      expectedErrorCount
-  );
-
-  await waitFor(() => getErrorIcon(toolbox)?.textContent === "99+");
-  ok(true, "The message count doesn't go higher than 99");
 
   toolbox.destroy();
 });
-
-function getErrorIcon(toolbox) {
-  return toolbox.doc.querySelector(".toolbox-error");
-}
-
-function getErrorIconCount(toolbox) {
-  const number = getErrorIcon(toolbox)?.textContent;
-  try {
-    return parseInt(number, 10);
-  } catch (e) {
-    return number;
-  }
-}

devtools/client/framework/test/browser_toolbox_error_count_reset_on_navigation.js

@@ -0,0 +1,78 @@
+/* Any copyright is dedicated to the Public Domain.
+ * http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+// Test for error count in toolbar when navigating and webconsole isn't enabled
+const TEST_URI = `http://example.org/document-builder.sjs?html=<meta charset=utf8></meta>
+<script>
+  console.error("Cache Error1");
+  console.exception(false, "Cache Exception");
+  console.warn("Cache warning");
+  console.assert(false, "Cache assert");
+  cache.unknown.access
+</script>`;
+
+const { Toolbox } = require("devtools/client/framework/toolbox");
+
+add_task(async function() {
+  // Make sure we start the test with the split console disabled.
+  // ⚠️ In this test it's important to _not_ enable the console.
+  await pushPref("devtools.toolbox.splitconsoleEnabled", false);
+  const tab = await addTab(TEST_URI);
+
+  const toolbox = await openToolboxForTab(
+    tab,
+    "inspector",
+    Toolbox.HostType.BOTTOM
+  );
+
+  info("Check for cached errors");
+  // (console.error + console.exception + console.assert + error)
+  const expectedErrorCount = 4;
+
+  await waitFor(() => getErrorIcon(toolbox));
+  is(
+    getErrorIcon(toolbox).getAttribute("title"),
+    "Show Split Console",
+    "Icon has expected title"
+  );
+  is(
+    getErrorIconCount(toolbox),
+    expectedErrorCount,
+    "Correct count is displayed"
+  );
+
+  info("Add another error so we have a different count");
+  ContentTask.spawn(tab.linkedBrowser, null, function() {
+    content.console.error("Live Error1");
+  });
+
+  const newExpectedErrorCount = expectedErrorCount + 1;
+  await waitFor(() => getErrorIconCount(toolbox) === newExpectedErrorCount);
+
+  info(
+    "Reload the page and check that the error icon has the expected content"
+  );
+  tab.linkedBrowser.reload();
+
+  await waitFor(
+    () => getErrorIconCount(toolbox) === expectedErrorCount,
+    "Error count is cleared on navigation and then populated with the expected number of errors"
+  );
+  ok(true, "Correct count is displayed");
+
+  info(
+    "Navigate to an error-less page and check that the error icon is hidden"
+  );
+  navigateTo(`data:text/html;charset=utf8,No errors`);
+  await waitFor(
+    () => !getErrorIcon(toolbox),
+    "Error count is cleared on navigation"
+  );
+  ok(
+    true,
+    "The error icon was hidden when navigating to a new page without errors"
+  );
+
+  toolbox.destroy();
+});

devtools/client/framework/test/head.js

@@ -456,3 +456,20 @@ async function sendToolboxReloadShortcut(shortcut, toolbox) {
   info("Wait for page and toolbox reload promises");
   await Promise.all(promises);
 }
+
+function getErrorIcon(toolbox) {
+  return toolbox.doc.querySelector(".toolbox-error");
+}
+
+function getErrorIconCount(toolbox) {
+  const textContent = getErrorIcon(toolbox)?.textContent;
+  try {
+    const int = parseInt(textContent, 10);
+    // 99+ parses to 99, so we check if the parsedInt does not match the textContent.
+    return int.toString() === textContent ? int : textContent;
+  } catch (e) {
+    // In case the parseInt threw, return the actual textContent so the test can display
+    // an easy to debug failure.
+    return textContent;
+  }
+}

devtools/client/framework/toolbox.js

@@ -2982,6 +2982,8 @@ Toolbox.prototype = {
    * Fired when user just started navigating away to another web page.
    */
   async _onWillNavigate() {
+    // Clearing the error count as soon as we navigate
+    this.setErrorCount(0);
     this.updateToolboxButtons();
     const toolId = this.currentToolId;
     // For now, only inspector, webconsole and netmonitor fire "reloaded" event