DevTools: Refactor Timeline.TimelineUIUtils.buildPicturePreviewContent to be async

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 672 matching lines @@
    * @return {!Promise<!DocumentFragment>}
    */
   static async buildTraceEventDetails(event, model, linkifier, detailed) {
     var maybeTarget = model.targetByEvent(event);
     if (!maybeTarget) {
       return Timeline.TimelineUIUtils._buildTraceEventDetailsSynchronously(
           event, model, linkifier, detailed, null);
     }
 
     var target = /** @type {!SDK.Target} */ (maybeTarget);
-    if (!event[Timeline.TimelineUIUtils._previewElementSymbol]) {
+    if (typeof event[Timeline.TimelineUIUtils._previewElementSymbol] === 'undefined') {
+      var previewElement = null;
       var url = TimelineModel.TimelineData.forEvent(event).url;
-      event[Timeline.TimelineUIUtils._previewElementSymbol] = await new Promise(fulfill => {
-        if (url)
-          Components.DOMPresentationUtils.buildImagePreviewContents(target, url, false).then(fulfill);
-        else if (TimelineModel.TimelineData.forEvent(event).picture)
-          Timeline.TimelineUIUtils.buildPicturePreviewContent(event, target, fulfill);
-        else
-          fulfill();
-      }) || null;
+      if (url)
+        previewElement = await Components.DOMPresentationUtils.buildImagePreviewContents(target, url, false);
+      else if (TimelineModel.TimelineData.forEvent(event).picture)
+        previewElement = await Timeline.TimelineUIUtils.buildPicturePreviewContent(event, target);
+      event[Timeline.TimelineUIUtils._previewElementSymbol] = previewElement;
     }
 
     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;
@@ skipping 662 matching lines @@
         total['idle'] = Math.max(0, event.endTime - event.startTime - aggregatedTotal);
       }
       return false;
     }
     return hasChildren;
   }
 
   /**
    * @param {!SDK.TracingModel.Event} event
    * @param {!SDK.Target} target
-   * @param {function(!Element=)} callback
+   * @return {!Promise<?Element>}
    */
-  static buildPicturePreviewContent(event, target, callback) {
-    new TimelineModel.LayerPaintEvent(event, target).snapshotPromise().then(onSnapshotLoaded);
-    /**
-     * @param {?SDK.SnapshotWithRect} snapshotWithRect
-     */
-    function onSnapshotLoaded(snapshotWithRect) {
-      if (!snapshotWithRect) {
-        callback();
-        return;
-      }
-      snapshotWithRect.snapshot.replay(null, null, 1).then(imageURL => onGotImage(imageURL));
-      snapshotWithRect.snapshot.release();
-    }
-
-    /**
-     * @param {?string} imageURL
-     */
-    function onGotImage(imageURL) {
-      if (!imageURL) {
-        callback();
-        return;
-      }
-      var container = createElement('div');
-      UI.appendStyle(container, 'components/imagePreview.css');
-      container.classList.add('image-preview-container', 'vbox', 'link');
-      var img = container.createChild('img');
-      img.src = imageURL;
-      var paintProfilerButton = container.createChild('a');
-      paintProfilerButton.textContent = Common.UIString('Paint Profiler');
-      container.addEventListener('click', showPaintProfiler, false);
-      callback(container);
-    }
+  static async buildPicturePreviewContent(event, target) {
+    var snapshotWithRect = await new TimelineModel.LayerPaintEvent(event, target).snapshotPromise();
+    if (!snapshotWithRect)
+      return null;
+    var imageURLPromise = snapshotWithRect.snapshot.replay(null, null, 1);
+    snapshotWithRect.snapshot.release();
+    var imageURL = await imageURLPromise;
+    if (!imageURL)
+      return null;
+    var container = createElement('div');
+    UI.appendStyle(container, 'components/imagePreview.css');
+    container.classList.add('image-preview-container', 'vbox', 'link');
+    var img = container.createChild('img');
+    img.src = imageURL;
+    var paintProfilerButton = container.createChild('a');
+    paintProfilerButton.textContent = Common.UIString('Paint Profiler');
+    container.addEventListener('click', showPaintProfiler, false);
+    return container;
 
     function showPaintProfiler() {
       Timeline.TimelinePanel.instance().select(
           Timeline.TimelineSelection.fromTraceEvent(event), Timeline.TimelineDetailsView.Tab.PaintProfiler);
     }
   }
 
   /**
    * @param {!SDK.TracingModel.Event} event
    * @param {number} zeroTime
@@ skipping 873 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');