DevTools: sort non-enumerable and underscore properties lower in logged object

BUG=665948

Review-Url: https://codereview.chromium.org/2563883002
Cr-Commit-Position: refs/heads/master@{#438067}

third_party/WebKit/LayoutTests/inspector/console/console-format-expected.txt

@@ -225,10 +225,10 @@ console-format.html:7
 console-format.html:8 [svg#svg-node]
 globals[25]
     <svg id="svg-node"></svg>
-console-format.html:7 Object {getFoo: function}
+console-format.html:7 Object {enumerableProp: 4, __underscoreEnumerableProp__: 5, __underscoreNonEnumerableProp: 2, abc: 3, getFoo: function…}
 console-format.html:8 [Object]
 globals[26]
-Object {getFoo: function}
+Object {enumerableProp: 4, __underscoreEnumerableProp__: 5, __underscoreNonEnumerableProp: 2, abc: 3, getFoo: function…}
 console-format.html:7 -0
 console-format.html:8 [-0]
 globals[27]
@@ -533,8 +533,12 @@ console-format.html:8 Array(1)
 globals[25]
     <svg id="svg-node"></svg>
 console-format.html:7 Object
+    enumerableProp: 4
+    __underscoreEnumerableProp__: 5
+    abc: 3
     bar: (...)
     getFoo: function ()
+    __underscoreNonEnumerableProp: 2
     get bar: function ()
     set bar: function (x)
     __proto__: Object
@@ -544,8 +548,12 @@ console-format.html:8 Array(1)
     __proto__: Array(0)
 globals[26]
 Object
+    enumerableProp: 4
+    __underscoreEnumerableProp__: 5
+    abc: 3
     bar: (...)
     getFoo: function ()
+    __underscoreNonEnumerableProp: 2
     get bar: function ()
     set bar: function (x)
     __proto__: Object
@@ -573,10 +581,6 @@ console-format.html:8 Array(1)
 globals[29]
 function Object() { [native code] }
 console-format.html:7 Object
-    __defineGetter__: function __defineGetter__()
-    __defineSetter__: function __defineSetter__()
-    __lookupGetter__: function __lookupGetter__()
-    __lookupSetter__: function __lookupSetter__()
     constructor: function Object()
     hasOwnProperty: function hasOwnProperty()
     isPrototypeOf: function isPrototypeOf()
@@ -584,6 +588,10 @@ console-format.html:7 Object
     toLocaleString: function toLocaleString()
     toString: function toString()
     valueOf: function valueOf()
+    __defineGetter__: function __defineGetter__()
+    __defineSetter__: function __defineSetter__()
+    __lookupGetter__: function __lookupGetter__()
+    __lookupSetter__: function __lookupSetter__()
     get __proto__: function __proto__()
     set __proto__: function __proto__()
 console-format.html:8 Array(1)
@@ -592,10 +600,6 @@ console-format.html:8 Array(1)
     __proto__: Array(0)
 globals[30]
 Object
-    __defineGetter__: function __defineGetter__()
-    __defineSetter__: function __defineSetter__()
-    __lookupGetter__: function __lookupGetter__()
-    __lookupSetter__: function __lookupSetter__()
     constructor: function Object()
     hasOwnProperty: function hasOwnProperty()
     isPrototypeOf: function isPrototypeOf()
@@ -603,6 +607,10 @@ Object
     toLocaleString: function toLocaleString()
     toString: function toString()
     valueOf: function valueOf()
+    __defineGetter__: function __defineGetter__()
+    __defineSetter__: function __defineSetter__()
+    __lookupGetter__: function __lookupGetter__()
+    __lookupSetter__: function __lookupSetter__()
     get __proto__: function __proto__()
     set __proto__: function __proto__()
 console-format.html:7 function ( /**/ foo/**/, /*/**/bar,

third_party/WebKit/LayoutTests/inspector/console/console-format.html

@@ -55,9 +55,13 @@ function onload()
     var existingAttribute = document.getElementById("x").attributes[0];
     var throwingLengthGetter = {get length() { throw "Length called"; }};
     var objectWithNonEnumerables = Object.create({ foo: 1 }, {
+        __underscoreNonEnumerableProp: { value: 2, enumerable: false },
+        abc: { value: 3, enumerable: false },
         getFoo: { value: function() { return this.foo; } },
         bar: { get: function() { return this.bar; }, set: function(x) { this.bar = x; } }
     });
+    objectWithNonEnumerables.enumerableProp = 4;
+    objectWithNonEnumerables.__underscoreEnumerableProp__ = 5;
     var negZero = 1 / Number.NEGATIVE_INFINITY;
     var textNode = document.getElementById("x").nextSibling;
     var arrayLikeFunction = function( /**/ foo/**/, /*/**/bar,

third_party/WebKit/LayoutTests/inspector/console/console-log-object-with-getter-expected.txt

@@ -4,6 +4,6 @@ Tests that console logging dumps object values defined by getters and allows to
 
 console-log-object-with-getter.html:15 Object {}
 console-log-object-with-getter.html:16 [(...)]
-console-log-object-with-getter.html:15 Objectfoo: Objecta: 1b: 2__proto__: Objectset bar: function (x)get foo: function ()__proto__: Object
+console-log-object-with-getter.html:15 Objectfoo: Objecta: 1b: 2__proto__: Objectget foo: function ()set bar: function (x)__proto__: Object
 console-log-object-with-getter.html:16 Array(2)0: 1length: 2get 0: function ()set 1: function (x)__proto__: Array(0)
 

third_party/WebKit/Source/devtools/front_end/components/ObjectPropertiesSection.js

@@ -101,6 +101,14 @@ Components.ObjectPropertiesSection = class extends TreeOutlineInShadow {
       return 1;
     if (b === '__proto__')
       return -1;
+    if (!propertyA.enumerable && propertyB.enumerable)
+      return 1;
+    if (!propertyB.enumerable && propertyA.enumerable)
+      return -1;
+    if (a.startsWith('_') && !b.startsWith('_'))
+      return 1;
+    if (b.startsWith('_') && !a.startsWith('_'))
+      return -1;
     if (propertyA.symbol && !propertyB.symbol)
       return 1;
     if (propertyB.symbol && !propertyA.symbol)
@@ -341,7 +349,8 @@ Components.ObjectPropertiesSection = class extends TreeOutlineInShadow {
       var defaultName = includePreview ? '' : 'anonymous';
       if (response && response.functionName)
         defaultName = response.functionName;
-      var valueElement = Components.ObjectPropertiesSection.valueElementForFunctionDescription(func.description, includePreview, defaultName);
+      var valueElement = Components.ObjectPropertiesSection.valueElementForFunctionDescription(
+          func.description, includePreview, defaultName);
       element.appendChild(valueElement);
     }
   }