Bug 142322 - Web Inspector: Better Console Previews for Arrays / Small Objects
Summary: Web Inspector: Better Console Previews for Arrays / Small Objects
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Normal
Assignee: Joseph Pecoraro
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2015-03-04 19:50 PST by Joseph Pecoraro
Modified: 2015-03-16 21:42 PDT (History)
8 users (show)

See Also:


Attachments
[PATCH] Proposed Fix (18.79 KB, patch)
2015-03-15 23:21 PDT, Joseph Pecoraro
timothy: review+
Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Joseph Pecoraro 2015-03-04 19:50:48 PST
* SUMMARY
Better Console Previews for Arrays / Small Objects.

Currently:

  js> [[1], ["2"], [3]]
  <-  ▶︎ [Array, Array, Array] (3)

  js> [[[[1]]]]
  <-  ▶︎ [Array] (1)

  js> [{a:1}]
  <-  ▶︎ [Object] (1)

We should come up with a better strategy for Array Previews.
Comment 1 Radar WebKit Bug Importer 2015-03-04 19:51:07 PST
<rdar://problem/20050336>
Comment 2 Joseph Pecoraro 2015-03-04 20:01:02 PST
The way this worked before, is if an array was printed to the console it would auto-fetch one level deep and print that as an object. Currently, we drop the second level fetch and just go with the Preview, which for non-object data gets us less information.

Things we may want to try:

  - do a second level fetch for Arrays like we used to
    -> handles most of the cases above and is pretty straightforward

  - do a "n-deep" level fetch for Arrays/Objects that are simple
    - simple defined as: (arrays of length < 2, objects with less then 2 properties, non-cyclical)
    -> handles all cases above, but is more complex

  - proactively send out better previews for Arrays based on either of the above strategies
    - more complete snapshots instead of second level fetch where the objects could change
    - won't work with legacy backends since this would require InjectedScript changes
Comment 3 Joseph Pecoraro 2015-03-04 20:03:40 PST
Other examples and their Current behavior:

  js> ({a:[1]}) // and what if the inner array had 10 Objects
  <-  ▶︎ {a: Array}

  js> ({a:{b:1}}) // and what if the inner object had 10 properties
  <-  ▶︎ {a: Object}
Comment 4 Timothy Hatcher 2015-03-04 20:30:20 PST
I like this and is what I really wanted to see. If the object graph is simple enough, show everything. Basically JSON previews. Once it is "complex" stop. You outline the right approaches. Some n-level n-length sounds right.
Comment 5 Timothy Hatcher 2015-03-04 20:32:42 PST
This also makes me wonder if we should make the InjectedScript source be somthing the front end sends to the back end to inject. That way we can update it on older devices (once that support ships on those devices). I guess the InjectedScriptHost still would be a bottleneck…
Comment 6 Joseph Pecoraro 2015-03-15 23:21:26 PDT
Created attachment 248712 [details]
[PATCH] Proposed Fix
Comment 7 Joseph Pecoraro 2015-03-15 23:24:41 PDT
This handles small Arrays / Objects to a depth of 3. It seems okay in practice. There is probably still room for improvement, but for the tests mentioned in this bug it worked well. Of course there is no legacy support for older iOSs.
Comment 8 Timothy Hatcher 2015-03-16 05:29:53 PDT
Comment on attachment 248712 [details]
[PATCH] Proposed Fix

View in context: https://bugs.webkit.org/attachment.cgi?id=248712&action=review

> Source/JavaScriptCore/inspector/InjectedScriptSource.js:1172
> +        if (seen.has(object))

seen might be better called knownObjects.
Comment 9 Joseph Pecoraro 2015-03-16 21:42:43 PDT
<http://trac.webkit.org/changeset/181612>