DevTools: do not cache details node, remove linkifier from presentation record.

Source/devtools/front_end/TimelinePresentationModel.js

 /*
  * Copyright (C) 2013 Google Inc. All rights reserved.
  * Copyright (C) 2012 Intel Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
@@ skipping 17 matching lines @@
  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
 /**
  * @constructor
  * @extends {WebInspector.Object}
  */
 WebInspector.TimelinePresentationModel = function()
 {
-    this._linkifier = new WebInspector.Linkifier();
     this._filters = [];
     this.reset();
 }
 
 /**
  * @param {!Array.<*>} recordsArray
  * @param {?function(*)|?function(*,number)} preOrderCallback
  * @param {function(*)|function(*,number)=} postOrderCallback
  */
 WebInspector.TimelinePresentationModel.forAllRecords = function(recordsArray, preOrderCallback, postOrderCallback)
@@ skipping 59 matching lines @@
     /**
      * @return {!WebInspector.TimelinePresentationModel.Record}
      */
     rootRecord: function()
     {
         return this._rootRecord;
     },
 
     reset: function()
     {
-        this._linkifier.reset();
         this._rootRecord = new WebInspector.TimelinePresentationModel.Record(this, { type: WebInspector.TimelineModel.RecordType.Root }, null);
         this._sendRequestRecords = {};
         this._timerRecords = {};
         this._requestAnimationFrameRecords = {};
         this._eventDividerRecords = [];
         this._minimumRecordTime = -1;
         this._layoutInvalidateStack = {};
         this._lastScheduleStyleRecalculation = {};
         this._webSocketCreateRecords = {};
         this._coalescingBuckets = {};
@@ skipping 286 matching lines @@
 
 /**
  * @constructor
  * @param {!WebInspector.TimelinePresentationModel} presentationModel
  * @param {!Object} record
  * @param {?WebInspector.TimelinePresentationModel.Record} parentRecord
  */
 WebInspector.TimelinePresentationModel.Record = function(presentationModel, record, parentRecord)
 {
     this._presentationModel = presentationModel;
-    this._linkifier = presentationModel._linkifier;
     this._aggregatedStats = {};
     this._record = /** @type {!TimelineAgent.TimelineEvent} */ (record);
     this._children = [];
     if (parentRecord) {
         this.parent = parentRecord;
         parentRecord.children.push(this);
     }
 
     this._selfTime = this.endTime - this.startTime;
     this._lastChildEndTime = this.endTime;
@@ skipping 17 matching lines @@
 
     var recordTypes = WebInspector.TimelineModel.RecordType;
     switch (record.type) {
     case recordTypes.ResourceSendRequest:
         // Make resource receive record last since request was sent; make finish record last since response received.
         presentationModel._sendRequestRecords[record.data["requestId"]] = this;
         break;
 
     case recordTypes.ResourceReceiveResponse:
         var sendRequestRecord = presentationModel._sendRequestRecords[record.data["requestId"]];
-        if (sendRequestRecord) { // False if we started instrumentation in the middle of request.
+        if (sendRequestRecord) // False if we started instrumentation in the middle of request.
             this.url = sendRequestRecord.url;
-            // Now that we have resource in the collection, recalculate details in order to display short url.
-            sendRequestRecord._refreshDetails();
-            if (sendRequestRecord.parent !== presentationModel._rootRecord && sendRequestRecord.parent.type === recordTypes.ScheduleResourceRequest)
-                sendRequestRecord.parent._refreshDetails();
-        }
         break;
 
     case recordTypes.ResourceReceivedData:
     case recordTypes.ResourceFinish:
         var sendRequestRecord = presentationModel._sendRequestRecords[record.data["requestId"]];
         if (sendRequestRecord) // False for main resource.
             this.url = sendRequestRecord.url;
         break;
 
     case recordTypes.TimerInstall:
@@ skipping 153 matching lines @@
      * @return {!WebInspector.TimelineCategory}
      */
     get category()
     {
         return WebInspector.TimelineUIUtils.categoryForRecord(this._record);
     },
 
     /**
      * @return {string}
      */
-    get title()
+    title: function()
     {
         return WebInspector.TimelineUIUtils.recordTitle(this._presentationModel, this._record);
     },
 
     /**
      * @return {number}
      */
     get startTime()
     {
         return this._record.startTime;
@@ skipping 67 matching lines @@
 
     /**
      * @return {boolean}
      */
     containsTime: function(time)
     {
         return this.startTime <= time && time <= this.endTime;
     },
 
     /**
+     * @param {!WebInspector.Linkifier} linkifier
      * @param {function(!DocumentFragment)} callback
      */
-    generatePopupContent: function(callback)
+    generatePopupContent: function(linkifier, callback)
     {
         var barrier = new CallbackBarrier();
         if (WebInspector.TimelineUIUtils.needsPreviewElement(this.type) && !this._imagePreviewElement)
             WebInspector.DOMPresentationUtils.buildImagePreviewContents(this.url, false, barrier.createCallback(this._setImagePreviewElement.bind(this)));
         if (this._relatedBackendNodeId && !this._relatedNode)
             WebInspector.domAgent.pushNodeByBackendIdToFrontend(this._relatedBackendNodeId, barrier.createCallback(this._setRelatedNode.bind(this)));
 
         barrier.callWhenDone(callbackWrapper.bind(this));
 
         /**
          * @this {WebInspector.TimelinePresentationModel.Record}
          */
         function callbackWrapper()
         {
-            callback(this._generatePopupContentSynchronously());
+            callback(this._generatePopupContentSynchronously(linkifier));
         }
     },
 
     /**
      * @param {string} key
      * @return {?Object}
      */
     getUserObject: function(key)
     {
         if (!this._userObjects)
@@ skipping 23 matching lines @@
     /**
      * @param {?DOMAgent.NodeId} nodeId
      */
     _setRelatedNode: function(nodeId)
     {
         if (typeof nodeId === "number")
             this._relatedNode = WebInspector.domAgent.nodeForId(nodeId);
     },
 
     /**
+     * @param {!WebInspector.Linkifier} linkifier
      * @return {!DocumentFragment}
      */
-    _generatePopupContentSynchronously: function()
+    _generatePopupContentSynchronously: function(linkifier)
     {
         var fragment = document.createDocumentFragment();
         if (!this.coalesced && this._children.length)
             fragment.appendChild(WebInspector.TimelineUIUtils.generatePieChart(this._aggregatedStats, this.category, this._selfTime));
         else
             fragment.appendChild(WebInspector.TimelineUIUtils.generatePieChart(this._aggregatedStats));
 
         if (this.coalesced)
             return fragment;
 
         const recordTypes = WebInspector.TimelineModel.RecordType;
 
         // The messages may vary per record type;
         var callSiteStackTraceLabel;
         var callStackLabel;
         var relatedNodeLabel;
 
-        var contentHelper = new WebInspector.TimelineDetailsContentHelper(true);
+        var contentHelper = new WebInspector.TimelineDetailsContentHelper(linkifier, true);
         contentHelper.appendTextRow(WebInspector.UIString("Self Time"), Number.millisToString(this._selfTime, true));
         contentHelper.appendTextRow(WebInspector.UIString("Start Time"), Number.millisToString(this._startTimeOffset));
 
         switch (this.type) {
             case recordTypes.GCEvent:
                 contentHelper.appendTextRow(WebInspector.UIString("Collected"), Number.bytesToString(this.data["usedHeapSizeDelta"]));
                 break;
             case recordTypes.TimerFire:
                 callSiteStackTraceLabel = WebInspector.UIString("Timer installed");
                 // Fall-through intended.
 
             case recordTypes.TimerInstall:
             case recordTypes.TimerRemove:
                 contentHelper.appendTextRow(WebInspector.UIString("Timer ID"), this.data["timerId"]);
                 if (typeof this.timeout === "number") {
                     contentHelper.appendTextRow(WebInspector.UIString("Timeout"), Number.millisToString(this.timeout));
                     contentHelper.appendTextRow(WebInspector.UIString("Repeats"), !this.singleShot);
                 }
                 break;
             case recordTypes.FireAnimationFrame:
                 callSiteStackTraceLabel = WebInspector.UIString("Animation frame requested");
                 contentHelper.appendTextRow(WebInspector.UIString("Callback ID"), this.data["id"]);
                 break;
             case recordTypes.FunctionCall:
                 if (this.scriptName)
-                    contentHelper.appendElementRow(WebInspector.UIString("Location"), this._linkifyLocation(this.scriptName, this.scriptLine, 0));
+                    contentHelper.appendLocationRow(WebInspector.UIString("Location"), this.scriptName, this.scriptLine);
                 break;
             case recordTypes.ScheduleResourceRequest:
             case recordTypes.ResourceSendRequest:
             case recordTypes.ResourceReceiveResponse:
             case recordTypes.ResourceReceivedData:
             case recordTypes.ResourceFinish:
                 contentHelper.appendElementRow(WebInspector.UIString("Resource"), WebInspector.linkifyResourceAsNode(this.url));
                 if (this._imagePreviewElement)
                     contentHelper.appendElementRow(WebInspector.UIString("Preview"), this._imagePreviewElement);
                 if (this.data["requestMethod"])
                     contentHelper.appendTextRow(WebInspector.UIString("Request Method"), this.data["requestMethod"]);
                 if (typeof this.data["statusCode"] === "number")
                     contentHelper.appendTextRow(WebInspector.UIString("Status Code"), this.data["statusCode"]);
                 if (this.data["mimeType"])
                     contentHelper.appendTextRow(WebInspector.UIString("MIME Type"), this.data["mimeType"]);
                 if (this.data["encodedDataLength"])
                     contentHelper.appendTextRow(WebInspector.UIString("Encoded Data Length"), WebInspector.UIString("%d Bytes", this.data["encodedDataLength"]));
                 break;
             case recordTypes.EvaluateScript:
                 if (this.data && this.url)
-                    contentHelper.appendElementRow(WebInspector.UIString("Script"), this._linkifyLocation(this.url, this.data["lineNumber"]));
+                    contentHelper.appendLocationRow(WebInspector.UIString("Script"), this.url, this.data["lineNumber"]);
                 break;
             case recordTypes.Paint:
                 var clip = this.data["clip"];
                 if (clip) {
                     contentHelper.appendTextRow(WebInspector.UIString("Location"), WebInspector.UIString("(%d, %d)", clip[0], clip[1]));
                     var clipWidth = WebInspector.TimelinePresentationModel.quadWidth(clip);
                     var clipHeight = WebInspector.TimelinePresentationModel.quadHeight(clip);
                     contentHelper.appendTextRow(WebInspector.UIString("Dimensions"), WebInspector.UIString("%d × %d", clipWidth, clipHeight));
                 } else {
                     // Backward compatibility: older version used x, y, width, height fields directly in data.
@@ skipping 47 matching lines @@
                     contentHelper.appendTextRow(WebInspector.UIString("URL"), this.webSocketURL);
                 if (typeof this.webSocketProtocol !== "undefined")
                     contentHelper.appendTextRow(WebInspector.UIString("WebSocket Protocol"), this.webSocketProtocol);
                 if (typeof this.data["message"] !== "undefined")
                     contentHelper.appendTextRow(WebInspector.UIString("Message"), this.data["message"]);
                 break;
             case recordTypes.EmbedderCallback:
                 contentHelper.appendTextRow(WebInspector.UIString("Callback Function"), this.embedderCallbackName);
                 break;
             default:
-                if (this.detailsNode())
-                    contentHelper.appendElementRow(WebInspector.UIString("Details"), this.detailsNode().childNodes[1].cloneNode());
+                var detailsNode = this.buildDetailsNode(linkifier);
+                if (detailsNode)
+                    contentHelper.appendElementRow(WebInspector.UIString("Details"), detailsNode);
                 break;
         }
 
         if (this._relatedNode)
             contentHelper.appendElementRow(relatedNodeLabel || WebInspector.UIString("Related node"), this._createNodeAnchor(this._relatedNode));
 
         if (this.scriptName && this.type !== recordTypes.FunctionCall)
-            contentHelper.appendElementRow(WebInspector.UIString("Function Call"), this._linkifyLocation(this.scriptName, this.scriptLine, 0));
+            contentHelper.appendLocationRow(WebInspector.UIString("Function Call"), this.scriptName, this.scriptLine);
 
         if (this.jsHeapSizeUsed) {
             if (this.usedHeapSizeDelta) {
                 var sign = this.usedHeapSizeDelta > 0 ? "+" : "-";
                 contentHelper.appendTextRow(WebInspector.UIString("Used JavaScript Heap Size"),
                     WebInspector.UIString("%s (%s%s)", Number.bytesToString(this.jsHeapSizeUsed), sign, Number.bytesToString(Math.abs(this.usedHeapSizeDelta))));
             } else if (this.category === WebInspector.TimelineUIUtils.categories().scripting)
                 contentHelper.appendTextRow(WebInspector.UIString("Used JavaScript Heap Size"), Number.bytesToString(this.jsHeapSizeUsed));
         }
 
         if (this.callSiteStackTrace)
-            contentHelper.appendStackTrace(callSiteStackTraceLabel || WebInspector.UIString("Call Site stack"), this.callSiteStackTrace, this._linkifyCallFrame.bind(this));
+            contentHelper.appendStackTrace(callSiteStackTraceLabel || WebInspector.UIString("Call Site stack"), this.callSiteStackTrace);
 
         if (this.stackTrace)
-            contentHelper.appendStackTrace(callStackLabel || WebInspector.UIString("Call Stack"), this.stackTrace, this._linkifyCallFrame.bind(this));
+            contentHelper.appendStackTrace(callStackLabel || WebInspector.UIString("Call Stack"), this.stackTrace);
 
         if (this._warnings) {
             var ul = document.createElement("ul");
             for (var i = 0; i < this._warnings.length; ++i)
                 ul.createChild("li").textContent = this._warnings[i];
             contentHelper.appendElementRow(WebInspector.UIString("Warning"), ul);
         }
         fragment.appendChild(contentHelper.element);
         return fragment;
     },
 
     /**
      * @param {!WebInspector.DOMNode} node
      */
     _createNodeAnchor: function(node)
     {
         var span = document.createElement("span");
         span.classList.add("node-link");
         span.addEventListener("click", WebInspector.Revealer.reveal.bind(WebInspector.Revealer, node, undefined), false);
         WebInspector.DOMPresentationUtils.decorateNodeLabel(node, span);
         return span;
     },
 
-    _refreshDetails: function()
-    {
-        delete this._detailsNode;
-    },
-
-    /**
-     * @return {?Node}
-     */
-    detailsNode: function()
-    {
-        if (typeof this._detailsNode === "undefined") {
-            this._detailsNode = this._getRecordDetails();
-
-            if (this._detailsNode && !this.coalesced) {
-                this._detailsNode.insertBefore(document.createTextNode("("), this._detailsNode.firstChild);
-                this._detailsNode.appendChild(document.createTextNode(")"));
-            }
-        }
-        return this._detailsNode;
-    },
-
     _createSpanWithText: function(textContent)
     {
         var node = document.createElement("span");
         node.textContent = textContent;
         return node;
     },
 
     /**
+     * @param {!WebInspector.Linkifier} linkifier
      * @return {?Node}
      */
-    _getRecordDetails: function()
+    buildDetailsNode: function(linkifier)
     {
         var details;
+        var detailsText;
         if (this.coalesced)
             return this._createSpanWithText(WebInspector.UIString("× %d", this.children.length));
 
         switch (this.type) {
         case WebInspector.TimelineModel.RecordType.GCEvent:
-            details = WebInspector.UIString("%s collected", Number.bytesToString(this.data["usedHeapSizeDelta"]));
+            detailsText = WebInspector.UIString("%s collected", Number.bytesToString(this.data["usedHeapSizeDelta"]));
             break;
         case WebInspector.TimelineModel.RecordType.TimerFire:
-            details = this._linkifyScriptLocation(this.data["timerId"]);
+            details = this._linkifyScriptLocation(linkifier);
+            detailsText = this.data["timerId"];
             break;
         case WebInspector.TimelineModel.RecordType.FunctionCall:
             if (this.scriptName)
-                details = this._linkifyLocation(this.scriptName, this.scriptLine, 0);
+                details = this._linkifyLocation(linkifier, this.scriptName, this.scriptLine, 0);
             break;
         case WebInspector.TimelineModel.RecordType.FireAnimationFrame:
-            details = this._linkifyScriptLocation(this.data["id"]);
+            details = this._linkifyScriptLocation(linkifier);
+            detailsText = this.data["id"];
             break;
         case WebInspector.TimelineModel.RecordType.EventDispatch:
-            details = this.data ? this.data["type"] : null;
+            detailsText = this.data ? this.data["type"] : null;
             break;
         case WebInspector.TimelineModel.RecordType.Paint:
             var width = this.data.clip ? WebInspector.TimelinePresentationModel.quadWidth(this.data.clip) : this.data.width;
             var height = this.data.clip ? WebInspector.TimelinePresentationModel.quadHeight(this.data.clip) : this.data.height;
             if (width && height)
-                details = WebInspector.UIString("%d\u2009\u00d7\u2009%d", width, height);
+                detailsText = WebInspector.UIString("%d\u2009\u00d7\u2009%d", width, height);
             break;
         case WebInspector.TimelineModel.RecordType.TimerInstall:
         case WebInspector.TimelineModel.RecordType.TimerRemove:
-            details = this._linkifyTopCallFrame(this.data["timerId"]);
+            details = this._linkifyTopCallFrame(linkifier);
+            detailsText = this.data["timerId"];
             break;
         case WebInspector.TimelineModel.RecordType.RequestAnimationFrame:
         case WebInspector.TimelineModel.RecordType.CancelAnimationFrame:
-            details = this._linkifyTopCallFrame(this.data["id"]);
+            details = this._linkifyTopCallFrame(linkifier);
+            detailsText = this.data["id"];
             break;
         case WebInspector.TimelineModel.RecordType.ParseHTML:
         case WebInspector.TimelineModel.RecordType.RecalculateStyles:
-            details = this._linkifyTopCallFrame();
+            details = this._linkifyTopCallFrame(linkifier);
             break;
         case WebInspector.TimelineModel.RecordType.EvaluateScript:
-            details = this.url ? this._linkifyLocation(this.url, this.data["lineNumber"], 0) : null;
+            details = this.url ? this._linkifyLocation(linkifier, this.url, this.data["lineNumber"], 0) : null;
             break;
         case WebInspector.TimelineModel.RecordType.XHRReadyStateChange:
         case WebInspector.TimelineModel.RecordType.XHRLoad:
         case WebInspector.TimelineModel.RecordType.ScheduleResourceRequest:
         case WebInspector.TimelineModel.RecordType.ResourceSendRequest:
         case WebInspector.TimelineModel.RecordType.ResourceReceivedData:
         case WebInspector.TimelineModel.RecordType.ResourceReceiveResponse:
         case WebInspector.TimelineModel.RecordType.ResourceFinish:
         case WebInspector.TimelineModel.RecordType.DecodeImage:
         case WebInspector.TimelineModel.RecordType.ResizeImage:
-            details = WebInspector.displayNameForURL(this.url);
+            detailsText = WebInspector.displayNameForURL(this.url);
             break;
         case WebInspector.TimelineModel.RecordType.ConsoleTime:
-            details = this.data["message"];
+            detailsText = this.data["message"];
             break;
         case WebInspector.TimelineModel.RecordType.EmbedderCallback:
-            details = this.data["callbackName"];
+            detailsText = this.data["callbackName"];
             break;
         default:
-            details = this.scriptName ? this._linkifyLocation(this.scriptName, this.scriptLine, 0) : (this._linkifyTopCallFrame() || null);
+            details = this.scriptName ? this._linkifyLocation(linkifier, this.scriptName, this.scriptLine, 0) : (this._linkifyTopCallFrame(linkifier) || null);
             break;
         }
 
-        if (details) {
-            if (details instanceof Node)
-                details.tabIndex = -1;
-            else
-                return this._createSpanWithText("" + details);
-        }
-
-        return details || null;
+        if (!details && detailsText)
+            details = document.createTextNode(detailsText);
+        return details;
     },
 
     /**
+     * @param {!WebInspector.Linkifier} linkifier
      * @param {string} url
      * @param {number} lineNumber
      * @param {number=} columnNumber
      */
-    _linkifyLocation: function(url, lineNumber, columnNumber)
+    _linkifyLocation: function(linkifier, url, lineNumber, columnNumber)
     {
         // FIXME(62725): stack trace line/column numbers are one-based.
         columnNumber = columnNumber ? columnNumber - 1 : 0;
-        return this._linkifier.linkifyLocation(url, lineNumber - 1, columnNumber, "timeline-details");
+        return linkifier.linkifyLocation(url, lineNumber - 1, columnNumber, "timeline-details");
     },
 
     /**
+     * @param {!WebInspector.Linkifier} linkifier
      * @param {!ConsoleAgent.CallFrame} callFrame
      */
-    _linkifyCallFrame: function(callFrame)
+    _linkifyCallFrame: function(linkifier, callFrame)
     {
-        return this._linkifyLocation(callFrame.url, callFrame.lineNumber, callFrame.columnNumber);
+        return this._linkifyLocation(linkifier, callFrame.url, callFrame.lineNumber, callFrame.columnNumber);
     },
 
     /**
-     * @param {string=} defaultValue
+     * @param {!WebInspector.Linkifier} linkifier
+     * @return {?Element}
      */
-    _linkifyTopCallFrame: function(defaultValue)
+    _linkifyTopCallFrame: function(linkifier)
     {
         if (this.stackTrace)
-            return this._linkifyCallFrame(this.stackTrace[0]);
+            return this._linkifyCallFrame(linkifier, this.stackTrace[0]);
         if (this.callSiteStackTrace)
-            return this._linkifyCallFrame(this.callSiteStackTrace[0]);
-        return defaultValue;
+            return this._linkifyCallFrame(linkifier, this.callSiteStackTrace[0]);
+        return null;
     },
 
     /**
-     * @param {*} defaultValue
-     * @return {!Element|string}
+     * @param {!WebInspector.Linkifier} linkifier
+     * @return {?Element}
      */
-    _linkifyScriptLocation: function(defaultValue)
+    _linkifyScriptLocation: function(linkifier)
     {
-        return this.scriptName ? this._linkifyLocation(this.scriptName, this.scriptLine, 0) : "" + defaultValue;
+        return this.scriptName ? this._linkifyLocation(linkifier, this.scriptName, this.scriptLine, 0) : null;
     },
 
     calculateAggregatedStats: function()
     {
         this._aggregatedStats = {};
         this._cpuTime = this._selfTime;
 
         for (var index = this._children.length; index; --index) {
             var child = this._children[index - 1];
             for (var category in child._aggregatedStats)
@@ skipping 37 matching lines @@
     {
         return this._childHasWarnings;
     },
 
     /**
      * @param {!RegExp} regExp
      * @return {boolean}
      */
     testContentMatching: function(regExp)
     {
-        var toSearchText = this.title;
-        if (this.detailsNode())
-            toSearchText += " " + this.detailsNode().textContent;
-        return regExp.test(toSearchText);
+        var tokens = Object.values(this._record.data);
+        tokens.push(this.title());
+        return regExp.test(tokens.join("|"));
     }
 }
 
 /**
  * @param {!Array.<number>} quad
  * @return {number}
  */
 WebInspector.TimelinePresentationModel.quadWidth = function(quad)
 {
     return Math.round(Math.sqrt(Math.pow(quad[0] - quad[2], 2) + Math.pow(quad[1] - quad[3], 2)));
@@ skipping 30 matching lines @@
 {
 }
 
 WebInspector.TimelinePresentationModel.Filter.prototype = {
     /**
      * @param {!WebInspector.TimelinePresentationModel.Record} record
      * @return {boolean}
      */
     accept: function(record) { return false; }
 }