Bug 1563914 - Fix ConsoleTable with invalid headers. r=Honza.

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

--HG--
extra : moz-landing-system : lando

devtools/client/webconsole/components/Output/ConsoleTable.js

@@ -160,15 +160,20 @@ function getTableItems(data = {}, type, headers = null) {
     Object.keys(item).forEach(key => addColumn(key));
   };
 
+  const hasValidCustomHeaders =
+    Array.isArray(headers) &&
+    headers.every(
+      header => typeof header === "string" || Number.isInteger(Number(header))
+    );
+
   const addColumn = function(columnIndex) {
     const columnExists = columns.has(columnIndex);
     const hasMaxColumns = columns.size == TABLE_COLUMN_MAX_ITEMS;
-    const hasCustomHeaders = Array.isArray(headers);
 
     if (
       !columnExists &&
       !hasMaxColumns &&
-      (!hasCustomHeaders ||
+      (!hasValidCustomHeaders ||
         headers.includes(columnIndex) ||
         columnIndex === INDEX_NAME)
     ) {
@@ -222,7 +227,7 @@ function getTableItems(data = {}, type, headers = null) {
 
   // Some headers might not be present in the items, so we make sure to
   // return all the headers set by the user.
-  if (Array.isArray(headers)) {
+  if (hasValidCustomHeaders) {
     headers.forEach(header => addColumn(header));
   }
 

devtools/client/webconsole/test/mochitest/browser_webconsole_console_table.js

@@ -138,6 +138,15 @@ add_task(async function() {
         ],
       },
     },
+    {
+      info: "Testing invalid headers",
+      input: ["apples", "oranges", "bananas"],
+      headers: [[]],
+      expected: {
+        columns: ["(index)", "Values"],
+        rows: [["0", "apples"], ["1", "oranges"], ["2", "bananas"]],
+      },
+    },
   ];
 
   await ContentTask.spawn(gBrowser.selectedBrowser, testCases, function(tests) {