DevTools: Highlight DOM node on hover in flamechart.

third_party/WebKit/Source/devtools/front_end/timeline/TimelineUIUtils.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 655 matching lines @@
       var frame = TimelineModel.TimelineData.forEvent(event).topFrame();
       return frame ? linkifier.maybeLinkifyConsoleCallFrame(target, frame, 'timeline-details') : null;
     }
   }
 
   /**
    * @param {!SDK.TracingModel.Event} event
    * @param {!TimelineModel.TimelineModel} model
    * @param {!Components.Linkifier} linkifier
    * @param {boolean} detailed
-   * @param {function(!DocumentFragment)} callback
+   * @return {!Promise<!DocumentFragment>}
    */
-  static buildTraceEventDetails(event, model, linkifier, detailed, callback) {
-    var target = model.targetByEvent(event);
-    if (!target) {
-      callbackWrapper();
-      return;
+  static async buildTraceEventDetails(event, model, linkifier, detailed) {
+    var maybeTarget = model.targetByEvent(event);
+    if (!maybeTarget) {
+      return Timeline.TimelineUIUtils._buildTraceEventDetailsSynchronously(
+          event, model, linkifier, detailed, null);
     }
-    var relatedNodes = null;
+
+    var target = /** @type {!SDK.Target} */ (maybeTarget);
     var barrier = new CallbackBarrier();
     if (!event[Timeline.TimelineUIUtils._previewElementSymbol]) {
       var url = TimelineModel.TimelineData.forEvent(event).url;
-      if (url) {
-        Components.DOMPresentationUtils.buildImagePreviewContents(
-            target, url, false, barrier.createCallback(saveImage));
-      } else if (TimelineModel.TimelineData.forEvent(event).picture) {
-        Timeline.TimelineUIUtils.buildPicturePreviewContent(event, target, barrier.createCallback(saveImage));
-      }
+      event[Timeline.TimelineUIUtils._previewElementSymbol] = await new Promise(fulfill => {
+        if (url)
+          Components.DOMPresentationUtils.buildImagePreviewContents(target, url, false, fulfill);
+        else if (TimelineModel.TimelineData.forEvent(event).picture)
+          Timeline.TimelineUIUtils.buildPicturePreviewContent(event, target, fulfill);
+        else
+          fulfill();
+      }) || null;
     }
+
     var nodeIdsToResolve = new Set();
     var timelineData = TimelineModel.TimelineData.forEvent(event);
     if (timelineData.backendNodeId)
       nodeIdsToResolve.add(timelineData.backendNodeId);
     var invalidationTrackingEvents = TimelineModel.InvalidationTracker.invalidationEventsFor(event);
     if (invalidationTrackingEvents)
       Timeline.TimelineUIUtils._collectInvalidationNodeIds(nodeIdsToResolve, invalidationTrackingEvents);
+    var relatedNodes = null;
     if (nodeIdsToResolve.size) {
       var domModel = SDK.DOMModel.fromTarget(target);
-      if (domModel)
-        domModel.pushNodesByBackendIdsToFrontend(nodeIdsToResolve, barrier.createCallback(setRelatedNodeMap));
-    }
-    barrier.callWhenDone(callbackWrapper);
-
-    /**
-     * @param {!Element=} element
-     */
-    function saveImage(element) {
-      event[Timeline.TimelineUIUtils._previewElementSymbol] = element || null;
+      if (domModel) {
+        relatedNodes = await new Promise(fulfill =>
+            domModel.pushNodesByBackendIdsToFrontend(nodeIdsToResolve, fulfill));
+      }
     }
 
-    /**
-     * @param {?Map<number, ?SDK.DOMNode>} nodeMap
-     */
-    function setRelatedNodeMap(nodeMap) {
-      relatedNodes = nodeMap;
-    }
-
-    function callbackWrapper() {
-      callback(Timeline.TimelineUIUtils._buildTraceEventDetailsSynchronously(
-          event, model, linkifier, detailed, relatedNodes));
-    }
+    return Timeline.TimelineUIUtils._buildTraceEventDetailsSynchronously(
+          event, model, linkifier, detailed, relatedNodes);
   }
 
   /**
    * @param {!SDK.TracingModel.Event} event
    * @param {!TimelineModel.TimelineModel} model
    * @param {!Components.Linkifier} linkifier
    * @param {boolean} detailed
    * @param {?Map<number, ?SDK.DOMNode>} relatedNodesMap
    * @return {!DocumentFragment}
    */
@@ skipping 1565 matching lines @@
    * @param {string=} warningType
    */
   appendWarningRow(event, warningType) {
     var warning = Timeline.TimelineUIUtils.eventWarning(event, warningType);
     if (warning)
       this.appendElementRow(Common.UIString('Warning'), warning, true);
   }
 };
 
 Timeline.TimelineUIUtils._categoryBreakdownCacheSymbol = Symbol('categoryBreakdownCache');