DevTools: ConsoleViewMessage rewrite signatures for formatter functions

third_party/WebKit/Source/devtools/front_end/console/ConsoleViewMessage.js

 /*
  * Copyright (C) 2011 Google Inc.  All rights reserved.
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
@@ skipping 111 matching lines @@
 
     /**
      * @param {!WebInspector.ConsoleMessage} consoleMessage
      * @return {!Element}
      */
     _buildTableMessage: function(consoleMessage)
     {
         var formattedMessage = createElement("span");
         WebInspector.appendStyle(formattedMessage, "components/objectValue.css");
         formattedMessage.className = "console-message-text source-code";
-        var anchorElement = this._buildMessageAnchor(consoleMessage);
+        var anchorElement = this._buildMessageAnchor(consoleMessage, this._linkifier);
         if (anchorElement)
             formattedMessage.appendChild(anchorElement);
 
         var table = consoleMessage.parameters && consoleMessage.parameters.length ? consoleMessage.parameters[0] : null;
         if (table)
             table = this._parameterToRemoteObject(table, this._target());

[lushnikov, 2016/10/22 03:10:19]

consoleMessage.target();

         if (!table || !table.preview)
             return formattedMessage;
 
         var columnNames = [];
         var preview = table.preview;
         var rows = [];
         for (var i = 0; i < preview.properties.length; ++i) {
             var rowProperty = preview.properties[i];
             var rowPreview = rowProperty.valuePreview;
             if (!rowPreview)
@@ skipping 29 matching lines @@
                 flatValues.push(rowValue[columnNames[j]]);
         }
         columnNames.unshift(WebInspector.UIString("(index)"));
 
         if (flatValues.length) {
             this._dataGrid = WebInspector.SortableDataGrid.create(columnNames, flatValues);
 
             var formattedResult = createElement("span");
             var tableElement = formattedResult.createChild("div", "console-message-formatted-table");
             var dataGridContainer = tableElement.createChild("span");
-            tableElement.appendChild(this._formatParameter(table, true, false));
+            tableElement.appendChild(this._formatParameter(consoleMessage.type, this._linkifier, table, true, false));
             dataGridContainer.appendChild(this._dataGrid.element);
             formattedMessage.appendChild(formattedResult);
             this._dataGrid.renderInline();
         }
         return formattedMessage;
     },
 
     /**
      * @param {!WebInspector.ConsoleMessage} consoleMessage
+     * @param {!WebInspector.Linkifier} linkifier
      * @return {!Element}
      */
