Changeset 185720 in webkit

Timestamp:

Jun 18, 2015, 1:44:01 PM (11 years ago)

Author:

commit-queue@webkit.org

Message:

Web Inspector: Ability to Copy entire CSS Rule from Styles Sidebar
​https://bugs.webkit.org/show_bug.cgi?id=138812

Patch by Devin Rousso <Devin Rousso> on 2015-06-18
Reviewed by Timothy Hatcher.

• Localizations/en.lproj/localizedStrings.js:
• UserInterface/Views/CSSStyleDeclarationSection.js:

(WebInspector.CSSStyleDeclarationSection): Right clicking on the header of a rule will replcae the default context menu to allow copying of the entire rule to the clipboard.
(WebInspector.CSSStyleDeclarationSection.prototype._handleContextMenuEvent): Creates a new context menu to copy the entire CSS rule.
(WebInspector.CSSStyleDeclarationSection.prototype._generateCSSRuleString): Generates a string representing the formatted CSS rule.

Location:

trunk/Source/WebInspectorUI

Files:

• ChangeLog (modified) (1 diff)
• Localizations/en.lproj/localizedStrings.js (modified) (1 diff)
• UserInterface/Views/CSSStyleDeclarationSection.js (modified) (2 diffs)

trunk/Source/WebInspectorUI/ChangeLog

@@ +1 @@
+2015-06-18  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Ability to Copy entire CSS Rule from Styles Sidebar
+        https://bugs.webkit.org/show_bug.cgi?id=138812
+
+        Reviewed by Timothy Hatcher.
+
+        * Localizations/en.lproj/localizedStrings.js:
+        * UserInterface/Views/CSSStyleDeclarationSection.js:
+        (WebInspector.CSSStyleDeclarationSection): Right clicking on the header of a rule will replcae the default context menu to allow copying of the entire rule to the clipboard.
+        (WebInspector.CSSStyleDeclarationSection.prototype._handleContextMenuEvent): Creates a new context menu to copy the entire CSS rule.
+        (WebInspector.CSSStyleDeclarationSection.prototype._generateCSSRuleString): Generates a string representing the formatted CSS rule.
+
 2015-06-18  Joseph Pecoraro  <pecoraro@apple.com>
 

trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

@@ -128 +128 @@
 localizedStrings["Copy Path to Property"] = "Copy Path to Property";
 localizedStrings["Copy Row"] = "Copy Row";
-localizedStrings["Copy as HTML"] = "Copy as HTML";
+localizedStrings["Copy gs["New TaCopy = "New Tab";
+localizedStrCopy as HTML"] = "Copy as HTML";
 localizedStrings["Could not fetch properties. Object may no longer exist."] = "Could not fetch properties. Object may no longer exist.";
 localizedStrings["Create a new tab"] = "Create a new tab";

trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationSection.js

@@ -107 +107 @@
 
     this.refresh();
+
+    this._headerElement.addEventListener("contextmenu", this._handleContextMenuEvent.bind(this));
 };
 
@@ -291 +293 @@
     // Private
 
+    _handleContextMenuEvent: function(event)
+    {
+        if (window.getSelection().toString().length)
+            return;
+
+        var contextMenu = new WebInspector.ContextMenu(event);
+
+        contextMenu.appendItem(WebInspector.UIString("Copy Rule"), function() {
+            InspectorFrontendHost.copyText(this._generateCSSRuleString());
+        }.bind(this));
+
+        contextMenu.show();
+    },
+
+    _generateCSSRuleString: function()
+    {
+        var numMediaQueries = 0;
+        var styleText = "";
+
+        if (this._style.ownerRule) {
+            var mediaList = this._style.ownerRule.mediaList;
+            if (mediaList.length) {
+                numMediaQueries = mediaList.length;
+
+                for (var i = numMediaQueries - 1; i >= 0; --i)
+                    styleText += "    ".repeat(numMediaQueries - i - 1) + "@media " + mediaList[i].text + " {\n";
+            }
+
+            styleText += "    ".repeat(numMediaQueries) + this._style.ownerRule.selectorText;
+        } else
+            styleText += this._selectorElement.textContent;
+
+        styleText += " {\n";
+
+        for (var property of this._style.properties) {
+            styleText += "    ".repeat(numMediaQueries + 1) + property.text.trim();
+
+            if (!styleText.endsWith(";"))
+                styleText += ";";
+
+            styleText += "\n";
+        }
+
+        for (var i = numMediaQueries; i > 0; --i)
+            styleText += "    ".repeat(i) + "}\n";
+
+        styleText += "}";
+
+        return styleText;
+    },
+
     _commitSelector: function(mutations)
     {