DevTools: introduce object previews experiment

BUG=405845 Review-Url: https://codereview.chromium.org/2605693003 Cr-Commit-Position: refs/heads/master@{#445814}
qweri0p · Jan 24, 2017 · f596646 · f596646
1 parent a6c8708
commit f596646
Show file tree

Hide file tree

Showing 23 changed files with 244 additions and 107 deletions.
diff --git a/third_party/WebKit/LayoutTests/inspector/console/console-dir-global.html b/third_party/WebKit/LayoutTests/inspector/console/console-dir-global.html
@@ -23,7 +23,7 @@
         if (result.type === "error")
             testController.notifyDone("Exception:" + result);
         var objectProxy = InspectorTest.runtimeModel.createRemoteObject(result);
-        objectProxy.getOwnProperties(getPropertiesCallback);
+        objectProxy.getOwnProperties(false, getPropertiesCallback);
     }
 
     function getPropertiesCallback(properties)

diff --git a/third_party/WebKit/LayoutTests/inspector/console/console-format-es6-expected.txt b/third_party/WebKit/LayoutTests/inspector/console/console-format-es6-expected.txt
@@ -74,10 +74,10 @@ console-format-es6.html:11 Set(1) {WeakSet {…}}
 console-format-es6.html:12 [Set(1)]
 globals[11]
 Set(1) {WeakSet {…}}
-console-format-es6.html:11 Map(5) {" from str " => " to str ", undefined => undefined, null => null, 42 => 42, Object {foo: "from"} => Object {foo: "to"}}
-console-format-es6.html:12 [Map(5)]
+console-format-es6.html:11 Map(6) {" from str " => " to str ", undefined => undefined, null => null, 42 => 42, Object {foo: "from"} => Object {foo: "to"}…}
+console-format-es6.html:12 [Map(6)]
 globals[12]
-Map(5) {" from str " => " to str ", undefined => undefined, null => null, 42 => 42, Object {foo: "from"} => Object {foo: "to"}}
+Map(6) {" from str " => " to str ", undefined => undefined, null => null, 42 => 42, Object {foo: "from"} => Object {foo: "to"}…}
 Expanded all messages
 console-format-es6.html:11 Promise
     __proto__: Promise
@@ -255,29 +255,31 @@ Set(1)
     [[Entries]]: Array(1)
         0: WeakSet
         length: 1
-console-format-es6.html:11 Map(5)
+console-format-es6.html:11 Map(6)
     size: (...)
     __proto__: Map
-    [[Entries]]: Array(5)
+    [[Entries]]: Array(6)
         0: {" from str " => " to str "}
         1: {undefined => undefined}
         2: {null => null}
         3: {42 => 42}
         4: {Object => Object}
-        length: 5
+        5: {Array(1) => Array(1)}
+        length: 6
 console-format-es6.html:12 Array(1)
-    0: Map(5)
+    0: Map(6)
     length: 1
     __proto__: Array(0)
 globals[12]
-Map(5)
+Map(6)
     size: (...)
     __proto__: Map
-    [[Entries]]: Array(5)
+    [[Entries]]: Array(6)
         0: {" from str " => " to str "}
         1: {undefined => undefined}
         2: {null => null}
         3: {42 => 42}
         4: {Object => Object}
-        length: 5
+        5: {Array(1) => Array(1)}
+        length: 6
 
diff --git a/third_party/WebKit/LayoutTests/inspector/console/console-format-es6.html b/third_party/WebKit/LayoutTests/inspector/console/console-format-es6.html
@@ -48,6 +48,7 @@
     bigmap.set(null, null);
     bigmap.set(42, 42);
     bigmap.set({foo:"from"}, {foo:"to"});
+    bigmap.set(["from"], ["to"]);
 
     var p = Promise.reject(-0);
     p.catch(function() {});