-    _buildMessage: function(consoleMessage)
+    _buildMessage: function(consoleMessage, linkifier)
     {
         var messageElement;
         if (consoleMessage.source === WebInspector.ConsoleMessage.MessageSource.ConsoleAPI) {
             switch (consoleMessage.type) {
             case WebInspector.ConsoleMessage.MessageType.Trace:
-                messageElement = this._format(consoleMessage.parameters || ["console.trace"]);
+                messageElement = this._format(consoleMessage, linkifier, consoleMessage.parameters || ["console.trace"]);
                 break;
             case WebInspector.ConsoleMessage.MessageType.Clear:
                 messageElement = createElementWithClass("span", "console-info");
                 messageElement.textContent = WebInspector.UIString("Console was cleared");
                 break;
             case WebInspector.ConsoleMessage.MessageType.Assert:
                 var args = [WebInspector.UIString("Assertion failed:")];
                 if (consoleMessage.parameters)
                     args = args.concat(consoleMessage.parameters);
-                messageElement = this._format(args);
+                messageElement = this._format(consoleMessage, linkifier, args);
                 break;
             case WebInspector.ConsoleMessage.MessageType.Dir:
                 var obj = consoleMessage.parameters ? consoleMessage.parameters[0] : undefined;
                 var args = ["%O", obj];
-                messageElement = this._format(args);
+                messageElement = this._format(consoleMessage, linkifier, args);
                 break;
             case WebInspector.ConsoleMessage.MessageType.Profile:
             case WebInspector.ConsoleMessage.MessageType.ProfileEnd:
-                messageElement = this._format([consoleMessage.messageText]);
+                messageElement = this._format(consoleMessage, linkifier, [consoleMessage.messageText]);
                 break;
             default:
                 if (consoleMessage.parameters && consoleMessage.parameters.length === 1 && consoleMessage.parameters[0].type === "string")
-                    messageElement = this._tryFormatAsError(/** @type {string} */(consoleMessage.parameters[0].value));
+                    messageElement = this._tryFormatAsError(consoleMessage.target(), linkifier, /** @type {string} */(consoleMessage.parameters[0].value));
                 var args = consoleMessage.parameters || [consoleMessage.messageText];
-                messageElement = messageElement || this._format(args);
+                messageElement = messageElement || this._format(consoleMessage, linkifier, args);
             }
         } else if (consoleMessage.source === WebInspector.ConsoleMessage.MessageSource.Network) {
             if (consoleMessage.request) {
                 messageElement = createElement("span");
                 if (consoleMessage.level === WebInspector.ConsoleMessage.MessageLevel.Error || consoleMessage.level === WebInspector.ConsoleMessage.MessageLevel.RevokedError) {
                     messageElement.createTextChildren(consoleMessage.request.requestMethod, " ");
                     messageElement.appendChild(WebInspector.Linkifier.linkifyUsingRevealer(consoleMessage.request, consoleMessage.request.url, consoleMessage.request.url));
                     if (consoleMessage.request.failed)
                         messageElement.createTextChildren(" ", consoleMessage.request.localizedFailDescription);
                     else
                         messageElement.createTextChildren(" ", String(consoleMessage.request.statusCode), " (", consoleMessage.request.statusText, ")");
                 } else {
                     var fragment = WebInspector.linkifyStringAsFragmentWithCustomLinkifier(consoleMessage.messageText, linkifyRequest.bind(consoleMessage));
                     messageElement.appendChild(fragment);
                 }
             } else {
-                messageElement = this._format([consoleMessage.messageText]);
+                messageElement = this._format(consoleMessage, linkifier, [consoleMessage.messageText]);
             }
         } else {
             var args = consoleMessage.parameters || [consoleMessage.messageText];
-            messageElement = this._format(args);
+            messageElement = this._format(consoleMessage, linkifier, args);
         }
 
         var formattedMessage = createElement("span");
         WebInspector.appendStyle(formattedMessage, "components/objectValue.css");
         formattedMessage.className = "console-message-text source-code";
 
-        var anchorElement = this._buildMessageAnchor(consoleMessage);
+        var anchorElement = this._buildMessageAnchor(consoleMessage, linkifier);
         if (anchorElement)
             formattedMessage.appendChild(anchorElement);
         formattedMessage.appendChild(messageElement);
         return formattedMessage;
 
         /**
          * @param {string} title
          * @return {!Element}
          * @this {WebInspector.ConsoleMessage}
          */
         function linkifyRequest(title)
         {
             return WebInspector.Linkifier.linkifyUsingRevealer(/** @type {!WebInspector.NetworkRequest} */ (this.request), title, this.request.url);
         }
     },
 
     /**
      * @param {!WebInspector.ConsoleMessage} consoleMessage
+     * @param {!WebInspector.Linkifier} linkifier
      * @return {?Element}
      */
