Bug 158334

Summary: Web Inspector: API View of Native DOM APIs looks poor (TypeErrors for native getters)
Product: WebKit Reporter: Joseph Pecoraro <joepeck>
Component: Web InspectorAssignee: Nobody <webkit-unassigned>
Status: RESOLVED FIXED    
Severity: Normal CC: bburg, commit-queue, graouts, joepeck, mattbaker, nvasilyev, timothy, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: WebKit Nightly Build   
Hardware: All   
OS: All   
Attachments:
Description Flags
[IMAGE] TypeErrors everywhere
none
[IMAGE] document.body before
none
[IMAGE] document.body after
none
[IMAGE] LoadEvent before
none
[IMAGE] LoadEvent after
none
[PATCH] Proposed Fix
timothy: review+
[PATCH] For Landing none

Description Joseph Pecoraro 2016-06-02 19:07:10 PDT
* SUMMARY
API View of Native DOM APIs looks poor (TypeErrors for native getters).

See attached screenshot.

* STEPS TO REPRODUCE
1. js> dir(document.body)
2. Expand Prototypes in Console
  => TypeErrors everywhere
Comment 1 Radar WebKit Bug Importer 2016-06-02 19:08:16 PDT
<rdar://problem/26615366>
Comment 2 Joseph Pecoraro 2016-06-02 19:13:17 PDT
Created attachment 280403 [details]
[IMAGE] TypeErrors everywhere
Comment 3 BJ Burg 2016-06-03 09:02:53 PDT
This seems like a dupe of https://bugs.webkit.org/show_bug.cgi?id=153911.
Comment 4 Timothy Hatcher 2016-06-03 11:13:36 PDT

*** This bug has been marked as a duplicate of bug 153911 ***
Comment 5 Joseph Pecoraro 2016-06-03 13:37:53 PDT
Similar, but I'd have considered them different.
Comment 6 Joseph Pecoraro 2016-06-29 17:41:53 PDT
I'm going to unduplicated this, because it is different. I have a fix for this.
Comment 7 Joseph Pecoraro 2016-06-29 17:55:23 PDT
Created attachment 282395 [details]
[IMAGE] document.body before
Comment 8 Joseph Pecoraro 2016-06-29 17:55:35 PDT
Created attachment 282396 [details]
[IMAGE] document.body after
Comment 9 Joseph Pecoraro 2016-06-29 17:55:57 PDT
Created attachment 282397 [details]
[IMAGE] LoadEvent before
Comment 10 Joseph Pecoraro 2016-06-29 17:56:12 PDT
Created attachment 282398 [details]
[IMAGE] LoadEvent after
Comment 11 Joseph Pecoraro 2016-06-29 18:11:46 PDT
Created attachment 282400 [details]
[PATCH] Proposed Fix
Comment 12 Joseph Pecoraro 2016-06-29 18:15:38 PDT
So the way this works is:

The preview will show native accessors as values in the preview:

    js> loadEvent
    ▶︎ Event { type: "foo", ... }

And when you expand, the first expansion _conveniently_ immediately shows you both own properties/functions and native getters up in the prototype chain:

    js> loadEvent
    ▼ Event
        [B] ownPropertyBoolean: true
        [S] type: "foo"
        ...
    ▶︎ Event Prototype

And when you expand the prototypes, it will show the individual properties/functions + accessors on those prototypes:

    js> loadEvent
    ▼ Event
        [B] ownPropertyBoolean: true
        [S] type: "foo"
        ...
    ▼ Event Prototype
        [?] type: (Get)
        ...
    ▶︎ Object Prototype

This is the best of both worlds. Quick access to values. Yet still having the ability to ultimately find out exactly which prototype the accessor came from.
Comment 13 Timothy Hatcher 2016-06-29 20:21:44 PDT
Comment on attachment 282400 [details]
[PATCH] Proposed Fix

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

> Source/JavaScriptCore/inspector/InjectedScriptSource.js:647
> +                        // Developers may create such a descriptors, so we should be resilient:

"such a descriptors" => "such a descriptor"
Comment 14 Joseph Pecoraro 2016-06-29 21:17:46 PDT
Created attachment 282413 [details]
[PATCH] For Landing
Comment 15 Joseph Pecoraro 2016-06-29 21:21:46 PDT
<https://trac.webkit.org/changeset/202666>