sanitize-html 2.8.0 → 2.9.0

package/README.md

@@ -139,7 +139,8 @@ allowedSchemes: [ 'http', 'https', 'ftp', 'mailto', 'tel' ],
 allowedSchemesByTag: {},
 allowedSchemesAppliedToAttributes: [ 'href', 'src', 'cite' ],
 allowProtocolRelative: true,
-enforceHtmlBoundary: false
+enforceHtmlBoundary: false,
+parseStyleAttributes: true
 ```
 
 ### Common use cases
@@ -624,6 +625,24 @@ This will transform `<disallowed>content</disallowed>` to `&lt;disallowed&gt;con
 
 Valid values are: `'discard'` (default), `'escape'` (escape the tag) and `'recursiveEscape'` (to escape the tag and all its content).
 
+### Ignore style attribute contents
+
+Instead of discarding faulty style attributes, you can allow them by disabling the parsing of style attributes:
+
+```js
+parseStyleAttributes: false
+```
+
+This will transform `<div style="invalid-prop: non-existing-value">content</div>` to `<div style="invalid-prop: non-existing-value">content</div>` instead of stripping it: `<div>content</div>`
+
+By default the parseStyleAttributes option is true.
+
+When you disable parsing of the style attribute (`parseStyleAttributes: false`) and you pass in options for the allowedStyles property, an error will be thrown. This combination is not permitted.
+
+we recommend sanitizing content server-side in a Node.js environment, as you cannot trust a browser to sanitize things anyway. Consider what a malicious user could do via the network panel, 
+the browser console, or just by writing scripts that submit content similar to what your JavaScript submits. But if you really need to run it on the client in the browser, 
+you may find you need to disable parseStyleAttributes. This is subject to change as it is [an upstream issue with postcss](https://github.com/postcss/postcss/issues/1727), not sanitize-html itself.
+
 ### Restricting deep nesting
 
 You can limit the depth of HTML tags in the document with the `nestingLimit` option:

package/index.js

@@ -83,6 +83,9 @@ function sanitizeHtml(html, options, _recursing) {
   if (html == null) {
     return '';
   }
+  if (typeof html === 'number') {
+    html = html.toString();
+  }
 
   let result = '';
   // Used for hot swapping the result variable with an empty string in order to "capture" the text written to it.
@@ -435,19 +438,24 @@ function sanitizeHtml(html, options, _recursing) {
               }
             }
             if (a === 'style') {
-              try {
-                const abstractSyntaxTree = postcssParse(name + ' {' + value + '}');
-                const filteredAST = filterCss(abstractSyntaxTree, options.allowedStyles);
+              if (options.parseStyleAttributes) {
+                try {
+                  const abstractSyntaxTree = postcssParse(name + ' {' + value + '}');
+                  const filteredAST = filterCss(abstractSyntaxTree, options.allowedStyles);
 
-                value = stringifyStyleAttributes(filteredAST);
+                  value = stringifyStyleAttributes(filteredAST);
 
-                if (value.length === 0) {
+                  if (value.length === 0) {
+                    delete frame.attribs[a];
+                    return;
+                  }
+                } catch (e) {
+                  console.warn('Failed to parse "' + name + ' {' + value + '}' + '", If you\'re running this in a browser, we recommend to disable style parsing: options.parseStyleAttributes: false, since this only works in a node environment due to a postcss dependency, More info: https://github.com/apostrophecms/sanitize-html/issues/547');
                   delete frame.attribs[a];
                   return;
                 }
-              } catch (e) {
-                delete frame.attribs[a];
-                return;
+              } else if (options.allowedStyles) {
+                throw new Error('allowedStyles option cannot be used together with parseStyleAttributes: false.');
               }
             }
             result += ' ' + a;
@@ -815,7 +823,8 @@ sanitizeHtml.defaults = {
   allowedSchemesByTag: {},
   allowedSchemesAppliedToAttributes: [ 'href', 'src', 'cite' ],
   allowProtocolRelative: true,
-  enforceHtmlBoundary: false
+  enforceHtmlBoundary: false,
+  parseStyleAttributes: true
 };
 
 sanitizeHtml.simpleTransform = function(newTagName, newAttribs, merge) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sanitize-html",
-  "version": "2.8.0",
+  "version": "2.9.0",
   "description": "Clean up user-submitted HTML, preserving allowlisted elements and allowlisted attributes on a per-element basis",
   "sideEffects": false,
   "main": "index.js",