-    _buildMessageAnchor: function(consoleMessage)
+    _buildMessageAnchor: function(consoleMessage, linkifier)
     {
         var anchorElement = null;
         if (consoleMessage.source !== WebInspector.ConsoleMessage.MessageSource.Network || consoleMessage.request) {
             if (consoleMessage.scriptId)
-                anchorElement = this._linkifyScriptId(consoleMessage.scriptId, consoleMessage.url || "", consoleMessage.line, consoleMessage.column);
+                anchorElement = this._linkifyScriptId(linkifier, consoleMessage);

[lushnikov, 2016/10/22 03:10:18]

1. the order should be consistent
2. can we pass just scriptId?

can we inline linkifyScriptId right away?

             else if (consoleMessage.stackTrace && consoleMessage.stackTrace.callFrames.length)
-                anchorElement = this._linkifyStackTraceTopFrame(consoleMessage.stackTrace);
+                anchorElement = this._linkifyStackTraceTopFrame(linkifier, consoleMessage);

[lushnikov, 2016/10/22 03:10:18]

inline this as well

             else if (consoleMessage.url && consoleMessage.url !== "undefined")
-                anchorElement = this._linkifyLocation(consoleMessage.url, consoleMessage.line, consoleMessage.column);
+                anchorElement = this._linkifyLocation(linkifier, consoleMessage);

[lushnikov, 2016/10/22 03:10:18]

inline this as well

         } else if (consoleMessage.url) {
             var url = consoleMessage.url;
             var isExternal = !WebInspector.resourceForURL(url) && !WebInspector.networkMapping.uiSourceCodeForURLForAnyTarget(url);
             anchorElement = WebInspector.linkifyURLAsNode(url, url, "console-message-url", isExternal);
         }
 
         // Append a space to prevent the anchor text from being glued to the console message when the user selects and copies the console messages.
         if (anchorElement)
             anchorElement.appendChild(createTextNode(" "));
         return anchorElement;
     },
 
     /**
      * @param {!WebInspector.ConsoleMessage} consoleMessage
      * @param {!WebInspector.Target} target
      * @param {!WebInspector.Linkifier} linkifier
      * @return {!Element}
      */
     _buildMessageWithStackTrace: function(consoleMessage, target, linkifier)
     {
         var toggleElement = createElementWithClass("div", "console-message-stack-trace-toggle");
         var triangleElement = toggleElement.createChild("div", "console-message-stack-trace-triangle");
         var contentElement = toggleElement.createChild("div", "console-message-stack-trace-wrapper");
 
-        var messageElement = this._buildMessage(consoleMessage);
+        var messageElement = this._buildMessage(consoleMessage, linkifier);
         var clickableElement = contentElement.createChild("div");
         clickableElement.appendChild(messageElement);
         var stackTraceElement = contentElement.createChild("div");
         var stackTracePreview = WebInspector.DOMPresentationUtils.buildStackTracePreviewContents(target, linkifier, consoleMessage.stackTrace);
         stackTraceElement.appendChild(stackTracePreview);
         stackTraceElement.classList.add("hidden");
 
         /**
          * @param {boolean} expand
          */
@@ skipping 17 matching lines @@
         clickableElement.addEventListener("click", toggleStackTrace, false);
         triangleElement.addEventListener("click", toggleStackTrace, false);
         if (consoleMessage.type === WebInspector.ConsoleMessage.MessageType.Trace)
             expandStackTrace(true);
 
         toggleElement._expandStackTraceForTest = expandStackTrace.bind(null, true);
         return toggleElement;
     },
 
     /**
-     * @param {string} url
-     * @param {number} lineNumber
-     * @param {number} columnNumber
+     * @param {!WebInspector.Linkifier} linkifier
+     * @param {!WebInspector.ConsoleMessage} consoleMessage
      * @return {?Element}
      */
-    _linkifyLocation: function(url, lineNumber, columnNumber)
+    _linkifyLocation: function(linkifier, consoleMessage)

[lushnikov, 2016/10/22 03:10:19]

will be removed

     {
-        var target = this._target();
+        var target = consoleMessage.target();
         if (!target)
             return null;
-        return this._linkifier.linkifyScriptLocation(target, null, url, lineNumber, columnNumber, "console-message-url");
+        return this._linkifier.linkifyScriptLocation(target, null, consoleMessage.url || "", consoleMessage.line, consoleMessage.column, "console-message-url");

[lushnikov, 2016/10/22 03:10:18]

linkifier

     },
 
     /**
-     * @param {!RuntimeAgent.StackTrace} stackTrace
+     * @param {!WebInspector.Linkifier} linkifier
+     * @param {!WebInspector.ConsoleMessage} consoleMessage
      * @return {?Element}
      */

[lushnikov, 2016/10/22 03:10:18]

will be removed

-    _linkifyStackTraceTopFrame: function(stackTrace)
+    _linkifyStackTraceTopFrame: function(linkifier, consoleMessage)
     {
-        var target = this._target();
+        var target = consoleMessage.target();
         if (!target)
             return null;
-        return this._linkifier.linkifyStackTraceTopFrame(target, stackTrace, "console-message-url");
+        return this._linkifier.linkifyStackTraceTopFrame(target, /** @type {!RuntimeAgent.StackTrace} **/ (consoleMessage.stackTrace), "console-message-url");
     },
 
     /**
-     * @param {string} scriptId
-     * @param {string} url
-     * @param {number} lineNumber
-     * @param {number} columnNumber
+     * @param {!WebInspector.Linkifier} linkifier
+     * @param {!WebInspector.ConsoleMessage} consoleMessage
      * @return {?Element}
      */
-    _linkifyScriptId: function(scriptId, url, lineNumber, columnNumber)
+    _linkifyScriptId: function(linkifier, consoleMessage)

[lushnikov, 2016/10/22 03:10:19]

