--- a/devtools/client/webconsole/new-console-output/test/mochitest/browser_webconsole_console_group.js
+++ b/devtools/client/webconsole/new-console-output/test/mochitest/browser_webconsole_console_group.js
@@ -11,29 +11,29 @@
 const TEST_URI = "http://example.com/browser/devtools/client/webconsole/new-console-output/test/mochitest/test-console-group.html";
 const { INDENT_WIDTH } = require("devtools/client/webconsole/new-console-output/components/message-indent");
 
 add_task(function* () {
   let toolbox = yield openNewTabAndToolbox(TEST_URI, "webconsole");
   let hud = toolbox.getCurrentPanel().hud;
 
   const store = hud.ui.newConsoleOutput.getStore();
-  // Adding loggin each time the store is modified in order to check
+  // Adding logging each time the store is modified in order to check
   // the store state in case of failure.
   store.subscribe(() => {
-    const messages = store.getState().messages.messagesById.toJS()
-      .map(message => {
-        return {
+    const messages = store.getState().messages.messagesById
+      .reduce(function (res, message) {
+        res.push({
           id: message.id,
           type: message.type,
           parameters: message.parameters,
           messageText: message.messageText
-        };
-      }
-    );
+        });
+        return res;
+      }, []);
     info("messages : " + JSON.stringify(messages));
   });
 
   yield ContentTask.spawn(gBrowser.selectedBrowser, null, function () {
     content.wrappedJSObject.doLog();
   });
 
   info("Test a group at root level");

--- a/devtools/client/webconsole/new-console-output/test/store/filters.test.js
+++ b/devtools/client/webconsole/new-console-output/test/store/filters.test.js
@@ -3,169 +3,168 @@
 
 "use strict";
 
 const expect = require("expect");
 
 const actions = require("devtools/client/webconsole/new-console-output/actions/index");
 const { messageAdd } = require("devtools/client/webconsole/new-console-output/actions/index");
 const { ConsoleCommand } = require("devtools/client/webconsole/new-console-output/types");
-const { getAllMessages } = require("devtools/client/webconsole/new-console-output/selectors/messages");
+const { getVisibleMessages } = require("devtools/client/webconsole/new-console-output/selectors/messages");
 const { getAllFilters } = require("devtools/client/webconsole/new-console-output/selectors/filters");
 const { setupStore } = require("devtools/client/webconsole/new-console-output/test/helpers");
 const { MESSAGE_LEVEL } = require("devtools/client/webconsole/new-console-output/constants");
 const { stubPackets } = require("devtools/client/webconsole/new-console-output/test/fixtures/stubs/index");
 const { stubPreparedMessages } = require("devtools/client/webconsole/new-console-output/test/fixtures/stubs/index");
 
 describe("Filtering", () => {
   let store;
   let numMessages;
   // Number of messages in prepareBaseStore which are not filtered out, i.e. Evaluation
   // Results, console commands and console.groups .
   const numUnfilterableMessages = 3;
 
   beforeEach(() => {
     store = prepareBaseStore();
     store.dispatch(actions.filtersClear());
-    numMessages = getAllMessages(store.getState()).size;
+    numMessages = getVisibleMessages(store.getState()).length;
   });
 
   describe("Level filter", () => {
     it("filters log messages", () => {
       store.dispatch(actions.filterToggle(MESSAGE_LEVEL.LOG));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages - 3);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages - 3);
     });
 
     it("filters debug messages", () => {
       store.dispatch(actions.filterToggle(MESSAGE_LEVEL.DEBUG));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages - 1);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages - 1);
     });
 
     // @TODO add info stub
     it("filters info messages");
 
     it("filters warning messages", () => {
       store.dispatch(actions.filterToggle(MESSAGE_LEVEL.WARN));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages - 1);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages - 1);
     });
 
     it("filters error messages", () => {
       store.dispatch(actions.filterToggle(MESSAGE_LEVEL.ERROR));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages - 1);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages - 1);
     });
 
     it("filters css messages", () => {
       let message = stubPreparedMessages.get(
         "Unknown property ‘such-unknown-property’.  Declaration dropped."
       );
       store.dispatch(messageAdd(message));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages);
 
       store.dispatch(actions.filterToggle("css"));
-      messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages + 1);
+      messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages + 1);
     });
 
     it("filters xhr messages", () => {
       let message = stubPreparedMessages.get("XHR GET request");
       store.dispatch(messageAdd(message));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages);
 
       store.dispatch(actions.filterToggle("netxhr"));
-      messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages + 1);
+      messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages + 1);
     });
 
     it("filters network messages", () => {
       let message = stubPreparedMessages.get("GET request");
       store.dispatch(messageAdd(message));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages);
 
       store.dispatch(actions.filterToggle("net"));
-      messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages + 1);
+      messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages + 1);
     });
   });
 
   describe("Text filter", () => {
     it("matches on value grips", () => {
       store.dispatch(actions.filterTextSet("danger"));
-
-      let messages = getAllMessages(store.getState());
-      expect(messages.size - numUnfilterableMessages).toEqual(1);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length - numUnfilterableMessages).toEqual(1);
     });
 
     it("matches unicode values", () => {
       store.dispatch(actions.filterTextSet("鼬"));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size - numUnfilterableMessages).toEqual(1);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length - numUnfilterableMessages).toEqual(1);
     });
 
     it("matches locations", () => {
       // Add a message with a different filename.
       let locationMsg =
         Object.assign({}, stubPackets.get("console.log('foobar', 'test')"));
       locationMsg.message =
         Object.assign({}, locationMsg.message, { filename: "search-location-test.js" });
       store.dispatch(messageAdd(locationMsg));
 
       store.dispatch(actions.filterTextSet("search-location-test.js"));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size - numUnfilterableMessages).toEqual(1);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length - numUnfilterableMessages).toEqual(1);
     });
 
     it("matches stacktrace functionName", () => {
       let traceMessage = stubPackets.get("console.trace()");
       store.dispatch(messageAdd(traceMessage));
 
       store.dispatch(actions.filterTextSet("testStacktraceFiltering"));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size - numUnfilterableMessages).toEqual(1);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length - numUnfilterableMessages).toEqual(1);
     });
 
     it("matches stacktrace location", () => {
       let traceMessage = stubPackets.get("console.trace()");
       traceMessage.message =
         Object.assign({}, traceMessage.message, {
           filename: "search-location-test.js",
           lineNumber: 85,
           columnNumber: 13
         });
 
       store.dispatch(messageAdd(traceMessage));
 
       store.dispatch(actions.filterTextSet("search-location-test.js:85:13"));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size - numUnfilterableMessages).toEqual(1);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length - numUnfilterableMessages).toEqual(1);
     });
 
     it("restores all messages once text is cleared", () => {
       store.dispatch(actions.filterTextSet("danger"));
       store.dispatch(actions.filterTextSet(""));
 
-      let messages = getAllMessages(store.getState());
-      expect(messages.size).toEqual(numMessages);
+      let messages = getVisibleMessages(store.getState());
+      expect(messages.length).toEqual(numMessages);
     });
   });
 
   describe("Combined filters", () => {
     // @TODO add test
     it("filters");
   });
 });
