- Revision
- 131448
- Author
- [email protected]
- Date
- 2012-10-16 06:13:01 -0700 (Tue, 16 Oct 2012)
Log Message
Web Inspector: Whitelist safe styles for 'console.log('%c...', ...)'.
https://bugs.webkit.org/show_bug.cgi?id=98945
Reviewed by Pavel Feldman.
Source/WebCore:
Support for styling console messages via '%c' landed without any
parsing of the style information provided. This means that it's fairly
simple to accidentally or maliciously break the console with cleverly
styled messages. To mitigate this risk, whitelisting a safe subset of
CSS seems appropriate.
As a first pass at a reasonable whitelist, this patch allows
'background[-*]', 'border[-*]', 'color[-*]', 'font[-*]',
'margin[-*]', 'padding[-*]', 'text[-*]', '-webkit-background[-*]',
'-webkit-border[-*]', '-webkit-font[-*]', '-webkit-margin[-*]',
'-webkit-padding[-*]', and '-webkit-text[-*]'.
Test: inspector/console/console-format-style-whitelist.html
* inspector/front-end/ConsoleMessage.js:
(WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString.styleFormatter):
Create a buffer element onto which the user-provided styles are
applied. Whitelisted styles are transfered from the buffer onto
the actual console message.
(WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString.isWhitelistedProperty):
Returns true if the specific style is whitelisted. Expects styles
in the hyphenated form (that is, '-webkit-padding-start' rather than
CSSOM's 'webkitPaddingStart').
LayoutTests:
* http/tests/inspector/console-test.js:
(initialize_ConsoleTest.InspectorTest.dumpConsoleMessagesWithStyles):
Use the 'cssText' property of an element, rather than reading from
its 'style' attribute. Also, gracefully handle unstyled elements
by explicitly noting their emptyness.
* inspector/console/console-format-style-whitelist-expected.txt: Added.
* inspector/console/console-format-style-whitelist.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (131447 => 131448)
--- trunk/LayoutTests/ChangeLog 2012-10-16 13:09:55 UTC (rev 131447)
+++ trunk/LayoutTests/ChangeLog 2012-10-16 13:13:01 UTC (rev 131448)
@@ -1,3 +1,18 @@
+2012-10-16 Mike West <[email protected]>
+
+ Web Inspector: Whitelist safe styles for 'console.log('%c...', ...)'.
+ https://bugs.webkit.org/show_bug.cgi?id=98945
+
+ Reviewed by Pavel Feldman.
+
+ * http/tests/inspector/console-test.js:
+ (initialize_ConsoleTest.InspectorTest.dumpConsoleMessagesWithStyles):
+ Use the 'cssText' property of an element, rather than reading from
+ its 'style' attribute. Also, gracefully handle unstyled elements
+ by explicitly noting their emptyness.
+ * inspector/console/console-format-style-whitelist-expected.txt: Added.
+ * inspector/console/console-format-style-whitelist.html: Added.
+
2012-10-16 Keishi Hattori <[email protected]>
[Chromium] Rebaseline calendar-picker-key-operations.html due to r162114
Modified: trunk/LayoutTests/http/tests/inspector/console-test.js (131447 => 131448)
--- trunk/LayoutTests/http/tests/inspector/console-test.js 2012-10-16 13:09:55 UTC (rev 131447)
+++ trunk/LayoutTests/http/tests/inspector/console-test.js 2012-10-16 13:13:01 UTC (rev 131448)
@@ -28,7 +28,8 @@
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"));
+ var cssText = element.querySelector(".console-message-text span").style.cssText || "NO STYLES DEFINED.";
+ InspectorTest.addResult("Style: " + cssText);
}
}
Added: trunk/LayoutTests/inspector/console/console-format-style-whitelist-expected.txt (0 => 131448)
--- trunk/LayoutTests/inspector/console/console-format-style-whitelist-expected.txt (rev 0)
+++ trunk/LayoutTests/inspector/console/console-format-style-whitelist-expected.txt 2012-10-16 13:13:01 UTC (rev 131448)
@@ -0,0 +1,21 @@
+CONSOLE MESSAGE: line 8: %cColors are awesome.
+CONSOLE MESSAGE: line 9: %cSo are fonts!
+CONSOLE MESSAGE: line 10: %cAnd borders and margins and paddings!
+CONSOLE MESSAGE: line 11: %ctext-* is fine by us!
+CONSOLE MESSAGE: line 13: %cDisplay, on the other hand, is bad news.
+CONSOLE MESSAGE: line 14: %cAnd position too.
+Tests that console logging dumps properly styled messages, and that the whole message gets the same style, regardless of multiple %c settings.
+
+Colors are awesome. console-format-style-whitelist.html:8
+Style: color: blue;
+So are fonts! console-format-style-whitelist.html:9
+Style: font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: normal; font-family: Helvetica;
+And borders and margins and paddings! console-format-style-whitelist.html:10
+Style: border: 1px solid red; margin: 20px; padding: 10px;
+text-* is fine by us! console-format-style-whitelist.html:11
+Style: text-decoration: initial;
+Display, on the other hand, is bad news. console-format-style-whitelist.html:13
+Style: NO STYLES DEFINED.
+And position too. console-format-style-whitelist.html:14
+Style: NO STYLES DEFINED.
+
Added: trunk/LayoutTests/inspector/console/console-format-style-whitelist.html (0 => 131448)
--- trunk/LayoutTests/inspector/console/console-format-style-whitelist.html (rev 0)
+++ trunk/LayoutTests/inspector/console/console-format-style-whitelist.html 2012-10-16 13:13:01 UTC (rev 131448)
@@ -0,0 +1,32 @@
+<html>
+<head>
+<script src=""
+<script src=""
+<script>
+function onload()
+{
+ console.log('%cColors are awesome.', 'color: blue;');
+ console.log('%cSo are fonts!', 'font: 1em Helvetica;');
+ console.log('%cAnd borders and margins and paddings!', 'border: 1px solid red; margin: 20px; padding: 10px;');
+ console.log('%ctext-* is fine by us!', 'text-decoration: none;');
+
+ console.log('%cDisplay, on the other hand, is bad news.', 'display: none;');
+ console.log('%cAnd position too.', 'position: absolute;');
+ 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 (131447 => 131448)
--- trunk/Source/WebCore/ChangeLog 2012-10-16 13:09:55 UTC (rev 131447)
+++ trunk/Source/WebCore/ChangeLog 2012-10-16 13:13:01 UTC (rev 131448)
@@ -1,3 +1,34 @@
+2012-10-16 Mike West <[email protected]>
+
+ Web Inspector: Whitelist safe styles for 'console.log('%c...', ...)'.
+ https://bugs.webkit.org/show_bug.cgi?id=98945
+
+ Reviewed by Pavel Feldman.
+
+ Support for styling console messages via '%c' landed without any
+ parsing of the style information provided. This means that it's fairly
+ simple to accidentally or maliciously break the console with cleverly
+ styled messages. To mitigate this risk, whitelisting a safe subset of
+ CSS seems appropriate.
+
+ As a first pass at a reasonable whitelist, this patch allows
+ 'background[-*]', 'border[-*]', 'color[-*]', 'font[-*]',
+ 'margin[-*]', 'padding[-*]', 'text[-*]', '-webkit-background[-*]',
+ '-webkit-border[-*]', '-webkit-font[-*]', '-webkit-margin[-*]',
+ '-webkit-padding[-*]', and '-webkit-text[-*]'.
+
+ Test: inspector/console/console-format-style-whitelist.html
+
+ * inspector/front-end/ConsoleMessage.js:
+ (WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString.styleFormatter):
+ Create a buffer element onto which the user-provided styles are
+ applied. Whitelisted styles are transfered from the buffer onto
+ the actual console message.
+ (WebInspector.ConsoleMessageImpl.prototype._formatWithSubstitutionString.isWhitelistedProperty):
+ Returns true if the specific style is whitelisted. Expects styles
+ in the hyphenated form (that is, '-webkit-padding-start' rather than
+ CSSOM's 'webkitPaddingStart').
+
2012-10-16 Luke Macpherson <[email protected]>
Handle CSSPropertyOpacity in StyleBuilder.
Modified: trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js (131447 => 131448)
--- trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js 2012-10-16 13:09:55 UTC (rev 131447)
+++ trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js 2012-10-16 13:13:01 UTC (rev 131448)
@@ -449,9 +449,25 @@
function styleFormatter(obj)
{
- formattedResult.setAttribute("style", obj.description);
+ var buffer = document.createElement("span");
+ buffer.setAttribute("style", obj.description);
+ for (var i = 0; i < buffer.style.length; i++) {
+ var property = buffer.style[i];
+ if (isWhitelistedProperty(property))
+ formattedResult.style[property] = buffer.style[property];
+ }
}
+ function isWhitelistedProperty(property)
+ {
+ var prefixes = ["background", "border", "color", "font", "line", "margin", "padding", "text", "-webkit-background", "-webkit-border", "-webkit-font", "-webkit-margin", "-webkit-padding", "-webkit-text"];
+ for (var i = 0; i < prefixes.length; i++) {
+ if (property.startsWith(prefixes[i]))
+ return true;
+ }
+ return false;
+ }
+
// Firebug uses %o for formatting objects.
formatters.o = parameterFormatter.bind(this, false);
formatters.s = valueFormatter;