diff --git a/third_party/WebKit/LayoutTests/inspector/console/console-format-expected.txt b/third_party/WebKit/LayoutTests/inspector/console/console-format-expected.txt
@@ -1,13 +1,13 @@
-CONSOLE MESSAGE: line 26: test,test2,,,test4,,,,,
-CONSOLE MESSAGE: line 27: %o
-CONSOLE MESSAGE: line 28: %O
-CONSOLE MESSAGE: line 29: Test for zero "%f" in formatter
-CONSOLE MESSAGE: line 30: %% self-escape1
-CONSOLE MESSAGE: line 31: %%s self-escape2
-CONSOLE MESSAGE: line 32: %%ss self-escape3
-CONSOLE MESSAGE: line 33: %%s%s%%s self-escape4
-CONSOLE MESSAGE: line 34: %%%%% self-escape5
-CONSOLE MESSAGE: line 35: %%%s self-escape6
+CONSOLE MESSAGE: line 27: test,test2,,,test4,,,,,
+CONSOLE MESSAGE: line 28: %o
+CONSOLE MESSAGE: line 29: %O
+CONSOLE MESSAGE: line 30: Test for zero "%f" in formatter
+CONSOLE MESSAGE: line 31: %% self-escape1
+CONSOLE MESSAGE: line 32: %%s self-escape2
+CONSOLE MESSAGE: line 33: %%ss self-escape3
+CONSOLE MESSAGE: line 34: %%s%s%%s self-escape4
+CONSOLE MESSAGE: line 35: %%%%% self-escape5
+CONSOLE MESSAGE: line 36: %%%s self-escape6
 CONSOLE MESSAGE: line 12: /^url\(\s*(?:(?:"(?:[^\\\"]|(?:\\[\da-f]{1,6}\s?|\.))*"|'(?:[^\\\']|(?:\\[\da-f]{1,6}\s?|\.))*')|(?:[!#$%&*-~\w]|(?:\\[\da-f]{1,6}\s?|\.))*)\s*\)/i
 CONSOLE MESSAGE: line 13: /^url\(\s*(?:(?:"(?:[^\\\"]|(?:\\[\da-f]{1,6}\s?|\.))*"|'(?:[^\\\']|(?:\\[\da-f]{1,6}\s?|\.))*')|(?:[!#$%&*-~\w]|(?:\\[\da-f]{1,6}\s?|\.))*)\s*\)/i
 CONSOLE MESSAGE: line 12: /foo\\bar\sbaz/i
@@ -94,22 +94,26 @@ CONSOLE MESSAGE: line 12: [object Uint8Array]
 CONSOLE MESSAGE: line 13: [object Uint8Array]
 CONSOLE MESSAGE: line 12: [object Uint8Array]
 CONSOLE MESSAGE: line 13: [object Uint8Array]
+CONSOLE MESSAGE: line 12: [object Uint8Array]
+CONSOLE MESSAGE: line 13: [object Uint8Array]
 CONSOLE MESSAGE: line 12: [object Object]
 CONSOLE MESSAGE: line 13: [object Object]
 CONSOLE MESSAGE: line 12: 1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1
 CONSOLE MESSAGE: line 13: 1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1
+CONSOLE MESSAGE: line 12: test
+CONSOLE MESSAGE: line 13: test
 Tests that console logging dumps proper messages.
 
- console-format.html:21 Array(10)
-console-format.html:22 Array(10)
+ console-format.html:22 Array(10)
 console-format.html:23 Array(10)
-console-format.html:24 Test for zero "0" in formatter
-console-format.html:25 % self-escape1 dummy
-console-format.html:26 %s self-escape2 dummy
-console-format.html:27 %ss self-escape3 dummy
-console-format.html:28 %sdummy%s self-escape4
-console-format.html:29 %%% self-escape5 dummy
-console-format.html:30 %dummy self-escape6
+console-format.html:24 Array(10)
+console-format.html:25 Test for zero "0" in formatter
+console-format.html:26 % self-escape1 dummy
+console-format.html:27 %s self-escape2 dummy
+console-format.html:28 %ss self-escape3 dummy
+console-format.html:29 %sdummy%s self-escape4
+console-format.html:30 %%% self-escape5 dummy
+console-format.html:31 %dummy self-escape6
 console-format.html:7 /^url\(\s*(?:(?:"(?:[^\\\"]|(?:\\[\da-f]{1,6}\s?|\.))*"|'(?:[^\\\']|(?:\\[\da-f]{1,6}\s?|\.))*')|(?:[!#$%&*-~\w]|(?:\\[\da-f]{1,6}\s?|\.))*)\s*\)/i
 console-format.html:8 [/^url\(\s*(?:(?:"(?:[^\\\"]|(?:\\[\da-f]{1,6}\s?|\…?:[!#$%&*-~\w]|(?:\\[\da-f]{1,6}\s?|\.))*)\s*\)/i]
 globals[0]
@@ -275,51 +279,59 @@ console-format.html:7 DOMException: Failed to execute 'removeChild' on 'Node': T
 console-format.html:8 [DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of th…]
 globals[36]
 DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
+console-format.html:7 Uint8Array(1) [3]
+console-format.html:8 [Uint8Array(1)]
+globals[37]
+Uint8Array(1) [3]
 console-format.html:7 Uint8Array(400) [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0…]
 console-format.html:8 [Uint8Array(400)]
-globals[37]
+globals[38]
 Uint8Array(400) [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0…]
 console-format.html:7 Uint8Array(400000000) [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0…]
 console-format.html:8 [Uint8Array(400000000)]
-globals[38]
+globals[39]
 Uint8Array(400000000) [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0…]
 console-format.html:7 namespace.longSubNamespace.x.className {}
 console-format.html:8 [n…e.l…e.x.className]
-globals[39]
+globals[40]
 namespace.longSubNamespace.x.className {}
 console-format.html:7 [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1…]
 console-format.html:8 [Array(200)]
-globals[40]
+globals[41]
 [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1…]
+console-format.html:7 ["test"]
+console-format.html:8 [Array(1)]
+globals[42]
+["test"]
 Expanded all messages
-console-format.html:21 Array(10)
+console-format.html:22 Array(10)
     0: "test"
     1: "test2"
     4: "test4"
     foo: Object
     length: 10
     __proto__: Array(0)
-console-format.html:22 Array(10)
+console-format.html:23 Array(10)
     0: "test"
     1: "test2"
     4: "test4"
     foo: Object
     length: 10
     __proto__: Array(0)
-console-format.html:23 Array(10)
+console-format.html:24 Array(10)
     0: "test"
     1: "test2"
     4: "test4"
     foo: Object
     length: 10
     __proto__: Array(0)
-console-format.html:24 Test for zero "0" in formatter
-console-format.html:25 % self-escape1 dummy
-console-format.html:26 %s self-escape2 dummy
-console-format.html:27 %ss self-escape3 dummy
-console-format.html:28 %sdummy%s self-escape4
-console-format.html:29 %%% self-escape5 dummy
-console-format.html:30 %dummy self-escape6
+console-format.html:25 Test for zero "0" in formatter
+console-format.html:26 % self-escape1 dummy
+console-format.html:27 %s self-escape2 dummy
+console-format.html:28 %ss self-escape3 dummy
+console-format.html:29 %sdummy%s self-escape4
+console-format.html:30 %%% self-escape5 dummy
+console-format.html:31 %dummy self-escape6
 console-format.html:7 /^url\(\s*(?:(?:"(?:[^\\\"]|(?:\\[\da-f]{1,6}\s?|\.))*"|'(?:[^\\\']|(?:\\[\da-f]{1,6}\s?|\.))*')|(?:[!#$%&*-~\w]|(?:\\[\da-f]{1,6}\s?|\.))*)\s*\)/i
 console-format.html:8 Array(1)
     0: /^url\(\s*(?:(?:"(?:[^\\\"]|(?:\\[\da-f]{1,6}\s?|\.))*"|'(?:[^\\\']|(?:\\[\da-f]{1,6}\s?|\.))*')|(?:[!#$%&*-~\w]|(?:\\[\da-f]{1,6}\s?|\.))*)\s*\)/i
@@ -703,6 +715,27 @@ console-format.html:8 Array(1)
     __proto__: Array(0)
 globals[36]
 DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
+console-format.html:7 Uint8Array(1)
+    0: 3
+    buffer: (...)
+    byteLength: (...)
+    byteOffset: (...)
+    length: (...)
+    Symbol(Symbol.toStringTag): (...)
+    __proto__: TypedArray
+console-format.html:8 Array(1)
+    0: Uint8Array(1)
+    length: 1
+    __proto__: Array(0)
+globals[37]
+Uint8Array(1)
+    0: 3
+    buffer: (...)
+    byteLength: (...)
+    byteOffset: (...)
+    length: (...)
+    Symbol(Symbol.toStringTag): (...)
+    __proto__: TypedArray
 console-format.html:7 Uint8Array(400)
     [0 … 99]
     [100 … 199]
@@ -714,7 +747,7 @@ console-format.html:8 Array(1)
     0: Uint8Array(400)
     length: 1
     __proto__: Array(0)
-globals[37]
+globals[38]
 Uint8Array(400)
     [0 … 99]
     [100 … 199]
@@ -732,7 +765,7 @@ console-format.html:8 Array(1)
     0: Uint8Array(400000000)
     length: 1
     __proto__: Array(0)
-globals[38]
+globals[39]
 Uint8Array(400000000)
     [0 … 99999999]
     [100000000 … 199999999]
@@ -745,7 +778,7 @@ console-format.html:8 Array(1)
     0: namespace.longSubNamespace.x.className
     length: 1
     __proto__: Array(0)
-globals[39]
+globals[40]
 namespace.longSubNamespace.x.className
     __proto__: Object
 console-format.html:7 Array(200)
@@ -757,10 +790,23 @@ console-format.html:8 Array(1)
     0: Array(200)
     length: 1
     __proto__: Array(0)
-globals[40]
+globals[41]
 Array(200)
     [0 … 99]
     [100 … 199]
     length: 200
     __proto__: Array(0)
+console-format.html:7 Array(1)
+    0: "test"
+    length: 1
+    __proto__: Array(0)
+console-format.html:8 Array(1)
+    0: Array(1)
+    length: 1
+    __proto__: Array(0)
+globals[42]
+Array(1)
+    0: "test"
+    length: 1
+    __proto__: Array(0)
 
diff --git a/third_party/WebKit/LayoutTests/inspector/console/console-format.html b/third_party/WebKit/LayoutTests/inspector/console/console-format.html
@@ -18,6 +18,7 @@
     var foo = { foo: "foo"};
     var bar = { bar: "bar" };
     bar.__proto__ = foo;
+    var singleArray = ["test"];
     var array = ["test", "test2"]; array.length = 10;
     array.foo = {};
     array[4] = "test4";
@@ -67,6 +68,7 @@
     var arrayLikeFunction = function( /**/ foo/**/, /*/**/bar,
     /**/baz) {};
     arrayLikeFunction.splice = function() {};
+    var tinyTypedArray = new Uint8Array([3]);
     var smallTypedArray = new Uint8Array(new ArrayBuffer(400));
     smallTypedArray["foo"] = "bar";
     var bigTypedArray = new Uint8Array(new ArrayBuffer(400 * 1000 * 1000));
@@ -85,7 +87,7 @@
         NaN, Number.POSITIVE_INFINITY, Number.NEGATIVE_INFINITY, array, {}, [function() {}], bar, svg,
         objectWithNonEnumerables, negZero, Object.create(null), Object, Object.prototype, arrayLikeFunction,
         new Number(42), new String("abc"), new Uint16Array([1, 2, 3]), textNode, domException(),
-        smallTypedArray, bigTypedArray, instanceWithLongClassName, bigArray
+        tinyTypedArray, smallTypedArray, bigTypedArray, instanceWithLongClassName, bigArray, singleArray
     ];
 
     runTest();

diff --git a/third_party/WebKit/LayoutTests/inspector/profiler/heap-snapshot-inspect-dom-wrapper.html b/third_party/WebKit/LayoutTests/inspector/profiler/heap-snapshot-inspect-dom-wrapper.html
@@ -69,7 +69,7 @@
             InspectorTest.addResult("PASS: got at least one HTMLBodyElement wrapper");
 
             for (var i = 0; i < remoteObjects.length; i++)
-                remoteObjects[i].getOwnProperties(didGetOwnProperties);
+                remoteObjects[i].getOwnProperties(false, didGetOwnProperties);
         }
 
         var didGetOwnPropertiesCount = 0;

diff --git a/third_party/WebKit/LayoutTests/inspector/runtime/runtime-getProperties.html b/third_party/WebKit/LayoutTests/inspector/runtime/runtime-getProperties.html
@@ -42,12 +42,12 @@
 
         function testGetterAndSetter(next)
         {
-            obj1.getOwnProperties(dumpProperties.bind(this, next));
+            obj1.getOwnProperties(false, dumpProperties.bind(this, next));
         },
 
         function testGetterOnly(next)
         {
-            obj2.getOwnProperties(dumpProperties.bind(this, next));
+            obj2.getOwnProperties(false, dumpProperties.bind(this, next));
         }
     ]);
 

diff --git a/third_party/WebKit/LayoutTests/inspector/runtime/runtime-localStorage-getProperties.html b/third_party/WebKit/LayoutTests/inspector/runtime/runtime-localStorage-getProperties.html
@@ -12,7 +12,7 @@
     function step1(error, result, exceptionDetails)
     {
         var localStorageHandle = InspectorTest.runtimeModel.createRemoteObject(result);
-        localStorageHandle.getOwnProperties(step2);
+        localStorageHandle.getOwnProperties(false, step2);
     }
 
     function step2(properties)

diff --git a/third_party/WebKit/Source/devtools/front_end/components/EventListenersUtils.js b/third_party/WebKit/Source/devtools/front_end/components/EventListenersUtils.js
@@ -31,7 +31,7 @@ SDK.EventListener.frameworkEventListeners = function(object) {
    * @return {!Promise<!{properties: ?Array.<!SDK.RemoteObjectProperty>, internalProperties: ?Array.<!SDK.RemoteObjectProperty>}>}
    */
   function getOwnProperties(object) {
-    return object.getOwnPropertiesPromise();
+    return object.getOwnPropertiesPromise(false /* generatePreview */);
   }
 
   /**

diff --git a/third_party/WebKit/Source/devtools/front_end/components/EventListenersView.js b/third_party/WebKit/Source/devtools/front_end/components/EventListenersView.js
@@ -285,7 +285,8 @@ Components.ObjectEventListenerBar = class extends UI.TreeElement {
     var subtitle = this.listItemElement.createChild('span', 'event-listener-tree-subtitle');
     subtitle.appendChild(linkifier.linkifyRawLocation(this._eventListener.location(), this._eventListener.sourceURL()));
 
-    title.appendChild(Components.ObjectPropertiesSection.createValueElement(object, false));
+    title.appendChild(
+        Components.ObjectPropertiesSection.createValueElement(object, false /* wasThrown */, false /* showPreview */));
 
     if (this._eventListener.removeFunction()) {
       var deleteButton = title.createChild('span', 'event-listener-button');

diff --git a/third_party/WebKit/Source/devtools/front_end/components/JavaScriptAutocomplete.js b/third_party/WebKit/Source/devtools/front_end/components/JavaScriptAutocomplete.js
@@ -211,7 +211,9 @@ Components.JavaScriptAutocomplete.completionsForExpression = function(expression
         return Promise.resolve(/** @type {?SDK.RemoteObject} */ (null));
       if (object.type !== 'object' || object.subtype !== 'proxy')
         return Promise.resolve(/** @type {?SDK.RemoteObject} */ (object));
-      return object.getOwnPropertiesPromise().then(extractTargetFromProperties).then(extractTarget);
+      return object.getOwnPropertiesPromise(false /* generatePreview */)
+          .then(extractTargetFromProperties)
+          .then(extractTarget);
     }
 
     /**
@@ -313,7 +315,9 @@ Components.JavaScriptAutocomplete.completionsForExpression = function(expression
     for (var i = 0; i < scopeChain.length; ++i) {
       var scope = scopeChain[i];
       var object = scope.object();
-      object.getAllProperties(false, propertiesCollected.bind(null, scope.typeName()));
+      object.getAllProperties(
+          false /* accessorPropertiesOnly */, false /* generatePreview */,
+          propertiesCollected.bind(null, scope.typeName()));
     }
   }
 

diff --git a/third_party/WebKit/Source/devtools/front_end/components/ObjectPopoverHelper.js b/third_party/WebKit/Source/devtools/front_end/components/ObjectPopoverHelper.js
@@ -138,6 +138,7 @@ Components.ObjectPopoverHelper = class extends UI.PopoverHelper {
 
         if (result.type === 'function') {
           result.getOwnProperties(
+              false /* generatePreview */,
               didGetFunctionProperties.bind(this, result, popoverContentElement, valueElement, anchorElement));
           return;
         }