Bug 1593933 - [devtools] Navigating should close existing console.gro…

…up messages. r=nchevobbe

When a navigation message is added into the store, reset the currentGroup property
This adds a test to ensure the fix works as expected.

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

devtools/client/webconsole/reducers/messages.js

@@ -117,7 +117,14 @@ function cloneState(state) {
  */
 // eslint-disable-next-line complexity
 function addMessage(newMessage, state, filtersState, prefsState, uiState) {
-  const { messagesById, groupsById, currentGroup, repeatById } = state;
+  const { messagesById, groupsById, repeatById } = state;
+
+  if (newMessage.type === constants.MESSAGE_TYPE.NAVIGATION_MARKER) {
+    // We set the state's currentGroup property to null after navigating
+    state.currentGroup = null;
+  }
+  const { currentGroup } = state;
+
   if (newMessage.type === constants.MESSAGE_TYPE.NULL_MESSAGE) {
     // When the message has a NULL type, we don't add it.
     return state;

devtools/client/webconsole/test/browser/_webconsole.ini

@@ -196,6 +196,7 @@ tags = mcb
 [browser_webconsole_clickable_urls.js]
 [browser_webconsole_close_unfocused_window.js]
 [browser_webconsole_closing_after_completion.js]
+[browser_webconsole_close_groups_after_navigation.js]
 [browser_webconsole_close_sidebar.js]
 skip-if = true # Bug 1405250
 [browser_webconsole_console_api_iframe.js]

devtools/client/webconsole/test/browser/browser_webconsole_close_groups_after_navigation.js

@@ -0,0 +1,29 @@
+/* Any copyright is dedicated to the Public Domain.
+ * http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+const TEST_URI = `data:text/html;charset=utf8,<script>console.group('hello')</script>`;
+
+add_task(async function() {
+  // Enable persist logs
+  await pushPref("devtools.webconsole.persistlog", true);
+
+  const hud = await openNewTabAndConsole(TEST_URI);
+
+  info("Refresh tab several times and check for correct message indentation");
+  for (let i = 0; i < 5; i++) {
+    await refreshTabAndCheckIndent(hud);
+  }
+});
+
+async function refreshTabAndCheckIndent(hud) {
+  const onMessage = waitForMessage(hud, "hello");
+  await refreshTab();
+  const { node } = await onMessage;
+
+  is(
+    node.querySelector(".indent").getAttribute("data-indent"),
+    "0",
+    "The message has the expected indent"
+  );
+}