Rows in output from console.table do not line up if output in columns has different number of rows

RESOLVED DUPLICATE of bug 1113825

Status

()

Firefox
Developer Tools: Console
--
minor
RESOLVED DUPLICATE of bug 1113825
4 years ago
2 years ago

People

(Reporter: andrew, Unassigned)

Tracking

35 Branch
x86
Mac OS X
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [polish-backlog])

Attachments

(2 attachments)

(Reporter)

Description

4 years ago
Created attachment 8520683 [details]
console.table output.

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10) AppleWebKit/600.1.25 (KHTML, like Gecko) Version/8.0 Safari/600.1.25

Steps to reproduce:

Output an object to the console using console.table. Some properties contain long strings, some are very short.


Actual results:

Rows do not line up. There is no extra space under short values to ensure that the next row has all of its contents horizontally aligned.


Expected results:

All cells in a single row should be the same height
(Reporter)

Updated

4 years ago
Severity: normal → minor
Component: Untriaged → Developer Tools: Console
This problem still exists in nightly firefox 37.0a1 (2014-12-12), in my case on windows xp.

Here's a scratchpad I used to test it.

Find the badly aligned table in the Browser Console.

,---
// -sp-context: browser
let tabs = [];
for (i = 0; i < gBrowser.tabs.length; i++) {
  tabs.push({title: gBrowser.tabs[i].label,
             href: gBrowser.tabs[i].linkedBrowser._contentWindow.content.document.location.href});
  // console.log(gBrowser.tabs[i].label, gBrowser.tabs[i].linkedBrowser._contentWindow.content.document.location.href);
}
console.table(tabs);
console.log('Browser has %d open tabs, logged above with clickable links.', gBrowser.tabs.length);
`---
Status: UNCONFIRMED → NEW
Ever confirmed: true
console.table([1,2,3,4,5])

is enough to show the columns vertical alignment getting out of step.

Each column is inside its owns vbox element.

How can all heights be in alignment with each other in that design?
(function () {
  var text = 'console.table rows don\'t line up.\n';
  var sample = [];
  for (var i = 0; i < 6; i++) {
    sample.push(text);
    text += text;
  }
  console.table(sample);
})();

Above scratchpad snippet should show the table row mis-alignment quite clearly.
Created attachment 8548409 [details]
console-table-1097075.png

console output produced by scrachpad snippet in comment 3.
Whiteboard: [polish-backlog]
Status: NEW → RESOLVED
Last Resolved: 2 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 1113825
You need to log in before you can comment on or make changes to this bug.