Web Inspector: New ObjectTree UI for Arrays / Maps / Sets

• Component: Web Inspector
• Status: RESOLVED FIXED

[Joseph Pecoraro]

* SUMMARY
New ObjectTree UI for Arrays / Maps / Sets.

[Radar WebKit Bug Importer]

<rdar://problem/19964703>

[Joseph Pecoraro]

Created attachment 247391 [details]
[PATCH] Proposed Fix

There is room for improving this UI. When I update "Prototype" button UI I'll take tips on cleaning this up a bit.

Known bad case, expanding a very large Array. But that was already bad to begin with.

For instance expanding `document.all` on a large page performs horribly.

For this to be fixed we will need to fetch arrays in groups. We need better large collection support anyways.

Collections only grab 100 elements at a time. So they are prepared. But they are also unsupported.

[Joseph Pecoraro]

Created attachment 247392 [details]
[IMAGE] Arrays

[Joseph Pecoraro]

Created attachment 247393 [details]
[IMAGE] Set

[Joseph Pecoraro]

Created attachment 247394 [details]
[IMAGE] Map

[Joseph Pecoraro]

Created attachment 247395 [details]
[IMAGE] Nested 1

[Joseph Pecoraro]

Created attachment 247396 [details]
[IMAGE] Nested 2

[Timothy Hatcher]

Comment on attachment 247391 [details]
[PATCH] Proposed Fix

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

> Source/WebInspectorUI/UserInterface/Models/PropertyPath.js:218
> +            }
> +            var component = ".get(" + keyObject.description + ")";

Nit: newline.

> Source/WebInspectorUI/UserInterface/Views/ObjectTreeArrayIndexTreeElement.css:55
> +/* FIXME: Should this be all the time? */
> +.object-tree-array-index .index-value .object-tree {
> +    display: inline-block;
>  }

I think inline-block makes sense.

> Source/WebInspectorUI/UserInterface/Views/ObjectTreeSetIndexTreeElement.js:65
> +        // Array index name.

Set bullet.

> Source/WebInspectorUI/UserInterface/Views/ObjectTreeView.js:309
> +        // FIXME: This only tries to release weak entries if this object was a WeakMap.
> +        // If there was a WeakMap expanded in a sub-object, we will never release those values.
> +        // Should we attempt walking the entire tree and release weak collections?

Walking the descendant TreeElements might be fine when a parent is expanded or collapsed.

[Timothy Hatcher]

Comment on attachment 247394 [details]
[IMAGE] Map

Why did you need to use dir()? I would expect the first log of m to output an expandable Map since Person is lossy.

[Timothy Hatcher]

Comment on attachment 247393 [details]
[IMAGE] Set

Similar here. Object in the preview is lossy.

[Timothy Hatcher]

Comment on attachment 247392 [details]
[IMAGE] Arrays

I wonder if we should drop the [n] counts for Arrays. They are distracting. (n) would look better.

I also wonder if the lossy preview for Object and Array should be {...} and [...]. (And if there is a object name, Person {...}.)

[Timothy Hatcher]

Comment on attachment 247392 [details]
[IMAGE] Arrays

Why is length in prototype and why is it 0?

[Joseph Pecoraro]

(In reply to comment #12)
> Comment on attachment 247392 [details]
> [IMAGE] Arrays
> 
> Why is length in prototype and why is it 0?

That is a really good question.

[Joseph Pecoraro]

http://trac.webkit.org/changeset/180713

I will open follow-ups for the other points, they are minor.