will be removed

     {
-        var target = this._target();
+        var target = consoleMessage.target();
         if (!target)
             return null;
-        return this._linkifier.linkifyScriptLocation(target, scriptId, url, lineNumber, columnNumber, "console-message-url");
+        return this._linkifier.linkifyScriptLocation(target, consoleMessage.scriptId, consoleMessage.url || "", consoleMessage.line, consoleMessage.column, "console-message-url");
     },
 
     /**
      * @param {!WebInspector.RemoteObject|!Object|string} parameter
      * @param {?WebInspector.Target} target
      * @return {!WebInspector.RemoteObject}
      */
     _parameterToRemoteObject: function(parameter, target)
     {
         if (parameter instanceof WebInspector.RemoteObject)
             return parameter;
         if (!target)
             return WebInspector.RemoteObject.fromLocalObject(parameter);
         if (typeof parameter === "object")
             return target.runtimeModel.createRemoteObject(parameter);
         return target.runtimeModel.createRemoteObjectFromPrimitiveValue(parameter);
     },
 
     /**
+     * @param {!WebInspector.ConsoleMessage} consoleMessage
+     * @param {!WebInspector.Linkifier} linkifier
      * @param {!Array.<!WebInspector.RemoteObject|string>} parameters
      * @return {!Element}
      */
-    _format: function(parameters)
+    _format: function(consoleMessage, linkifier, parameters)
     {
         // This node is used like a Builder. Values are continually appended onto it.
         var formattedResult = createElement("span");
         if (!parameters.length)
             return formattedResult;
 
         // Formatting code below assumes that parameters are all wrappers whereas frontend console
         // API allows passing arbitrary values as messages (strings, numbers, etc.). Wrap them here.
         // FIXME: Only pass runtime wrappers here.
         for (var i = 0; i < parameters.length; ++i)
-            parameters[i] = this._parameterToRemoteObject(parameters[i], this._target());
+            parameters[i] = this._parameterToRemoteObject(parameters[i], consoleMessage.target());
 
         // There can be string log and string eval result. We distinguish between them based on message type.
-        var shouldFormatMessage = WebInspector.RemoteObject.type((/** @type {!Array.<!WebInspector.RemoteObject>} **/ (parameters))[0]) === "string" && (this._message.type !== WebInspector.ConsoleMessage.MessageType.Result || this._message.level === WebInspector.ConsoleMessage.MessageLevel.Error || this._message.level === WebInspector.ConsoleMessage.MessageLevel.RevokedError);
+        var messageType = consoleMessage.type;
+        var shouldFormatMessage = WebInspector.RemoteObject.type((/** @type {!Array.<!WebInspector.RemoteObject>} **/ (parameters))[0]) === "string" && (messageType !== WebInspector.ConsoleMessage.MessageType.Result || consoleMessage.level === WebInspector.ConsoleMessage.MessageLevel.Error || consoleMessage.level === WebInspector.ConsoleMessage.MessageLevel.RevokedError);
 
         // Multiple parameters with the first being a format string. Save unused substitutions.
         if (shouldFormatMessage) {
-            var result = this._formatWithSubstitutionString(/** @type {string} **/ (parameters[0].description), parameters.slice(1), formattedResult);
+            var result = this._formatWithSubstitutionString(messageType, linkifier, /** @type {string} **/ (parameters[0].description), parameters.slice(1), formattedResult);
             parameters = result.unusedSubstitutions;
             if (parameters.length)
                 formattedResult.createTextChild(" ");
         }
 
         // Single parameter, or unused substitutions from above.
         for (var i = 0; i < parameters.length; ++i) {
             // Inline strings when formatting.
             if (shouldFormatMessage && parameters[i].type === "string")
                 formattedResult.appendChild(WebInspector.linkifyStringAsFragment(parameters[i].description));
             else
-                formattedResult.appendChild(this._formatParameter(parameters[i], false, true));
+                formattedResult.appendChild(this._formatParameter(messageType, linkifier, parameters[i], false, true));
             if (i < parameters.length - 1)
                 formattedResult.createTextChild(" ");
         }
         return formattedResult;
     },
 
     /**
+     * @param {string} messageType
+     * @param {!WebInspector.Linkifier} linkifier
      * @param {!WebInspector.RemoteObject} output
      * @param {boolean=} forceObjectFormat
      * @param {boolean=} includePreview
      * @return {!Element}
      */
