DevTools: format keys in object previews using sans serif.

third_party/WebKit/Source/devtools/front_end/object_ui/RemoteObjectPreviewFormatter.js

 // Copyright (c) 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /**
  * @unrestricted
  */
 ObjectUI.RemoteObjectPreviewFormatter = class {
   /**
    * @param {!Protocol.Runtime.PropertyPreview} a
    * @param {!Protocol.Runtime.PropertyPreview} b
@@ skipping 28 matching lines @@
         var arrayName = preview.subtype === 'typedarray' ? SDK.RemoteObject.arrayNameFromDescription(description) : '';
         text = arrayName + arrayLengthText;
       } else {
         var hideDescription = previewExperimentEnabled && description === 'Object';
         text = hideDescription ? '' : description;
       }
       if (text.length > 0)
         parentElement.createChild('span', 'object-description').textContent = text + ' ';
     }
 
-    parentElement.createTextChild(isArrayOrTypedArray ? '[' : '{');
+    var propertiesElement = parentElement.createChild('span', 'object-properties-preview source-code');
+    propertiesElement.createTextChild(isArrayOrTypedArray ? '[' : '{');
     if (preview.entries)
-      this._appendEntriesPreview(parentElement, preview);
+      this._appendEntriesPreview(propertiesElement, preview);
     else if (isArrayOrTypedArray)
-      this._appendArrayPropertiesPreview(parentElement, preview);
+      this._appendArrayPropertiesPreview(propertiesElement, preview);
     else
-      this._appendObjectPropertiesPreview(parentElement, preview);
+      this._appendObjectPropertiesPreview(propertiesElement, preview);
     if (preview.overflow)
-      parentElement.createChild('span').textContent = '\u2026';
-    parentElement.createTextChild(isArrayOrTypedArray ? ']' : '}');
+      propertiesElement.createChild('span').textContent = '\u2026';
+    propertiesElement.createTextChild(isArrayOrTypedArray ? ']' : '}');
   }
 
   /**
    * @param {string} description
    * @return {string}
    */
   _abbreviateFullQualifiedClassName(description) {
     var abbreviatedDescription = description.split('.');
     for (var i = 0; i < abbreviatedDescription.length - 1; ++i)
       abbreviatedDescription[i] = abbreviatedDescription[i].trimMiddle(3);
@@ skipping 146 matching lines @@
     var span = createElementWithClass('span', 'object-value-' + (subtype || type));
     description = description || '';
 
     if (type === 'accessor') {
       span.textContent = '(...)';
       span.title = Common.UIString('The property is computed with a getter');
       return span;
     }
 
     if (type === 'function') {
-      span.textContent = 'function';
+      span.textContent = '\u0192';
       return span;
     }
 
     if (type === 'object' && subtype === 'node' && description) {
       Components.DOMPresentationUtils.createSpansForNodeTitle(span, description);
       return span;
     }
 
     if (type === 'string') {
       span.createTextChildren('"', description.replace(/\n/g, '\u21B5'), '"');
       return span;
     }
 
     if (type === 'object' && !subtype) {
-      span.textContent = this._abbreviateFullQualifiedClassName(description);
+      var preview = this._abbreviateFullQualifiedClassName(description);
+      if (preview === 'Object')
+        preview = '{\u2026}';
+      span.textContent = preview;
       span.title = description;
       return span;
     }
 
     span.textContent = description;
     return span;
   }
 };