3

Possible Duplicate:
How do I console.log a jQuery DOM Element in Chrome?

In the latest stable Chrome 23.0.1271.101, and Chrome Canary 26.0.1373.0, running the following code from a script:

$(function(){
    console.log( $('body') )
})

Now returns:

[<body>, prevObject: jQuery.fn.jQuery.init[1], context: #document, selector: "body"]

Hovering over this log out does nothing, it is not inspectable.

The interactive console still works, eg, typing:

console.log( $('body') )

Will correctly respond with:

[<body>...</body>]

When the mouse is hovered over the log output it can be inspected, as previous versions of Chrome used to do for scripts.

  • Is there a way to make Chrome log inspectable elements per previous versions of Chrome, and as the interactive consol still does?
  • Is there a newer or older version of Chrome which does not have this bug?
Community
  • 1
  • 1
mikemaccana
  • 110,530
  • 99
  • 389
  • 494
  • I believe the difference is whether the console is open at the time of log. I noticed the same with `[1,2]` being converted to `>Arguments` on debug tools close and reopen. – John Dvorak Jan 03 '13 at 10:29
  • @JanDvorak Running the script with the inspector closed logs different looking output - it appears as 'jQuery.fn.jQuery.init[1]' rather than '[, prevObject: jQuery.fn.jQuery.init[1], context: #document, selector: "body"]' but it still isn't inspectable. – mikemaccana Jan 03 '13 at 10:33
  • You can expand the elements, but you won't get the DOM view. I'm still not sure if it's meant to be a BOF. – John Dvorak Jan 03 '13 at 10:34
  • Strange, native DOM nodes seem to be lost from the reopened view _altogether_. – John Dvorak Jan 03 '13 at 10:35
  • @JanDvorak Yep, that's what I mean: I need the DOM view. – mikemaccana Jan 03 '13 at 10:36
  • @pimvdb Ah you're right this is a dupe. I couldn't see the other question when I searched. – mikemaccana Jan 03 '13 at 10:38
  • I'm going to fave the dupe to notify/get notified when the Chrome dev team gets this fixed. – John Dvorak Jan 03 '13 at 10:47
  • Don't worry, asking a dupe isn't a shame (unless your duplicate is the first thing in the related section ;-) ) and it might even net you some positive score as it serves as a potential search target. – John Dvorak Jan 03 '13 at 10:49

2 Answers2

4

To achieve what Chrome previously used to do, append [0] to the function.

As pointed out by JanDvorak, this may not work in all cases, and provide only the first element, but works in some cases. 

$(function(){
    console.log($('body')[0]);
});

Update

From here, there is a jQuery plugin jquery.chromelog made by pimvdb, which seems the way to go.

Community
  • 1
  • 1
Pranav 웃
  • 8,469
  • 6
  • 38
  • 48
0

As a workaround, the inspector in Safari 6.0.2 (7536.26.17) still logs inspectable JQuery objects.

mikemaccana
  • 110,530
  • 99
  • 389
  • 494