-    _formatParameter: function(output, forceObjectFormat, includePreview)
+    _formatParameter: function(messageType, linkifier, output, forceObjectFormat, includePreview)
     {
         if (output.customPreview())
             return (new WebInspector.CustomPreviewComponent(output)).element;
 
         var type = forceObjectFormat ? "object" : (output.subtype || output.type);
-        var span = createElement("span");
-        span.className = "object-value-" + type + " source-code";
+        var element;
         switch (type) {
         case "array":
         case "typedarray":
-            this._formatParameterAsArray(output, span);
+            element = this._formatParameterAsArray(output, linkifier, messageType);
             break;
         case "error":
-            this._formatParameterAsError(output, span);
+            element = this._formatParameterAsError(output, linkifier);
             break;
         case "function":
         case "generator":
-            this._formatParameterAsFunction(output, span, includePreview);
+            element = this._formatParameterAsFunction(output, includePreview);
             break;
         case "iterator":
         case "map":
         case "object":
         case "promise":
         case "proxy":
         case "set":
-            this._formatParameterAsObject(output, span, includePreview);
+            element = this._formatParameterAsObject(output, linkifier, includePreview);

[lushnikov, 2016/10/22 03:10:18]

element= createElement("span");
element.appendChild(this._formatParameterAsObject(output, linkifier,
includePreview));

             break;
         case "node":
-            this._formatParameterAsNode(output, span);
+            element = this._formatParameterAsNode(output, linkifier);
             break;
         case "string":
-            this._formatParameterAsString(output, span);
+            element = this._formatParameterAsString(output);
             break;
         case "boolean":
         case "date":
         case "null":
         case "number":
         case "regexp":
         case "symbol":
         case "undefined":
-            this._formatParameterAsValue(output, span);
+            element = this._formatParameterAsValue(output);
             break;
         default:
-            this._formatParameterAsValue(output, span);
+            element = this._formatParameterAsValue(output);
             console.error("Tried to format remote object of unknown type.");
         }
-        return span;
+        element.className = "object-value-" + type + " source-code";
+        return element;
     },
 
     /**
      * @param {!WebInspector.RemoteObject} obj
-     * @param {!Element} elem
+     * @return {!Element}
      */
-    _formatParameterAsValue: function(obj, elem)
+    _formatParameterAsValue: function(obj)
     {
-        elem.createTextChild(obj.description || "");
+        var element = createElement("span");
+        element.createTextChild(obj.description || "");
         if (obj.objectId)
-            elem.addEventListener("contextmenu", this._contextMenuEventFired.bind(this, obj), false);
+            element.addEventListener("contextmenu", this._contextMenuEventFired.bind(this, obj), false);
+        return element;
     },
 
     /**
      * @param {!WebInspector.RemoteObject} obj
-     * @param {!Element} elem
+     * @param {!WebInspector.Linkifier} linkifier
      * @param {boolean=} includePreview
+     * @return {!Element}
      */
-    _formatParameterAsObject: function(obj, elem, includePreview)
+    _formatParameterAsObject: function(obj, linkifier, includePreview)

[lushnikov, 2016/10/22 03:10:18]

let's not split this into two - we don't need more functions!

+    {
+        var element = createElement("span");
+        var expandableObject = this._formatAsExpandableObject(obj, linkifier, includePreview);
+        element.appendChild(expandableObject);
+        return element;
+    },
+
+    /**
+     * @param {!WebInspector.RemoteObject} obj
+     * @param {!WebInspector.Linkifier} linkifier
+     * @param {boolean=} includePreview
+     * @return {!Element}
+     */
+    _formatAsExpandableObject: function(obj, linkifier, includePreview)
     {
         var titleElement = createElement("span");
         if (includePreview && obj.preview) {
             titleElement.classList.add("console-object-preview");
             this._previewFormatter.appendObjectPreview(titleElement, obj.preview);
         } else if (obj.type === "function") {
             WebInspector.ObjectPropertiesSection.formatObjectAsFunction(obj, titleElement, false);
             titleElement.classList.add("object-value-function");
         } else {
             titleElement.createTextChild(obj.description || "");
         }
 
-        var section = new WebInspector.ObjectPropertiesSection(obj, titleElement, this._linkifier);
+        var section = new WebInspector.ObjectPropertiesSection(obj, titleElement, linkifier);
         section.element.classList.add("console-view-object-properties-section");
         section.enableContextMenu();
-        elem.appendChild(section.element);
+        return section.element;
     },
 
     /**
      * @param {!WebInspector.RemoteObject} func
-     * @param {!Element} element
      * @param {boolean=} includePreview
+     * @return {!Element}
      */
