DevTools: introduce "Track CSS Usage" experiment

third_party/WebKit/Source/devtools/front_end/components_lazy/CoverageProfile.js

+// Copyright 2016 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+WebInspector.CoverageProfile = class {
+  constructor() {
+    this._updateTimer = null;
+    this.reset();
+  }
+
+  /**
+   * @return {!WebInspector.CoverageProfile}
+   */
+  static instance() {
+    if (!WebInspector.CoverageProfile._instance)
+      WebInspector.CoverageProfile._instance = new WebInspector.CoverageProfile();
+
+    return WebInspector.CoverageProfile._instance;
+  }
+
+  /**
+   * @param {string} url
+   * @param {!WebInspector.TextRange} range
+   */
+  appendUnusedRule(url, range) {
+    if (!url)
+      return;
+
+    var fileInfo = this._coverageForURL.get(url);

[lushnikov, 2016/11/09 01:55:22]

fileInfo is a poor name as well

+    if (!fileInfo) {
+      fileInfo = new Set();
+      this._coverageForURL.set(url, fileInfo);
+    }
+    fileInfo.add(range);
+
+    this._scheduleUpdate();
+  }
+
+  reset() {
+    /** @type {!Map<string, !Set<!WebInspector.TextRange>>} */

[lushnikov, 2016/11/09 01:55:22]

use Multimap

+    this._coverageForURL = new Map();
+    this._scheduleUpdate();
+  }
+
+  _scheduleUpdate() {
+    if (this._updateTimer)
+      return;
+
+    this._updateTimer = setTimeout(() => {
+      this._updateTimer = null;
+      this._doUpdate();
+    }, 0);

[lushnikov, 2016/11/09 01:55:22]

let's have non-zero timeout, e.g. 100

+  }
+
+  _doUpdate() {
+    for (var url of this._coverageForURL.keysArray()) {

[lushnikov, 2016/11/09 01:55:22]

this appproach not gonna work in case of reset() method

+      var uiSourceCode = WebInspector.workspace.uiSourceCodeForURL(url);
+      if (uiSourceCode)
+        uiSourceCode.removeAllLineDecorations(WebInspector.CoverageProfile.LineDecorator.type);
+    }
+
+    for (var fileInfo of this._coverageForURL) {

[lushnikov, 2016/11/09 01:55:22]

let's iterate over keys here to avoid typecasts

+      var url = /** @type {string} */ (fileInfo[0]);
+      var uiSourceCode = WebInspector.workspace.uiSourceCodeForURL(url);
+      if (!uiSourceCode)
+        continue;
+
+      for (var range of fileInfo[1]) {
+        for (var line  = range.startLine; line <= range.endLine; ++line) {

[lushnikov, 2016/11/09 01:55:22]

multimple style issues here:
1. extra spaces before "="
2. indent should be 2 spaces
3. drop {} around single-line blocks

+            uiSourceCode.addLineDecoration(line, WebInspector.CoverageProfile.LineDecorator.type, range.startColumn);
+        }
+      }
+    }
+  }
+};
+
+/**
+ * @implements {WebInspector.UISourceCodeFrame.LineDecorator}
+ */
+WebInspector.CoverageProfile.LineDecorator = class {
+  /**
+   * @override
+   * @param {!WebInspector.UISourceCode} uiSourceCode
+   * @param {!WebInspector.CodeMirrorTextEditor} textEditor
+   */
+  decorate(uiSourceCode, textEditor) {
+    var gutterType = 'CodeMirror-gutter-coverage';
+
+    var decorations = uiSourceCode.lineDecorations(WebInspector.CoverageProfile.LineDecorator.type);
+    textEditor.uninstallGutter(gutterType);
+    if (!decorations)
+      return;
+
+    textEditor.installGutter(gutterType, false);
+
+    for (var decoration of decorations.values()) {
+      var element = createElementWithClass('div', 'text-editor-line-marker-coverage');
+      textEditor.setGutterDecoration(decoration.line(), gutterType, element);
+    }
+  }
+};
+
+WebInspector.CoverageProfile.LineDecorator.type = 'coverage';