Web Inspector: Hexadecimal color values in all CSS editors are purple when they shoul...
authorjonowells@apple.com <jonowells@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 2 Jul 2014 00:13:19 +0000 (00:13 +0000)
committerjonowells@apple.com <jonowells@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 2 Jul 2014 00:13:19 +0000 (00:13 +0000)
https://bugs.webkit.org/show_bug.cgi?id=133997

Reviewed by Joseph Pecoraro.

CodeMirror 4 removed the style for hex colors from the CSS tokenizer.
Feature has been added to CodeMirrorAdditions.js.

* UserInterface/Views/CodeMirrorAdditions.js: Added hex-color to style for a valid hexadecimal color.
* UserInterface/Views/SyntaxHighlightingDefaultTheme.css: Added selector for hexadecimal color.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@170681 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/CodeMirrorAdditions.js
Source/WebInspectorUI/UserInterface/Views/SyntaxHighlightingDefaultTheme.css

index 776980f..69549e7 100644 (file)
@@ -1,3 +1,16 @@
+2014-07-01  Jonathan Wells  <jonowells@apple.com>
+
+        Web Inspector: Hexadecimal color values in all CSS editors are purple when they should be blue
+        https://bugs.webkit.org/show_bug.cgi?id=133997
+
+        Reviewed by Joseph Pecoraro.
+
+        CodeMirror 4 removed the style for hex colors from the CSS tokenizer.
+        Feature has been added to CodeMirrorAdditions.js.
+
+        * UserInterface/Views/CodeMirrorAdditions.js: Added hex-color to style for a valid hexadecimal color.
+        * UserInterface/Views/SyntaxHighlightingDefaultTheme.css: Added selector for hexadecimal color.
+
 2014-06-26  Jono Wells  <jonowells@apple.com>
 
         Web Inspector: Command-/ (slash) now auto-comments code via CodeMirror 4. Should remove as command to pause
index 71670e3..955ce1c 100644 (file)
 
     function extendedCSSToken(stream, state)
     {
+        const hexColorRegex = /#(?:[0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b/g;
+
         if (state._urlTokenize) {
             // Call the link tokenizer instead.
             var style = state._urlTokenize(stream, state);
         var style = this._token(stream, state);
 
         if (style) {
-            if (style === "atom" && stream.current() === "url") {
-                // If the current text is "url" then we should expect the next string token to be a link.
-                state._expectLink = true;
-            } else if (state._expectLink && style === "atom") {
-                // We expected a string and got it. This is a link. Parse it the way we want it.
-                delete state._expectLink;
-
-                // This is a link, so setup the state to process it next.
-                state._urlTokenize = tokenizeCSSURLString;
-                state._urlBaseStyle = style;
-
-                // The url may or may not be quoted.
-                var quote = stream.current()[0];
-                state._urlQuoteCharacter = quote === "'" || quote === "\"" ? quote : ")";
-                state._unquotedURLString = state._urlQuoteCharacter === ")";
-
-                // Rewind the steam to the start of this token.
-                stream.pos = startPosition;
-
-                // Eat the open quote of the string so the string style
-                // will be used for the quote character.
-                if (!state._unquotedURLString)
-                    stream.eat(state._urlQuoteCharacter);
+            if (style === "atom") {
+                if (stream.current() === "url") {
+                    // If the current text is "url" then we should expect the next string token to be a link.
+                    state._expectLink = true;
+                } else if (state._expectLink) {
+                    // We expected a string and got it. This is a link. Parse it the way we want it.
+                    delete state._expectLink;
+
+                    // This is a link, so setup the state to process it next.
+                    state._urlTokenize = tokenizeCSSURLString;
+                    state._urlBaseStyle = style;
+
+                    // The url may or may not be quoted.
+                    var quote = stream.current()[0];
+                    state._urlQuoteCharacter = quote === "'" || quote === "\"" ? quote : ")";
+                    state._unquotedURLString = state._urlQuoteCharacter === ")";
+
+                    // Rewind the steam to the start of this token.
+                    stream.pos = startPosition;
+
+                    // Eat the open quote of the string so the string style
+                    // will be used for the quote character.
+                    if (!state._unquotedURLString)
+                        stream.eat(state._urlQuoteCharacter);
+                } else if (hexColorRegex.test(stream.current()))
+                    style = style + " hex-color";
             } else if (state._expectLink) {
                 // We expected a string and didn't get one. Cleanup.
                 delete state._expectLink;
index 0420abb..e7c5f91 100644 (file)
@@ -60,6 +60,7 @@
 }
 
 .cm-s-default .cm-number,
+.cm-s-default .cm-atom.cm-hex-color,
 .syntax-highlighted .css-number,
 .syntax-highlighted .javascript-number {
     color: rgb(28, 0, 207);