-    _formatParameterAsFunction: function(func, element, includePreview)
+    _formatParameterAsFunction: function(func, includePreview)
     {
+        var element = createElement("span");
         WebInspector.RemoteFunction.objectAsFunction(func).targetFunction().then(formatTargetFunction.bind(this));
+        return element;
 
         /**
          * @param {!WebInspector.RemoteObject} targetFunction
          * @this {WebInspector.ConsoleViewMessage}
          */
         function formatTargetFunction(targetFunction)
         {
             var functionElement = createElement("span");
             WebInspector.ObjectPropertiesSection.formatObjectAsFunction(targetFunction, functionElement, true, includePreview);
             element.appendChild(functionElement);
@@ skipping 24 matching lines @@
     _renderPropertyPreviewOrAccessor: function(object, propertyPath)
     {
         var property = propertyPath.peekLast();
         if (property.type === "accessor")
             return this._formatAsAccessorProperty(object, propertyPath.map(property => property.name), false);
         return this._previewFormatter.renderPropertyPreview(property.type, /** @type {string} */ (property.subtype), property.value);
     },
 
     /**
      * @param {!WebInspector.RemoteObject} object
-     * @param {!Element} elem
+     * @param {!WebInspector.Linkifier} linkifier
+     * @return {!Element}
      */
-    _formatParameterAsNode: function(object, elem)
+    _formatParameterAsNode: function(object, linkifier)
     {
+        var element = createElement("span");
         WebInspector.Renderer.renderPromise(object).then(appendRenderer.bind(this), failedToRender.bind(this));
+        return element;
+
         /**
          * @param {!Element} rendererElement
          * @this {WebInspector.ConsoleViewMessage}
          */
         function appendRenderer(rendererElement)
         {
-            elem.appendChild(rendererElement);
+            element.appendChild(rendererElement);
             this._formattedParameterAsNodeForTest();
         }
 
         /**
          * @this {WebInspector.ConsoleViewMessage}
          */
         function failedToRender()
         {
-            this._formatParameterAsObject(object, elem, false);
+            var expandableObject = this._formatAsExpandableObject(object, linkifier, false);
+            element.appendChild(expandableObject);
         }
     },
 
     _formattedParameterAsNodeForTest: function()
     {
     },
 
     /**
      * @param {!WebInspector.RemoteObject} array
-     * @param {!Element} elem
+     * @param {!WebInspector.Linkifier} linkifier
+     * @param {string} messageType
+     * @return {!Element}
      */
-    _formatParameterAsArray: function(array, elem)
+    _formatParameterAsArray: function(array, linkifier, messageType)

[lushnikov, 2016/10/22 03:10:18]

let's pass linkifier as the last argument -- everywhere?

     {
-        var usePrintedArrayFormat = this._message.type !== WebInspector.ConsoleMessage.MessageType.DirXML && this._message.type !== WebInspector.ConsoleMessage.MessageType.Result;
+        var element = createElement("span");

[lushnikov, 2016/10/22 03:10:18]

var result = .. -- everywhere

+        var usePrintedArrayFormat = messageType !== WebInspector.ConsoleMessage.MessageType.DirXML && messageType !== WebInspector.ConsoleMessage.MessageType.Result;
         var isLongArray = array.arrayLength() > 100;
         if (usePrintedArrayFormat || isLongArray)
-            this._formatParameterAsObject(array, elem, usePrintedArrayFormat || !isLongArray);
-        else
-            array.getAllProperties(false, printArrayResult.bind(this));
+            return this._formatParameterAsObject(array, linkifier, usePrintedArrayFormat || !isLongArray);
+        array.getAllProperties(false, printArrayResult.bind(this));
+        return element;
 
         /**
          * @param {?Array.<!WebInspector.RemoteObjectProperty>} properties
          * @this {!WebInspector.ConsoleViewMessage}
          */
         function printArrayResult(properties)
         {
             if (!properties) {
-                this._formatParameterAsObject(array, elem, false);
+                var expandableObject = this._formatAsExpandableObject(array, linkifier, false);
+                element.appendChild(expandableObject);
                 return;
             }
 
             var titleElement = createElement("span");
             var elements = {};
             for (var i = 0; i < properties.length; ++i) {
                 var property = properties[i];
                 var name = property.name;
                 if (isNaN(name))
                     continue;
                 if (property.getter)
                     elements[name] = this._formatAsAccessorProperty(array, [name], true);
                 else if (property.value)
                     elements[name] = this._formatAsArrayEntry(property.value);
             }
 
             titleElement.createTextChild("[");
             var lastNonEmptyIndex = -1;
 
             function appendUndefined(titleElement, index)
             {
                 if (index - lastNonEmptyIndex <= 1)
                     return;
                 var span = titleElement.createChild("span", "object-value-undefined");
                 span.textContent = WebInspector.UIString("undefined × %d", index - lastNonEmptyIndex - 1);
             }
 
             var length = array.arrayLength();
             for (var i = 0; i < length; ++i) {
-                var element = elements[i];
-                if (!element)
+                var entryElement = elements[i];

[lushnikov, 2016/10/22 03:10:18]

discard this

+                if (!entryElement)
                     continue;
 
                 if (i - lastNonEmptyIndex > 1) {
                     appendUndefined(titleElement, i);
                     titleElement.createTextChild(", ");
                 }
 
-                titleElement.appendChild(element);
+                titleElement.appendChild(entryElement);
                 lastNonEmptyIndex = i;
                 if (i < length - 1)
                     titleElement.createTextChild(", ");
             }
             appendUndefined(titleElement, length);
 
             titleElement.createTextChild("]");
 
-            var section = new WebInspector.ObjectPropertiesSection(array, titleElement, this._linkifier);
+            var section = new WebInspector.ObjectPropertiesSection(array, titleElement, linkifier);
             section.element.classList.add("console-view-object-properties-section");
             section.enableContextMenu();
-            elem.appendChild(section.element);
+            element.appendChild(section.element);
         }
     },
 
     /**
      * @param {!WebInspector.RemoteObject} output
-     * @param {!Element} elem
+     * @return {!Element}
      */
-    _formatParameterAsString: function(output, elem)
+    _formatParameterAsString: function(output)
     {
         var span = createElement("span");
-        span.className = "object-value-string source-code";
+        span.className = "object-value-string-inner source-code";
         span.appendChild(WebInspector.linkifyStringAsFragment(output.description || ""));
 
         // Make black quotes.
-        elem.classList.remove("object-value-string");

[lushnikov, 2016/10/18 23:07:40]

this is non-trivial change in this mostly mechanical CL. Let's extract
non-trivial change and do it separately. Most likely, you would not need the
object-value-string-inner class, which you introduce in this CL!

[luoe, 2016/10/20 23:01:57]

This "object-value-string-inner" change should* be the only class-related change
in this CL.

The other CL was split out, but unfortunately it is not feasible to move class
defs into builders right now without breaking other places that depend on
object-value-type.

-        elem.createTextChild("\"");
-        elem.appendChild(span);
-        elem.createTextChild("\"");
+        var element = createElement("span");
+        element.createTextChild("\"");
+        element.appendChild(span);
+        element.createTextChild("\"");
+        return element;
     },
 
     /**
      * @param {!WebInspector.RemoteObject} output
-     * @param {!Element} elem
+     * @param {!WebInspector.Linkifier} linkifier
+     * @return {!Element}
      */
-    _formatParameterAsError: function(output, elem)
+    _formatParameterAsError: function(output, linkifier)
     {
-        var span = elem.createChild("span", "object-value-error source-code");
-        var errorSpan = this._tryFormatAsError(output.description || "");
+        var element = createElement("span");
+        var span = element.createChild("span", "object-value-error source-code");
+        var errorSpan = this._tryFormatAsError(output.target(), linkifier, output.description || "");
         span.appendChild(errorSpan ? errorSpan : WebInspector.linkifyStringAsFragment(output.description || ""));
+        return element;
     },
 
     /**
      * @param {!WebInspector.RemoteObject} output
      * @return {!Element}
      */
     _formatAsArrayEntry: function(output)
     {
         return this._previewFormatter.renderPropertyPreview(output.type, output.subtype, output.description);
     },
@@ skipping 37 matching lines @@
                         description = result.description.trimEnd(maxLength);
                 }
                 rootElement.appendChild(this._previewFormatter.renderPropertyPreview(type, subtype, description));
             }
         }
 
         return rootElement;
     },
 
     /**
+     * @param {string} messageType
+     * @param {!WebInspector.Linkifier} linkifier

[lushnikov, 2016/10/22 03:10:18]

make it last -- everywhere

      * @param {string} format
      * @param {!Array.<!WebInspector.RemoteObject>} parameters
      * @param {!Element} formattedResult
      */
