| // Copyright 2014 The Closure Library Authors. All Rights Reserved. |
| // |
| // Licensed under the Apache License, Version 2.0 (the "License"); |
| // you may not use this file except in compliance with the License. |
| // You may obtain a copy of the License at |
| // |
| // http://www.apache.org/licenses/LICENSE-2.0 |
| // |
| // Unless required by applicable law or agreed to in writing, software |
| // distributed under the License is distributed on an "AS-IS" BASIS, |
| // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| // See the License for the specific language governing permissions and |
| // limitations under the License. |
| |
| /** |
| * @fileoverview The SafeStyleSheet type and its builders. |
| * |
| * TODO(xtof): Link to document stating type contract. |
| */ |
| |
| goog.provide('goog.html.SafeStyleSheet'); |
| |
| goog.require('goog.array'); |
| goog.require('goog.asserts'); |
| goog.require('goog.html.SafeStyle'); |
| goog.require('goog.object'); |
| goog.require('goog.string'); |
| goog.require('goog.string.Const'); |
| goog.require('goog.string.TypedString'); |
| |
| |
| |
| /** |
| * A string-like object which represents a CSS style sheet and that carries the |
| * security type contract that its value, as a string, will not cause untrusted |
| * script execution (XSS) when evaluated as CSS in a browser. |
| * |
| * Instances of this type must be created via the factory method |
| * {@code goog.html.SafeStyleSheet.fromConstant} and not by invoking its |
| * constructor. The constructor intentionally takes no parameters and the type |
| * is immutable; hence only a default instance corresponding to the empty string |
| * can be obtained via constructor invocation. |
| * |
| * A SafeStyleSheet's string representation can safely be interpolated as the |
| * content of a style element within HTML. The SafeStyleSheet string should |
| * not be escaped before interpolation. |
| * |
| * Values of this type must be composable, i.e. for any two values |
| * {@code styleSheet1} and {@code styleSheet2} of this type, |
| * {@code goog.html.SafeStyleSheet.unwrap(styleSheet1) + |
| * goog.html.SafeStyleSheet.unwrap(styleSheet2)} must itself be a value that |
| * satisfies the SafeStyleSheet type constraint. This requirement implies that |
| * for any value {@code styleSheet} of this type, |
| * {@code goog.html.SafeStyleSheet.unwrap(styleSheet1)} must end in |
| * "beginning of rule" context. |
| |
| * A SafeStyleSheet can be constructed via security-reviewed unchecked |
| * conversions. In this case producers of SafeStyleSheet must ensure themselves |
| * that the SafeStyleSheet does not contain unsafe script. Note in particular |
| * that {@code <} is dangerous, even when inside CSS strings, and so should |
| * always be forbidden or CSS-escaped in user controlled input. For example, if |
| * {@code </style><script>evil</script>"} were interpolated |
| * inside a CSS string, it would break out of the context of the original |
| * style element and {@code evil} would execute. Also note that within an HTML |
| * style (raw text) element, HTML character references, such as |
| * {@code &lt;}, are not allowed. See |
| * |
| http://www.w3.org/TR/html5/scripting-1.html#restrictions-for-contents-of-script-elements |
| * (similar considerations apply to the style element). |
| * |
| * @see goog.html.SafeStyleSheet#fromConstant |
| * @constructor |
| * @final |
| * @struct |
| * @implements {goog.string.TypedString} |
| */ |
| goog.html.SafeStyleSheet = function() { |
| /** |
| * The contained value of this SafeStyleSheet. The field has a purposely |
| * ugly name to make (non-compiled) code that attempts to directly access this |
| * field stand out. |
| * @private {string} |
| */ |
| this.privateDoNotAccessOrElseSafeStyleSheetWrappedValue_ = ''; |
| |
| /** |
| * A type marker used to implement additional run-time type checking. |
| * @see goog.html.SafeStyleSheet#unwrap |
| * @const {!Object} |
| * @private |
| */ |
| this.SAFE_STYLE_SHEET_TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_ = |
| goog.html.SafeStyleSheet.TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_; |
| }; |
| |
| |
| /** |
| * @override |
| * @const |
| */ |
| goog.html.SafeStyleSheet.prototype.implementsGoogStringTypedString = true; |
| |
| |
| /** |
| * Type marker for the SafeStyleSheet type, used to implement additional |
| * run-time type checking. |
| * @const {!Object} |
| * @private |
| */ |
| goog.html.SafeStyleSheet.TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_ = {}; |
| |
| |
| /** |
| * Creates a style sheet consisting of one selector and one style definition. |
| * Use {@link goog.html.SafeStyleSheet.concat} to create longer style sheets. |
| * This function doesn't support @import, @media and similar constructs. |
| * @param {string} selector CSS selector, e.g. '#id' or 'tag .class, #id'. We |
| * support CSS3 selectors: https://w3.org/TR/css3-selectors/#selectors. |
| * @param {!goog.html.SafeStyle.PropertyMap|!goog.html.SafeStyle} style Style |
| * definition associated with the selector. |
| * @return {!goog.html.SafeStyleSheet} |
| * @throws {Error} If invalid selector is provided. |
| */ |
| goog.html.SafeStyleSheet.createRule = function(selector, style) { |
| if (goog.string.contains(selector, '<')) { |
| throw Error('Selector does not allow \'<\', got: ' + selector); |
| } |
| |
| // Remove strings. |
| var selectorToCheck = |
| selector.replace(/('|")((?!\1)[^\r\n\f\\]|\\[\s\S])*\1/g, ''); |
| |
| // Check characters allowed in CSS3 selectors. |
| if (!/^[-_a-zA-Z0-9#.:* ,>+~[\]()=^$|]+$/.test(selectorToCheck)) { |
| throw Error( |
| 'Selector allows only [-_a-zA-Z0-9#.:* ,>+~[\\]()=^$|] and ' + |
| 'strings, got: ' + selector); |
| } |
| |
| // Check balanced () and []. |
| if (!goog.html.SafeStyleSheet.hasBalancedBrackets_(selectorToCheck)) { |
| throw Error('() and [] in selector must be balanced, got: ' + selector); |
| } |
| |
| if (!(style instanceof goog.html.SafeStyle)) { |
| style = goog.html.SafeStyle.create(style); |
| } |
| var styleSheet = selector + '{' + goog.html.SafeStyle.unwrap(style) + '}'; |
| return goog.html.SafeStyleSheet |
| .createSafeStyleSheetSecurityPrivateDoNotAccessOrElse(styleSheet); |
| }; |
| |
| |
| /** |
| * Checks if a string has balanced () and [] brackets. |
| * @param {string} s String to check. |
| * @return {boolean} |
| * @private |
| */ |
| goog.html.SafeStyleSheet.hasBalancedBrackets_ = function(s) { |
| var brackets = {'(': ')', '[': ']'}; |
| var expectedBrackets = []; |
| for (var i = 0; i < s.length; i++) { |
| var ch = s[i]; |
| if (brackets[ch]) { |
| expectedBrackets.push(brackets[ch]); |
| } else if (goog.object.contains(brackets, ch)) { |
| if (expectedBrackets.pop() != ch) { |
| return false; |
| } |
| } |
| } |
| return expectedBrackets.length == 0; |
| }; |
| |
| |
| /** |
| * Creates a new SafeStyleSheet object by concatenating values. |
| * @param {...(!goog.html.SafeStyleSheet|!Array<!goog.html.SafeStyleSheet>)} |
| * var_args Values to concatenate. |
| * @return {!goog.html.SafeStyleSheet} |
| */ |
| goog.html.SafeStyleSheet.concat = function(var_args) { |
| var result = ''; |
| |
| /** |
| * @param {!goog.html.SafeStyleSheet|!Array<!goog.html.SafeStyleSheet>} |
| * argument |
| */ |
| var addArgument = function(argument) { |
| if (goog.isArray(argument)) { |
| goog.array.forEach(argument, addArgument); |
| } else { |
| result += goog.html.SafeStyleSheet.unwrap(argument); |
| } |
| }; |
| |
| goog.array.forEach(arguments, addArgument); |
| return goog.html.SafeStyleSheet |
| .createSafeStyleSheetSecurityPrivateDoNotAccessOrElse(result); |
| }; |
| |
| |
| /** |
| * Creates a SafeStyleSheet object from a compile-time constant string. |
| * |
| * {@code styleSheet} must not have any < characters in it, so that |
| * the syntactic structure of the surrounding HTML is not affected. |
| * |
| * @param {!goog.string.Const} styleSheet A compile-time-constant string from |
| * which to create a SafeStyleSheet. |
| * @return {!goog.html.SafeStyleSheet} A SafeStyleSheet object initialized to |
| * {@code styleSheet}. |
| */ |
| goog.html.SafeStyleSheet.fromConstant = function(styleSheet) { |
| var styleSheetString = goog.string.Const.unwrap(styleSheet); |
| if (styleSheetString.length === 0) { |
| return goog.html.SafeStyleSheet.EMPTY; |
| } |
| // > is a valid character in CSS selectors and there's no strict need to |
| // block it if we already block <. |
| goog.asserts.assert( |
| !goog.string.contains(styleSheetString, '<'), |
| "Forbidden '<' character in style sheet string: " + styleSheetString); |
| return goog.html.SafeStyleSheet |
| .createSafeStyleSheetSecurityPrivateDoNotAccessOrElse(styleSheetString); |
| }; |
| |
| |
| /** |
| * Returns this SafeStyleSheet's value as a string. |
| * |
| * IMPORTANT: In code where it is security relevant that an object's type is |
| * indeed {@code SafeStyleSheet}, use {@code goog.html.SafeStyleSheet.unwrap} |
| * instead of this method. If in doubt, assume that it's security relevant. In |
| * particular, note that goog.html functions which return a goog.html type do |
| * not guarantee the returned instance is of the right type. For example: |
| * |
| * <pre> |
| * var fakeSafeHtml = new String('fake'); |
| * fakeSafeHtml.__proto__ = goog.html.SafeHtml.prototype; |
| * var newSafeHtml = goog.html.SafeHtml.htmlEscape(fakeSafeHtml); |
| * // newSafeHtml is just an alias for fakeSafeHtml, it's passed through by |
| * // goog.html.SafeHtml.htmlEscape() as fakeSafeHtml |
| * // instanceof goog.html.SafeHtml. |
| * </pre> |
| * |
| * @see goog.html.SafeStyleSheet#unwrap |
| * @override |
| */ |
| goog.html.SafeStyleSheet.prototype.getTypedStringValue = function() { |
| return this.privateDoNotAccessOrElseSafeStyleSheetWrappedValue_; |
| }; |
| |
| |
| if (goog.DEBUG) { |
| /** |
| * Returns a debug string-representation of this value. |
| * |
| * To obtain the actual string value wrapped in a SafeStyleSheet, use |
| * {@code goog.html.SafeStyleSheet.unwrap}. |
| * |
| * @see goog.html.SafeStyleSheet#unwrap |
| * @override |
| */ |
| goog.html.SafeStyleSheet.prototype.toString = function() { |
| return 'SafeStyleSheet{' + |
| this.privateDoNotAccessOrElseSafeStyleSheetWrappedValue_ + '}'; |
| }; |
| } |
| |
| |
| /** |
| * Performs a runtime check that the provided object is indeed a |
| * SafeStyleSheet object, and returns its value. |
| * |
| * @param {!goog.html.SafeStyleSheet} safeStyleSheet The object to extract from. |
| * @return {string} The safeStyleSheet object's contained string, unless |
| * the run-time type check fails. In that case, {@code unwrap} returns an |
| * innocuous string, or, if assertions are enabled, throws |
| * {@code goog.asserts.AssertionError}. |
| */ |
| goog.html.SafeStyleSheet.unwrap = function(safeStyleSheet) { |
| // Perform additional Run-time type-checking to ensure that |
| // safeStyleSheet is indeed an instance of the expected type. This |
| // provides some additional protection against security bugs due to |
| // application code that disables type checks. |
| // Specifically, the following checks are performed: |
| // 1. The object is an instance of the expected type. |
| // 2. The object is not an instance of a subclass. |
| // 3. The object carries a type marker for the expected type. "Faking" an |
| // object requires a reference to the type marker, which has names intended |
| // to stand out in code reviews. |
| if (safeStyleSheet instanceof goog.html.SafeStyleSheet && |
| safeStyleSheet.constructor === goog.html.SafeStyleSheet && |
| safeStyleSheet |
| .SAFE_STYLE_SHEET_TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_ === |
| goog.html.SafeStyleSheet.TYPE_MARKER_GOOG_HTML_SECURITY_PRIVATE_) { |
| return safeStyleSheet.privateDoNotAccessOrElseSafeStyleSheetWrappedValue_; |
| } else { |
| goog.asserts.fail('expected object of type SafeStyleSheet, got \'' + |
| safeStyleSheet + '\' of type ' + goog.typeOf(safeStyleSheet)); |
| return 'type_error:SafeStyleSheet'; |
| } |
| }; |
| |
| |
| /** |
| * Package-internal utility method to create SafeStyleSheet instances. |
| * |
| * @param {string} styleSheet The string to initialize the SafeStyleSheet |
| * object with. |
| * @return {!goog.html.SafeStyleSheet} The initialized SafeStyleSheet object. |
| * @package |
| */ |
| goog.html.SafeStyleSheet.createSafeStyleSheetSecurityPrivateDoNotAccessOrElse = |
| function(styleSheet) { |
| return new goog.html.SafeStyleSheet().initSecurityPrivateDoNotAccessOrElse_( |
| styleSheet); |
| }; |
| |
| |
| /** |
| * Called from createSafeStyleSheetSecurityPrivateDoNotAccessOrElse(). This |
| * method exists only so that the compiler can dead code eliminate static |
| * fields (like EMPTY) when they're not accessed. |
| * @param {string} styleSheet |
| * @return {!goog.html.SafeStyleSheet} |
| * @private |
| */ |
| goog.html.SafeStyleSheet.prototype.initSecurityPrivateDoNotAccessOrElse_ = |
| function(styleSheet) { |
| this.privateDoNotAccessOrElseSafeStyleSheetWrappedValue_ = styleSheet; |
| return this; |
| }; |
| |
| |
| /** |
| * A SafeStyleSheet instance corresponding to the empty string. |
| * @const {!goog.html.SafeStyleSheet} |
| */ |
| goog.html.SafeStyleSheet.EMPTY = |
| goog.html.SafeStyleSheet |
| .createSafeStyleSheetSecurityPrivateDoNotAccessOrElse(''); |