DevTools: adopt FilmStripModel to new screenshot recorder trace format

Source/devtools/front_end/components_lazy/FilmStripModel.js

Index: Source/devtools/front_end/components_lazy/FilmStripModel.js
diff --git a/Source/devtools/front_end/components_lazy/FilmStripModel.js b/Source/devtools/front_end/components_lazy/FilmStripModel.js
index 9dd1f8fd879807862f4dbf286119dde9f6063303..88bec4badddc146f8882207cfe41c8ad3e880c9f 100644
--- a/Source/devtools/front_end/components_lazy/FilmStripModel.js
+++ b/Source/devtools/front_end/components_lazy/FilmStripModel.js
@@ -24,15 +24,24 @@ WebInspector.FilmStripModel = function(tracingModel)
 
     var events = mainThread.events();
     for (var i = 0; i < events.length; ++i) {
-        if (events[i].category === "disabled-by-default-devtools.screenshot" && events[i].name === "CaptureFrame") {
-            var data = events[i].args.data;
-            if (!data)
-                continue;
-            this._frames.push(new WebInspector.FilmStripModel.Frame(this, data, events[i].startTime, this._frames.length));
+        if (events[i].category !== "disabled-by-default-devtools.screenshot")
+            continue;
+
+        if (events[i].name === WebInspector.FilmStripModel.TraceEvents.CaptureFrame) {
+            var data = events[i].args["data"];
+            if (data)
+                this._frames.push(WebInspector.FilmStripModel.Frame._fromEvent(this, events[i], this._frames.length));
+        } else if (events[i].name === WebInspector.FilmStripModel.TraceEvents.Screenshot) {
+            this._frames.push(WebInspector.FilmStripModel.Frame._fromSnapshot(this, /** @type {!WebInspector.TracingModel.ObjectSnapshot} */ (events[i]), this._frames.length));
         }
     }
 }
 
+WebInspector.FilmStripModel.TraceEvents = {
+    CaptureFrame: "CaptureFrame",
+    Screenshot: "Screenshot"
+}
+
 WebInspector.FilmStripModel.prototype = {
     /**
      * @return {!Array<!WebInspector.FilmStripModel.Frame>}
@@ -73,16 +82,44 @@ WebInspector.FilmStripModel.prototype = {
 /**
  * @constructor
  * @param {!WebInspector.FilmStripModel} model
- * @param {string} imageData
  * @param {number} timestamp
  * @param {number} index
  */
-WebInspector.FilmStripModel.Frame = function(model, imageData, timestamp, index)
+WebInspector.FilmStripModel.Frame = function(model, timestamp, index)
 {
     this._model = model;
-    this.imageData = imageData;
     this.timestamp = timestamp;
     this.index = index;
+    /** @type {?string} */
+    this._imageData = null;
+    /** @type {?WebInspector.TracingModel.ObjectSnapshot} */
+    this._snapshot = null;
+}
+
+/**
+ * @param {!WebInspector.FilmStripModel} model
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {number} index
+ * @return {!WebInspector.FilmStripModel.Frame}
+ */
+WebInspector.FilmStripModel.Frame._fromEvent = function(model, event, index)
+{
+    var frame = new WebInspector.FilmStripModel.Frame(model, event.startTime, index);
+    frame._imageData = event.args["data"];
+    return frame;
+}
+
+/**
+ * @param {!WebInspector.FilmStripModel} model
+ * @param {!WebInspector.TracingModel.ObjectSnapshot} snapshot
+ * @param {number} index
+ * @return {!WebInspector.FilmStripModel.Frame}
+ */
+WebInspector.FilmStripModel.Frame._fromSnapshot = function(model, snapshot, index)
+{
+    var frame = new WebInspector.FilmStripModel.Frame(model, snapshot.startTime, index);
+    frame._snapshot = snapshot;
+    return frame;
 }
 
 WebInspector.FilmStripModel.Frame.prototype = {
@@ -92,5 +129,16 @@ WebInspector.FilmStripModel.Frame.prototype = {
     model: function()
     {
         return this._model;
+    },
+
+    /**
+     * @return {!Promise<?string>}
+     */
+    imageDataPromise: function()
+    {
+        if (this._imageData || !this._snapshot)
+            return Promise.resolve(this._imageData);
+
+        return /** @type {!Promise<?string>} */ (this._snapshot.objectPromise());
     }
 }