-    _formatWithSubstitutionString: function(format, parameters, formattedResult)
+    _formatWithSubstitutionString: function(messageType, linkifier, format, parameters, formattedResult)
     {
         var formatters = {};
 
         /**
          * @param {boolean} force
          * @param {!WebInspector.RemoteObject} obj
          * @return {!Element}
          * @this {WebInspector.ConsoleViewMessage}
          */
         function parameterFormatter(force, obj)
         {
-            return this._formatParameter(obj, force, false);
+            return this._formatParameter(messageType, linkifier, obj, force, false);
         }
 
         function stringFormatter(obj)
         {
             return obj.description;
         }
 
         function floatFormatter(obj)
         {
             if (typeof obj.value !== "number")
@@ skipping 162 matching lines @@
 
         var formattedMessage;
         var consoleMessage = this._message;
         var target = consoleMessage.target();
         var shouldIncludeTrace = !!consoleMessage.stackTrace && (consoleMessage.source === WebInspector.ConsoleMessage.MessageSource.Network || consoleMessage.level === WebInspector.ConsoleMessage.MessageLevel.Error || consoleMessage.level === WebInspector.ConsoleMessage.MessageLevel.RevokedError || consoleMessage.type === WebInspector.ConsoleMessage.MessageType.Trace || consoleMessage.level === WebInspector.ConsoleMessage.MessageLevel.Warning);
         if (target && shouldIncludeTrace)
             formattedMessage = this._buildMessageWithStackTrace(consoleMessage, target, this._linkifier);
         else if (this._message.type === WebInspector.ConsoleMessage.MessageType.Table)
             formattedMessage = this._buildTableMessage(this._message);
         else
-            formattedMessage = this._buildMessage(consoleMessage);
+            formattedMessage = this._buildMessage(consoleMessage, this._linkifier);
         contentElement.appendChild(formattedMessage);
 
         this.updateTimestamp(WebInspector.moduleSetting("consoleTimestampsEnabled").get());
         return this._contentElement;
     },
 
     /**
      * @return {!Element}
      */
     toMessageElement: function()
@@ skipping 143 matching lines @@
 
     /**
      * @return {!Element}
      */
     searchHighlightNode: function(index)
     {
         return this._searchHighlightNodes[index];
     },
 
     /**
+     * @param {?WebInspector.Target} target
+     * @param {!WebInspector.Linkifier} linkifier
      * @param {string} string
      * @return {?Element}
      */
-    _tryFormatAsError: function(string)
+    _tryFormatAsError: function(target, linkifier, string)
     {
         /**
          * @param {string} prefix
          */
         function startsWith(prefix)
         {
             return string.startsWith(prefix);
         }
 
         var errorPrefixes = ["EvalError", "ReferenceError", "SyntaxError", "TypeError", "RangeError", "Error", "URIError"];
-        var target = this._target();
         if (!target || !errorPrefixes.some(startsWith))
             return null;
         var debuggerModel = WebInspector.DebuggerModel.fromTarget(target);
         if (!debuggerModel)
             return null;
 
         var lines = string.split("\n");
         var links = [];
         var position = 0;
         for (var i = 0; i < lines.length; ++i) {
@@ skipping 34 matching lines @@
             links.push({url: url, positionLeft: position + left, positionRight: position + right, lineNumber: splitResult.lineNumber, columnNumber: splitResult.columnNumber});
         }
 
         if (!links.length)
             return null;
 
         var formattedResult = createElement("span");
         var start = 0;
         for (var i = 0; i < links.length; ++i) {
             formattedResult.appendChild(WebInspector.linkifyStringAsFragment(string.substring(start, links[i].positionLeft)));
-            formattedResult.appendChild(this._linkifier.linkifyScriptLocation(target, null, links[i].url, links[i].lineNumber, links[i].columnNumber));
+            formattedResult.appendChild(linkifier.linkifyScriptLocation(target, null, links[i].url, links[i].lineNumber, links[i].columnNumber));
             start = links[i].positionRight;
         }
 
         if (start !== string.length)
             formattedResult.appendChild(WebInspector.linkifyStringAsFragment(string.substring(start)));
 
         return formattedResult;
     }
 }
 
@@ skipping 38 matching lines @@
     {
         if (!this._element) {
             WebInspector.ConsoleViewMessage.prototype.toMessageElement.call(this);
             this._element.classList.toggle("collapsed", this._collapsed);
         }
         return this._element;
     },
 
     __proto__: WebInspector.ConsoleViewMessage.prototype
 }