Title: [130941] trunk
- Revision
- 130941
- Author
- mk...@chromium.org
- Date
- 2012-10-10 12:23:15 -0700 (Wed, 10 Oct 2012)
Log Message
Web Inspector: add support for %c (style) in console API
https://bugs.webkit.org/show_bug.cgi?id=69401
Reviewed by Pavel Feldman.
Source/WebCore:
This patch mimics Firebug's '%c' option when calling 'console.log'
messages. 'console.log("%cBlue!", "color: blue;");' will write blue
text to the console, and so on.
To match Firebug's behavior, multiple '%c' entries will overwrite each
other: only one style will be applied. Sorry, folks.
Test: inspector/console/console-format-style.html
* inspector/front-end/ConsoleMessage.js:
(WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString.styleFormatter):
(WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString.append):
(WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString):
LayoutTests:
* http/tests/inspector/console-test.js:
(initialize_ConsoleTest.InspectorTest.dumpConsoleMessagesWithStyles):
Helper to dump the style associated with a console message.
* inspector/console/console-format-style-expected.txt: Added.
* inspector/console/console-format-style.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (130940 => 130941)
--- trunk/LayoutTests/ChangeLog 2012-10-10 19:15:22 UTC (rev 130940)
+++ trunk/LayoutTests/ChangeLog 2012-10-10 19:23:15 UTC (rev 130941)
@@ -1,3 +1,16 @@
+2012-10-10 Mike West <mk...@chromium.org>
+
+ Web Inspector: add support for %c (style) in console API
+ https://bugs.webkit.org/show_bug.cgi?id=69401
+
+ Reviewed by Pavel Feldman.
+
+ * http/tests/inspector/console-test.js:
+ (initialize_ConsoleTest.InspectorTest.dumpConsoleMessagesWithStyles):
+ Helper to dump the style associated with a console message.
+ * inspector/console/console-format-style-expected.txt: Added.
+ * inspector/console/console-format-style.html: Added.
+
2012-10-10 Varun Jain <varunj...@chromium.org>
[chromium] Spelling and grammar markers are pixelated in hidpi.
Modified: trunk/LayoutTests/http/tests/inspector/console-test.js (130940 => 130941)
--- trunk/LayoutTests/http/tests/inspector/console-test.js 2012-10-10 19:15:22 UTC (rev 130940)
+++ trunk/LayoutTests/http/tests/inspector/console-test.js 2012-10-10 19:23:15 UTC (rev 130941)
@@ -21,6 +21,17 @@
return result;
}
+InspectorTest.dumpConsoleMessagesWithStyles = function(sortMessages)
+{
+ var result = [];
+ var messages = WebInspector.consoleView.messages;
+ for (var i = 0; i < messages.length; ++i) {
+ var element = messages[i].toMessageElement();
+ InspectorTest.addResult(element.textContent.replace(/\u200b/g, ""));
+ InspectorTest.addResult("Style: " + element.querySelector(".console-message-text span").getAttribute("style"));
+ }
+}
+
InspectorTest.dumpConsoleMessagesWithClasses = function(sortMessages) {
var result = [];
var messages = WebInspector.consoleView.messages;
Added: trunk/LayoutTests/inspector/console/console-format-style-expected.txt (0 => 130941)
--- trunk/LayoutTests/inspector/console/console-format-style-expected.txt (rev 0)
+++ trunk/LayoutTests/inspector/console/console-format-style-expected.txt 2012-10-10 19:23:15 UTC (rev 130941)
@@ -0,0 +1,9 @@
+CONSOLE MESSAGE: line 8: %cBlue!.
+CONSOLE MESSAGE: line 9: %cRed!%c.
+Tests that console logging dumps properly styled messages, and that the whole message gets the same style, regardless of multiple %c settings.
+
+Blue!. console-format-style.html:8
+Style: color: blue;
+Red!. console-format-style.html:9
+Style: color: red;
+
Added: trunk/LayoutTests/inspector/console/console-format-style.html (0 => 130941)
--- trunk/LayoutTests/inspector/console/console-format-style.html (rev 0)
+++ trunk/LayoutTests/inspector/console/console-format-style.html 2012-10-10 19:23:15 UTC (rev 130941)
@@ -0,0 +1,27 @@
+<html>
+ <head>
+ <script src=""
+ <script src=""
+ <script>
+ function onload()
+ {
+ console.log('%cBlue!.', 'color: blue;');
+ console.log('%cRed!%c.', 'color: blue;', 'color: red;');
+ runTest();
+ }
+
+ function test()
+ {
+ InspectorTest.expandConsoleMessages();
+ InspectorTest.dumpConsoleMessagesWithStyles();
+ InspectorTest.completeTest();
+ }
+ </script>
+ </head>
+
+ <body _onload_="onload()">
+ <p>Tests that console logging dumps properly styled messages, and that
+ the whole message gets the same style, regardless of multiple %c
+ settings.</p>
+ </body>
+</html>
Modified: trunk/Source/WebCore/ChangeLog (130940 => 130941)
--- trunk/Source/WebCore/ChangeLog 2012-10-10 19:15:22 UTC (rev 130940)
+++ trunk/Source/WebCore/ChangeLog 2012-10-10 19:23:15 UTC (rev 130941)
@@ -1,3 +1,24 @@
+2012-10-10 Mike West <mk...@chromium.org>
+
+ Web Inspector: add support for %c (style) in console API
+ https://bugs.webkit.org/show_bug.cgi?id=69401
+
+ Reviewed by Pavel Feldman.
+
+ This patch mimics Firebug's '%c' option when calling 'console.log'
+ messages. 'console.log("%cBlue!", "color: blue;");' will write blue
+ text to the console, and so on.
+
+ To match Firebug's behavior, multiple '%c' entries will overwrite each
+ other: only one style will be applied. Sorry, folks.
+
+ Test: inspector/console/console-format-style.html
+
+ * inspector/front-end/ConsoleMessage.js:
+ (WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString.styleFormatter):
+ (WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString.append):
+ (WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString):
+
2012-10-10 Varun Jain <varunj...@chromium.org>
[chromium] Spelling and grammar markers are pixelated in hidpi.
Modified: trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js (130940 => 130941)
--- trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js 2012-10-10 19:15:22 UTC (rev 130940)
+++ trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js 2012-10-10 19:23:15 UTC (rev 130941)
@@ -447,6 +447,11 @@
return obj.description;
}
+ function styleFormatter(obj)
+ {
+ formattedResult.setAttribute("style", obj.description);
+ }
+
// Firebug uses %o for formatting objects.
formatters.o = parameterFormatter.bind(this, false);
formatters.s = valueFormatter;
@@ -455,15 +460,18 @@
formatters.i = valueFormatter;
formatters.d = valueFormatter;
+ // Firebug uses %c for styling the message.
+ formatters.c = styleFormatter;
+
// Support %O to force object formatting, instead of the type-based %o formatting.
formatters.O = parameterFormatter.bind(this, true);
function append(a, b)
{
- if (!(b instanceof Node))
+ if (b instanceof Node)
+ a.appendChild(b);
+ else if (b)
a.appendChild(WebInspector.linkifyStringAsFragment(b.toString()));
- else
- a.appendChild(b);
return a;
}
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
http://lists.webkit.org/mailman/listinfo/webkit-changes
