Added showing slow scroll rectangles in Layers panel.

Source/devtools/front_end/LayerTreeModel.js

 /*
  * Copyright (C) 2013 Google 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.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 79 matching lines @@
     /**
      * @return {?WebInspector.Layer}
      */
     contentRoot: function()
     {
         return this._contentRoot;
     },
 
     /**
      * @param {function(!WebInspector.Layer)} callback
-     * @param {?WebInspector.Layer} root
+     * @param {?WebInspector.Layer=} root
      * @return {boolean}
      */
     forEachLayer: function(callback, root)
     {
         if (!root) {
             root = this.root();
             if (!root)
                 return false;
         }
         return callback(root) || root.children().some(this.forEachLayer.bind(this, callback));
@@ skipping 15 matching lines @@
     {
         if (payload)
             this._resolveBackendNodeIdsForLayers(payload, onBackendNodeIdsResolved.bind(this));
         else
             onBackendNodeIdsResolved.call(this);
         /**
          * @this {WebInspector.LayerTreeModel}
          */
         function onBackendNodeIdsResolved()
         {
-            this._repopulate(payload);
+            this._repopulate(payload || []);
             this.dispatchEventToListeners(WebInspector.LayerTreeModel.Events.LayerTreeChanged);
         }
     },
 
     /**
-     * @param {!Array.<!LayerTreeAgent.Layer>=} payload
+     * @param {!Array.<!LayerTreeAgent.Layer>} layers
      */
-    _repopulate: function(payload)
+    _repopulate: function(layers)
     {
         this._root = null;
         this._contentRoot = null;
         // Payload will be null when not in the composited mode.
-        if (!payload)
+        if (!layers)
             return;
         var oldLayersById = this._layersById;
         this._layersById = {};
-        for (var i = 0; i < payload.length; ++i) {
-            var layerId = payload[i].layerId;
+        for (var i = 0; i < layers.length; ++i) {
+            var layerId = layers[i].layerId;
             var layer = oldLayersById[layerId];
             if (layer)
-                layer._reset(payload[i]);
+                layer._reset(layers[i]);
             else
-                layer = new WebInspector.Layer(payload[i]);
+                layer = new WebInspector.Layer(layers[i]);
             this._layersById[layerId] = layer;
-            if (payload[i].backendNodeId) {
-                layer._setNodeId(this._backendNodeIdToNodeId[payload[i].backendNodeId]);
+            if (layers[i].backendNodeId) {
+                layer._setNodeId(this._backendNodeIdToNodeId[layers[i].backendNodeId]);
                 if (!this._contentRoot)
                     this._contentRoot = layer;
             }
             var lastPaintRect = this._lastPaintRectByLayerId[layerId];
             if (lastPaintRect)
                 layer._lastPaintRect = lastPaintRect;
             var parentId = layer.parentId();
             if (parentId) {
                 var parent = this._layersById[parentId];
                 if (!parent)
                     console.assert(parent, "missing parent " + parentId + " for layer " + layerId);
                 parent.addChild(layer);
             } else {
                 if (this._root)
                     console.assert(false, "Multiple root layers");
                 this._root = layer;
             }
         }
         this._lastPaintRectByLayerId = {};
     },
 
     /**
-     * @param {!Array.<!LayerTreeAgent.Layer>=} payload
+     * @param {!Array.<!LayerTreeAgent.Layer>=} layers
      */
-    _layerTreeChanged: function(payload)
+    _layerTreeChanged: function(layers)
     {
         if (!this._enabled)
             return;
-        this._resolveNodesAndRepopulate(payload);
+        this._resolveNodesAndRepopulate(layers);
     },
 
     /**
      * @param {!Array.<!LayerTreeAgent.Layer>} layers
      * @param {function()} callback
      */
     _resolveBackendNodeIdsForLayers: function(layers, callback)
     {
         var idsToResolve = {};
         var requestedIds = [];
@@ skipping 52 matching lines @@
 
     __proto__: WebInspector.Object.prototype
 }
 
 /**
  * @constructor
  * @param {!LayerTreeAgent.Layer} layerPayload
  */
 WebInspector.Layer = function(layerPayload)
 {
+    this._scrollRects = [];
     this._reset(layerPayload);
 }
 
 WebInspector.Layer.prototype = {
     /**
      * @return {string}
      */
     id: function()
     {
         return this._layerPayload.layerId;
@@ skipping 141 matching lines @@
 
     /**
      * @return {?DOMAgent.Rect}
      */
     lastPaintRect: function()
     {
         return this._lastPaintRect;
     },
 
     /**
+     * @return {!Array.<!LayerTreeAgent.ScrollRect>}
+     */
+    scrollRects: function()
+    {
+        return this._scrollRects;
+    },
+
+    /**
      * @param {function(!Array.<string>)} callback
      */
     requestCompositingReasons: function(callback)
     {
         var wrappedCallback = InspectorBackend.wrapClientCallback(callback, "LayerTreeAgent.reasonsForCompositingLayer(): ", undefined, []);
         LayerTreeAgent.compositingReasons(this.id(), wrappedCallback);
     },
 
     /**
      * @param {function(!WebInspector.PaintProfilerSnapshot=)} callback
@@ skipping 18 matching lines @@
      * @param {!LayerTreeAgent.Layer} layerPayload
      */
     _reset: function(layerPayload)
     {
         this._children = [];
         this._parent = null;
         this._paintCount = 0;
         this._layerPayload = layerPayload;
         this._image = null;
         this._nodeId = 0;
+        this._scrollRects = this._layerPayload.scrollRects || [];
     }
 }
 
 /**
  * @constructor
  * @param {!Array.<!LayerTreeAgent.Layer>} layers
  */
 WebInspector.LayerTreeSnapshot = function(layers)
 {
     this.layers = layers;
 }
 
 /**
  * @constructor
  * @implements {LayerTreeAgent.Dispatcher}
  * @param {!WebInspector.LayerTreeModel} layerTreeModel
  */
 WebInspector.LayerTreeDispatcher = function(layerTreeModel)
 {
     this._layerTreeModel = layerTreeModel;
 }
 
 WebInspector.LayerTreeDispatcher.prototype = {
     /**
-     * @param {!Array.<!LayerTreeAgent.Layer>=} payload
+     * @param {!Array.<!LayerTreeAgent.Layer>=} layers
      */
-    layerTreeDidChange: function(payload)
+    layerTreeDidChange: function(layers)
     {
-        this._layerTreeModel._layerTreeChanged(payload);
+        this._layerTreeModel._layerTreeChanged(layers);
     },
 
     /**
      * @param {!LayerTreeAgent.LayerId} layerId
      * @param {!DOMAgent.Rect} clipRect
      */
     layerPainted: function(layerId, clipRect)
     {
         this._layerTreeModel._layerPainted(layerId, clipRect);
     }
 }