@@ -184,32 +183,32 @@ describe("Clear filters", () => {
       "css": true,
       "debug": true,
       "error": false,
       "info": true,
       "log": true,
       "net": false,
       "netxhr": true,
       "warn": true,
-      "text": "foobar"
+      "text": "foobar",
     });
 
     store.dispatch(actions.filtersClear());
 
     filters = getAllFilters(store.getState());
     expect(filters.toJS()).toEqual({
       "css": false,
       "debug": true,
       "error": true,
       "info": true,
       "log": true,
       "net": false,
       "netxhr": false,
       "warn": true,
-      "text": ""
+      "text": "",
     });
   });
 });
 
 function prepareBaseStore() {
   const store = setupStore([
     // Console API
     "console.log('foobar', 'test')",

--- a/devtools/client/webconsole/new-console-output/test/store/messages.test.js
+++ b/devtools/client/webconsole/new-console-output/test/store/messages.test.js
@@ -1,17 +1,19 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 "use strict";
 
 const {
-  getAllMessages,
+  getAllGroupsById,
+  getAllMessagesById,
+  getAllMessagesTableDataById,
   getAllMessagesUiById,
-  getAllGroupsById,
   getCurrentGroup,
+  getVisibleMessages,
 } = require("devtools/client/webconsole/new-console-output/selectors/messages");
 const {
   setupActions,
   setupStore,
   clonePacket
 } = require("devtools/client/webconsole/new-console-output/test/helpers");
 const { stubPackets, stubPreparedMessages } = require("devtools/client/webconsole/new-console-output/test/fixtures/stubs/index");
 const {
@@ -30,233 +32,302 @@ describe("Message reducer:", () => {
   describe("messagesById", () => {
     it("adds a message to an empty store", () => {
       const { dispatch, getState } = setupStore([]);
 
       const packet = stubPackets.get("console.log('foobar', 'test')");
       const message = stubPreparedMessages.get("console.log('foobar', 'test')");
       dispatch(actions.messageAdd(packet));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
 
       expect(messages.first()).toEqual(message);
     });
 
     it("increments repeat on a repeating message", () => {
-      const { dispatch, getState } = setupStore([
-        "console.log('foobar', 'test')",
-        "console.log('foobar', 'test')"
-      ]);
+      const key1 = "console.log('foobar', 'test')";
+      const { dispatch, getState } = setupStore([key1, key1]);
 
-      const packet = clonePacket(stubPackets.get("console.log('foobar', 'test')"));
+      const packet = clonePacket(stubPackets.get(key1));
 
       // Repeat ID must be the same even if the timestamp is different.
       packet.message.timeStamp = 1;
       dispatch(actions.messageAdd(packet));
       packet.message.timeStamp = 2;
       dispatch(actions.messageAdd(packet));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
 
       expect(messages.size).toBe(1);
       expect(messages.first().repeat).toBe(4);
     });
 
     it("does not clobber a unique message", () => {
-      const { dispatch, getState } = setupStore([
-        "console.log('foobar', 'test')",
-        "console.log('foobar', 'test')"
-      ]);
+      const key1 = "console.log('foobar', 'test')";
+      const { dispatch, getState } = setupStore([key1, key1]);
 
-      const packet = stubPackets.get("console.log('foobar', 'test')");
+      const packet = stubPackets.get(key1);
       dispatch(actions.messageAdd(packet));
 
       const packet2 = stubPackets.get("console.log(undefined)");
       dispatch(actions.messageAdd(packet2));
 
-      const messages = getAllMessages(getState());
-
+      const messages = getAllMessagesById(getState());
       expect(messages.size).toBe(2);
       expect(messages.first().repeat).toBe(3);
       expect(messages.last().repeat).toBe(1);
     });
 
     it("adds a message in response to console.clear()", () => {
       const { dispatch, getState } = setupStore([]);
 
       dispatch(actions.messageAdd(stubPackets.get("console.clear()")));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
 
       expect(messages.size).toBe(1);
       expect(messages.first().parameters[0]).toBe("Console was cleared.");
     });
 
     it("clears the messages list in response to MESSAGES_CLEAR action", () => {
       const { dispatch, getState } = setupStore([
         "console.log('foobar', 'test')",
-        "console.log(undefined)"
+        "console.log(undefined)",
+        "console.table(['red', 'green', 'blue']);",
+        "console.group('bar')",
       ]);
 
       dispatch(actions.messagesClear());
 
-      const messages = getAllMessages(getState());
-      expect(messages.size).toBe(0);
+      const state = getState();
+      expect(getAllMessagesById(state).size).toBe(0);
+      expect(getVisibleMessages(state).length).toBe(0);
+      expect(getAllMessagesUiById(state).size).toBe(0);
+      expect(getAllGroupsById(state).size).toBe(0);
+      expect(getAllMessagesTableDataById(state).size).toBe(0);
+      expect(getCurrentGroup(state)).toBe(null);
     });
 
     it("properly limits number of messages", () => {
       const { dispatch, getState } = setupStore([]);
 
       const logLimit = 1000;
       const packet = clonePacket(stubPackets.get("console.log(undefined)"));
 
       for (let i = 1; i <= logLimit + 2; i++) {
         packet.message.arguments = [`message num ${i}`];
         dispatch(actions.messageAdd(packet));
       }
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       expect(messages.count()).toBe(logLimit);
       expect(messages.first().parameters[0]).toBe(`message num 3`);
       expect(messages.last().parameters[0]).toBe(`message num ${logLimit + 2}`);
     });
 
+    it("properly limits number of messages when there are nested groups", () => {
+      const { dispatch, getState } = setupStore([]);
+
+      const logLimit = 1000;
+
+      const packet = clonePacket(stubPackets.get("console.log(undefined)"));
+      const packetGroup = clonePacket(stubPackets.get("console.group('bar')"));
+      const packetGroupEnd = clonePacket(stubPackets.get("console.groupEnd()"));
+
+      packetGroup.message.arguments = [`group-1`];
+      dispatch(actions.messageAdd(packetGroup));
+      packetGroup.message.arguments = [`group-1-1`];
+      dispatch(actions.messageAdd(packetGroup));
+      packetGroup.message.arguments = [`group-1-1-1`];
+      dispatch(actions.messageAdd(packetGroup));
+      packet.message.arguments = [`message-in-group-1`];
+      dispatch(actions.messageAdd(packet));
+      packet.message.arguments = [`message-in-group-2`];
+      dispatch(actions.messageAdd(packet));
+      // Closing group-1-1-1
+      dispatch(actions.messageAdd(packetGroupEnd));
+      // Closing group-1-1
+      dispatch(actions.messageAdd(packetGroupEnd));
+      // Closing group-1
+      dispatch(actions.messageAdd(packetGroupEnd));
+
+      for (let i = 0; i < logLimit; i++) {
+        packet.message.arguments = [`message-${i}`];
+        dispatch(actions.messageAdd(packet));
+      }
+
+      const visibleMessages = getVisibleMessages(getState());
+      const messages = getAllMessagesById(getState());
+
+      expect(messages.count()).toBe(logLimit);
+      expect(visibleMessages.length).toBe(logLimit);
+      expect(visibleMessages[0].parameters[0]).toBe(`message-0`);
+      expect(visibleMessages[logLimit - 1].parameters[0]).toBe(`message-${logLimit - 1}`);
+
+      // The groups were cleaned up.
+      const groups = getAllGroupsById(getState());
+      expect(groups.count()).toBe(0);
+    });
+
     it("properly limits number of groups", () => {
       const { dispatch, getState } = setupStore([]);
 
       const logLimit = 1000;
 
       const packet = clonePacket(stubPackets.get("console.log(undefined)"));
       const packetGroup = clonePacket(stubPackets.get("console.group('bar')"));
       const packetGroupEnd = clonePacket(stubPackets.get("console.groupEnd()"));
 
       for (let i = 0; i < logLimit + 2; i++) {
-        packet.message.arguments = [`message num ${i}`];
         dispatch(actions.messageAdd(packetGroup));
+        packet.message.arguments = [`message-${i}-a`];
+        dispatch(actions.messageAdd(packet));
+        packet.message.arguments = [`message-${i}-b`];
         dispatch(actions.messageAdd(packet));
         dispatch(actions.messageAdd(packetGroupEnd));
       }
 
-      const messages = getAllMessages(getState());
-      expect(messages.count()).toBe(logLimit * 2);
-      expect(messages.get(1).parameters[0]).toBe(`message num 2`);
-      expect(messages.last().parameters[0]).toBe(`message num ${logLimit + 1}`);
-    });
+      const visibleMessages = getVisibleMessages(getState());
+      const messages = getAllMessagesById(getState());
+      // We should have three times the logLimit since each group has one message inside.
+      expect(messages.count()).toBe(logLimit * 3);
+
+      // We should have logLimit number of groups
+      const groups = getAllGroupsById(getState());
+      expect(groups.count()).toBe(logLimit);
+
+      expect(visibleMessages[1].parameters[0]).toBe(`message-2-a`);
+      expect(messages.last().parameters[0]).toBe(`message-${logLimit + 1}-b`);
+    }).timeout(5000);
 
     it("properly limits number of collapsed groups", () => {
       const { dispatch, getState } = setupStore([]);
 
       const logLimit = 1000;
 
       const packet = clonePacket(stubPackets.get("console.log(undefined)"));
       const packetGroupCollapsed = clonePacket(
         stubPackets.get("console.groupCollapsed('foo')"));
       const packetGroupEnd = clonePacket(stubPackets.get("console.groupEnd()"));
 
       for (let i = 0; i < logLimit + 2; i++) {
-        packetGroupCollapsed.message.arguments = [`message num ${i}`];
+        packetGroupCollapsed.message.arguments = [`group-${i}`];
         dispatch(actions.messageAdd(packetGroupCollapsed));
+        packet.message.arguments = [`message-${i}-a`];
+        dispatch(actions.messageAdd(packet));
+        packet.message.arguments = [`message-${i}-b`];
         dispatch(actions.messageAdd(packet));
         dispatch(actions.messageAdd(packetGroupEnd));
       }
 
-      const messages = getAllMessages(getState());
-      expect(messages.count()).toBe(logLimit);
-      expect(messages.first().parameters[0]).toBe(`message num 2`);
-      expect(messages.last().parameters[0]).toBe(`message num ${logLimit + 1}`);
-    });
+      const messages = getAllMessagesById(getState());
+      // We should have three times the logLimit since each group has two message inside.
+      expect(messages.size).toBe(logLimit * 3);
+
+      // We should have logLimit number of groups
+      const groups = getAllGroupsById(getState());
+      expect(groups.count()).toBe(logLimit);
+
+      expect(messages.first().parameters[0]).toBe(`group-2`);
+      expect(messages.last().parameters[0]).toBe(`message-${logLimit + 1}-b`);
+
+      const visibleMessages = getVisibleMessages(getState());
+      expect(visibleMessages.length).toBe(logLimit);
+      const lastVisibleMessage = visibleMessages[visibleMessages.length - 1];
+      expect(lastVisibleMessage.parameters[0]).toBe(`group-${logLimit + 1}`);
+    }).timeout(5000);
 
     it("does not add null messages to the store", () => {
       const { dispatch, getState } = setupStore([]);
 
       const message = stubPackets.get("console.time('bar')");
       dispatch(actions.messageAdd(message));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       expect(messages.size).toBe(0);
     });
 
     it("adds console.table call with unsupported type as console.log", () => {
       const { dispatch, getState } = setupStore([]);
 
       const packet = stubPackets.get("console.table('bar')");
       dispatch(actions.messageAdd(packet));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       const tableMessage = messages.last();
       expect(tableMessage.level).toEqual(MESSAGE_TYPE.LOG);
     });
 
     it("adds console.group messages to the store", () => {
       const { dispatch, getState } = setupStore([]);
 
       const message = stubPackets.get("console.group('bar')");
       dispatch(actions.messageAdd(message));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       expect(messages.size).toBe(1);
     });
 
     it("sets groupId property as expected", () => {
       const { dispatch, getState } = setupStore([]);
 
       dispatch(actions.messageAdd(
         stubPackets.get("console.group('bar')")));
 
       const packet = stubPackets.get("console.log('foobar', 'test')");
       dispatch(actions.messageAdd(packet));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       expect(messages.size).toBe(2);
       expect(messages.last().groupId).toBe(messages.first().id);
     });
 
     it("does not display console.groupEnd messages to the store", () => {
       const { dispatch, getState } = setupStore([]);
 
       const message = stubPackets.get("console.groupEnd('bar')");
       dispatch(actions.messageAdd(message));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       expect(messages.size).toBe(0);
     });
 
     it("filters out message added after a console.groupCollapsed message", () => {
       const { dispatch, getState } = setupStore([]);
 
       const message = stubPackets.get("console.groupCollapsed('foo')");
       dispatch(actions.messageAdd(message));
 
       dispatch(actions.messageAdd(
         stubPackets.get("console.log('foobar', 'test')")));
 
-      const messages = getAllMessages(getState());
-      expect(messages.size).toBe(1);
+      const messages = getVisibleMessages(getState());
+      expect(messages.length).toBe(1);
     });
 
     it("adds console.dirxml call as console.log", () => {
       const { dispatch, getState } = setupStore([]);
 
       const packet = stubPackets.get("console.dirxml(window)");
       dispatch(actions.messageAdd(packet));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       const dirxmlMessage = messages.last();
       expect(dirxmlMessage.level).toEqual(MESSAGE_TYPE.LOG);
     });
   });
 
   describe("messagesUiById", () => {
     it("opens console.trace messages when they are added", () => {
       const { dispatch, getState } = setupStore([]);
 
       const message = stubPackets.get("console.trace()");
       dispatch(actions.messageAdd(message));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       const messagesUi = getAllMessagesUiById(getState());
       expect(messagesUi.size).toBe(1);
       expect(messagesUi.first()).toBe(messages.first().id);
     });
 
     it("clears the messages UI list in response to MESSAGES_CLEAR action", () => {
       const { dispatch, getState } = setupStore([
         "console.log('foobar', 'test')",
@@ -273,17 +344,17 @@ describe("Message reducer:", () => {
     });
 
     it("opens console.group messages when they are added", () => {
       const { dispatch, getState } = setupStore([]);
 
       const message = stubPackets.get("console.group('bar')");
       dispatch(actions.messageAdd(message));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       const messagesUi = getAllMessagesUiById(getState());
       expect(messagesUi.size).toBe(1);
       expect(messagesUi.first()).toBe(messages.first().id);
     });
 
     it("does not open console.groupCollapsed messages when they are added", () => {
       const { dispatch, getState } = setupStore([]);
 
@@ -297,40 +368,40 @@ describe("Message reducer:", () => {
 
   describe("currentGroup", () => {
     it("sets the currentGroup when console.group message is added", () => {
       const { dispatch, getState } = setupStore([]);
 
       const packet = stubPackets.get("console.group('bar')");
       dispatch(actions.messageAdd(packet));
 
-      const messages = getAllMessages(getState());
+      const messages = getAllMessagesById(getState());
       const currentGroup = getCurrentGroup(getState());
       expect(currentGroup).toBe(messages.first().id);
     });
 
     it("sets currentGroup to expected value when console.groupEnd is added", () => {
       const { dispatch, getState } = setupStore([
         "console.group('bar')",
         "console.groupCollapsed('foo')"
       ]);
 
-      let messages = getAllMessages(getState());
+      let messages = getAllMessagesById(getState());
       let currentGroup = getCurrentGroup(getState());
       expect(currentGroup).toBe(messages.last().id);
 
       const endFooPacket = stubPackets.get("console.groupEnd('foo')");
       dispatch(actions.messageAdd(endFooPacket));
-      messages = getAllMessages(getState());
+      messages = getAllMessagesById(getState());
       currentGroup = getCurrentGroup(getState());
       expect(currentGroup).toBe(messages.first().id);
 
       const endBarPacket = stubPackets.get("console.groupEnd('bar')");
       dispatch(actions.messageAdd(endBarPacket));
-      messages = getAllMessages(getState());
+      messages = getAllMessagesById(getState());
       currentGroup = getCurrentGroup(getState());
       expect(currentGroup).toBe(null);
     });
 
     it("resets the currentGroup to null in response to MESSAGES_CLEAR action", () => {
       const { dispatch, getState } = setupStore([
         "console.group('bar')"
       ]);
@@ -344,25 +415,25 @@ describe("Message reducer:", () => {
 
   describe("groupsById", () => {
     it("adds the group with expected array when console.group message is added", () => {
       const { dispatch, getState } = setupStore([]);
 
       const barPacket = stubPackets.get("console.group('bar')");
       dispatch(actions.messageAdd(barPacket));
 
-      let messages = getAllMessages(getState());
+      let messages = getAllMessagesById(getState());
       let groupsById = getAllGroupsById(getState());
       expect(groupsById.size).toBe(1);
       expect(groupsById.has(messages.first().id)).toBe(true);
       expect(groupsById.get(messages.first().id)).toEqual([]);
 
       const fooPacket = stubPackets.get("console.groupCollapsed('foo')");
       dispatch(actions.messageAdd(fooPacket));
-      messages = getAllMessages(getState());
+      messages = getAllMessagesById(getState());
       groupsById = getAllGroupsById(getState());
       expect(groupsById.size).toBe(2);
       expect(groupsById.has(messages.last().id)).toBe(true);
       expect(groupsById.get(messages.last().id)).toEqual([messages.first().id]);
     });
 
     it("resets groupsById in response to MESSAGES_CLEAR action", () => {
       const { dispatch, getState } = setupStore([

--- a/devtools/client/webconsole/new-console-output/test/store/search.test.js
+++ b/devtools/client/webconsole/new-console-output/test/store/search.test.js
@@ -1,86 +1,86 @@
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/ */
 
 "use strict";
 
 const expect = require("expect");
 
 const actions = require("devtools/client/webconsole/new-console-output/actions/index");
-const { getAllMessages } = require("devtools/client/webconsole/new-console-output/selectors/messages");
+const { getVisibleMessages } = require("devtools/client/webconsole/new-console-output/selectors/messages");
 const { setupStore } = require("devtools/client/webconsole/new-console-output/test/helpers");
 
 describe("Searching in grips", () => {
   let store;
 
   beforeEach(() => {
     store = prepareBaseStore();
     store.dispatch(actions.filtersClear());
   });
 
   describe("Search in table & array & object props", () => {
     it("matches on value grips", () => {
       store.dispatch(actions.filterTextSet("red"));
-      expect(getAllMessages(store.getState()).size).toEqual(3);
+      expect(getVisibleMessages(store.getState()).length).toEqual(3);
     });
   });
 
   describe("Search in object value", () => {
     it("matches on value grips", () => {
       store.dispatch(actions.filterTextSet("redValue"));
-      expect(getAllMessages(store.getState()).size).toEqual(1);
+      expect(getVisibleMessages(store.getState()).length).toEqual(1);
     });
   });
 
   describe("Search in regex", () => {
     it("matches on value grips", () => {
       store.dispatch(actions.filterTextSet("a.b.c"));
-      expect(getAllMessages(store.getState()).size).toEqual(1);
+      expect(getVisibleMessages(store.getState()).length).toEqual(1);
     });
   });
 
   describe("Search in map values", () => {
     it("matches on value grips", () => {
       store.dispatch(actions.filterTextSet("value1"));
-      expect(getAllMessages(store.getState()).size).toEqual(1);
+      expect(getVisibleMessages(store.getState()).length).toEqual(1);
     });
   });
 
   describe("Search in map keys", () => {
     it("matches on value grips", () => {
       store.dispatch(actions.filterTextSet("key1"));
-      expect(getAllMessages(store.getState()).size).toEqual(1);
+      expect(getVisibleMessages(store.getState()).length).toEqual(1);
     });
   });
 
   describe("Search in text", () => {
     it("matches on value grips", () => {
       store.dispatch(actions.filterTextSet("myobj"));
-      expect(getAllMessages(store.getState()).size).toEqual(1);
+      expect(getVisibleMessages(store.getState()).length).toEqual(1);
     });
   });
 
   describe("Search in logs with net messages", () => {
     it("matches on network messages", () => {
       store.dispatch(actions.filterToggle("net"));
       store.dispatch(actions.filterTextSet("get"));
-      expect(getAllMessages(store.getState()).size).toEqual(1);
+      expect(getVisibleMessages(store.getState()).length).toEqual(1);
     });
   });
 
   describe("Search in frame", () => {
     it("matches on file name", () => {
       store.dispatch(actions.filterTextSet("test-console-api.html:1:27"));
-      expect(getAllMessages(store.getState()).size).toEqual(7);
+      expect(getVisibleMessages(store.getState()).length).toEqual(7);
     });
 
     it("do not match on full url", () => {
       store.dispatch(actions.filterTextSet("http://example.com/browser/devtools"));
-      expect(getAllMessages(store.getState()).size).toEqual(0);
+      expect(getVisibleMessages(store.getState()).length).toEqual(0);
     });
   });
 });
 
 function prepareBaseStore() {
   const store = setupStore([
     "console.log('foobar', 'test')",
     "console.warn('danger, will robinson!')",