DevTools: [LiveSASS] make selectors and medias read-only for sass rules

third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js

Index: third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js
diff --git a/third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js b/third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js
index 5510d78ed72962a50fcb17914dcc6b1273af6bbd..8268dd0c8b81458b581b46f3b8128d65a3713972 100644
--- a/third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js
+++ b/third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js
@@ -49,6 +49,8 @@ WebInspector.StylesSidebarPane = function()
     this._keyUpBound = this._keyUp.bind(this);
 
     WebInspector.targetManager.addModelListener(WebInspector.CSSModel, WebInspector.CSSModel.Events.LayoutEditorChange, this._onLayoutEditorChange, this);
+    WebInspector.targetManager.addModelListener(WebInspector.CSSModel, WebInspector.CSSModel.Events.SourceMapAttached, this._onSourceMapAttachedOrDetached, this);
+    WebInspector.targetManager.addModelListener(WebInspector.CSSModel, WebInspector.CSSModel.Events.SourceMapDetached, this._onSourceMapAttachedOrDetached, this);
 }
 
 /**
@@ -109,6 +111,17 @@ WebInspector.StylesSidebarPane.prototype = {
     /**
      * @param {!WebInspector.Event} event
      */
+    _onSourceMapAttachedOrDetached: function(event)
+    {
+        var header = /** @type {!WebInspector.CSSStyleSheetHeader} */(event.data);
+        var sourceMap = header.cssModel().sourceMapForHeader(header);
+        if (!sourceMap || sourceMap.editable())
+            this.update();
+    },
+
+    /**
+     * @param {!WebInspector.Event} event
+     */
     _onLayoutEditorChange: function(event)
     {
         var cssModel = /** @type {!WebInspector.CSSModel} */(event.target);
@@ -817,6 +830,14 @@ WebInspector.StylePropertiesSection = function(parentPane, matchedStyles, style)
         }
     }
 
+    this._isSASSStyle = false;
+    var header = style.styleSheetId ? style.cssModel().styleSheetHeaderForId(style.styleSheetId) : null;
+    if (header) {
+        var sourceMap = header.cssModel().sourceMapForHeader(header);
+        this._isSASSStyle = sourceMap ? sourceMap.editable() : false;
+    }
+    this.element.classList.toggle("sass-style", this._isSASSStyle);
+
     this._mediaListElement = this._titleElement.createChild("div", "media-list media-matches");
     this._selectorRefElement = this._titleElement.createChild("div", "styles-section-subtitle");
     this._updateMediaList();
@@ -1302,6 +1323,9 @@ WebInspector.StylePropertiesSection.prototype = {
             return;
         }
 
+        if (!this.editable || this._isSASSStyle)
+            return;
+
         var config = new WebInspector.InplaceEditor.Config(this._editingMediaCommitted.bind(this, media), this._editingMediaCancelled.bind(this, element), undefined, this._editingMediaBlurHandler.bind(this));
         WebInspector.InplaceEditor.startEditing(element, config);
 
@@ -1409,7 +1433,7 @@ WebInspector.StylePropertiesSection.prototype = {
 
     _startEditingOnMouseEvent: function()
     {
-        if (!this.editable)
+        if (!this.editable || this._isSASSStyle)
             return;
 
         var rule = this._style.parentRule;