Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Workaround for logging objects to console in Chrome

If you execute this code:

var foo = {bar: 'baz'};
window.console.log(foo);
foo.bar = 'bla';

The console shows this after expanding the object:

(when logging objects and arrays, it's not the run-time value that's recorded)

This bug was documented over a year ago:

http://code.google.com/p/chromium/issues/detail?id=50316

Is there a workaround for logging objects in Chrome?

like image 803
Ed Mazur Avatar asked Sep 22 '11 21:09

Ed Mazur


People also ask

How do I enable Console debugging in Chrome?

Click the Console tab. Press Control + [ or Command + [ (Mac) until the Console is in focus. Open the Command Menu, start typing Console , select the Show Console Panel command, and then press Enter .

How do you access the Console in Chrome?

To open the developer console in Google Chrome, open the Chrome Menu in the upper-right-hand corner of the browser window and select More Tools > Developer Tools. You can also use Option + ⌘ + J (on macOS), or Shift + CTRL + J (on Windows/Linux).


1 Answers

I just use JSON.stringify when i need it. Don't know if it will do it for you, but it is easy and effective for debugging purposes.

This is no good for objects with function references in it tho, so if you need that i would consider using either a deep copy of the object (you can use jQuery's excellent extend method) or roll you own logging function that will loop recursively over the object and print it out.

like image 103
Martin Jespersen Avatar answered Sep 21 '22 08:09

Martin Jespersen