sanitize-html 2.16.0 → 2.17.1

package/README.md

@@ -745,7 +745,7 @@ This will transform `<disallowed>content <allowed>content</allowed> </disallowed
 
 #### Escape the disallowed tag and all its children even for allowed tags.
 
-if you set `disallowedTagsMode` to `recursiveEscape`, disallowed tag and its children will be escaped even for allowed tags
+if you set `disallowedTagsMode` to `recursiveEscape`, disallowed tags and their children will be escaped even for allowed tags:
 
 ```js
 disallowedTagsMode: `recursiveEscape`
@@ -753,6 +753,15 @@ disallowedTagsMode: `recursiveEscape`
 
 This will transform `<disallowed>hello<p>world</p></disallowed>` to `&lt;disallowed&gt;hello&lt;p&gt;world&lt;/p&gt;&lt;/disallowed&gt;`
 
+#### Escape the disallowed tag, including all its attributes.
+
+By default, attributes are not preserved when tags are escaped. You can set `preserveEscapedAttributes` to `true` to 
+keep the attributes, which will also be escaped and therefore have no effect on the browser.
+
+```js
+preserveEscapedAttributes: true
+```
+
 ### Ignore style attribute contents
 
 Instead of discarding faulty style attributes, you can allow them by disabling the parsing of style attributes:

package/index.js

@@ -88,7 +88,8 @@ function sanitizeHtml(html, options, _recursing) {
   }
 
   let result = '';
-  // Used for hot swapping the result variable with an empty string in order to "capture" the text written to it.
+  // Used for hot swapping the result variable with an empty string
+  // in order to "capture" the text written to it.
   let tempResult = '';
 
   function Frame(tag, attribs) {
@@ -119,7 +120,8 @@ function sanitizeHtml(html, options, _recursing) {
   options.parser = Object.assign({}, htmlParserDefaults, options.parser);
 
   const tagAllowed = function (name) {
-    return options.allowedTags === false || (options.allowedTags || []).indexOf(name) > -1;
+    return options.allowedTags === false ||
+      (options.allowedTags || []).indexOf(name) > -1;
   };
 
   // vulnerableTags
@@ -300,7 +302,15 @@ function sanitizeHtml(html, options, _recursing) {
         }
       }
 
-      if (!allowedAttributesMap || has(allowedAttributesMap, name) || allowedAttributesMap['*']) {
+      const isBeingEscaped = skip && (options.disallowedTagsMode === 'escape' || options.disallowedTagsMode === 'recursiveEscape');
+      const shouldPreserveEscapedAttributes = isBeingEscaped &&
+        options.preserveEscapedAttributes;
+
+      if (shouldPreserveEscapedAttributes) {
+        each(attribs, function(value, a) {
+          result += ' ' + a + '="' + escapeHtml((value || ''), true) + '"';
+        });
+      } else if (!allowedAttributesMap || has(allowedAttributesMap, name) || allowedAttributesMap['*']) {
         each(attribs, function(value, a) {
           if (!VALID_HTML_ATTRIBUTE_NAME.test(a)) {
             // This prevents part of an attribute name in the output from being
@@ -308,8 +318,10 @@ function sanitizeHtml(html, options, _recursing) {
             delete frame.attribs[a];
             return;
           }
-          // If the value is empty, check if the attribute is in the allowedEmptyAttributes array.
-          // If it is not in the allowedEmptyAttributes array, and it is a known non-boolean attribute, delete it
+          // If the value is empty, check if the attribute is
+          // in the allowedEmptyAttributes array.
+          // If it is not in the allowedEmptyAttributes array,
+          // and it is a known non-boolean attribute, delete it
           // List taken from https://html.spec.whatwg.org/multipage/indices.html#attributes-3
           if (value === '' && (!options.allowedEmptyAttributes.includes(a)) &&
             (options.nonBooleanAttributes.includes(a) || options.nonBooleanAttributes.includes('*'))) {
@@ -320,9 +332,11 @@ function sanitizeHtml(html, options, _recursing) {
           // as necessary if there are specific values defined.
           let passedAllowedAttributesMapCheck = false;
           if (!allowedAttributesMap ||
-            (has(allowedAttributesMap, name) && allowedAttributesMap[name].indexOf(a) !== -1) ||
+            (has(allowedAttributesMap, name) &&
+              allowedAttributesMap[name].indexOf(a) !== -1) ||
             (allowedAttributesMap['*'] && allowedAttributesMap['*'].indexOf(a) !== -1) ||
-            (has(allowedAttributesGlobMap, name) && allowedAttributesGlobMap[name].test(a)) ||
+            (has(allowedAttributesGlobMap, name) &&
+              allowedAttributesGlobMap[name].test(a)) ||
             (allowedAttributesGlobMap['*'] && allowedAttributesGlobMap['*'].test(a))) {
             passedAllowedAttributesMapCheck = true;
           } else if (allowedAttributesMap && allowedAttributesMap[name]) {
@@ -366,12 +380,14 @@ function sanitizeHtml(html, options, _recursing) {
                 const parsed = parseUrl(value);
 
                 if (options.allowedScriptHostnames || options.allowedScriptDomains) {
-                  const allowedHostname = (options.allowedScriptHostnames || []).find(function (hostname) {
-                    return hostname === parsed.url.hostname;
-                  });
-                  const allowedDomain = (options.allowedScriptDomains || []).find(function(domain) {
-                    return parsed.url.hostname === domain || parsed.url.hostname.endsWith(`.${domain}`);
-                  });
+                  const allowedHostname = (options.allowedScriptHostnames || [])
+                    .find(function (hostname) {
+                      return hostname === parsed.url.hostname;
+                    });
+                  const allowedDomain = (options.allowedScriptDomains || [])
+                    .find(function(domain) {
+                      return parsed.url.hostname === domain || parsed.url.hostname.endsWith(`.${domain}`);
+                    });
                   allowed = allowedHostname || allowedDomain;
                 }
               } catch (e) {
@@ -395,13 +411,18 @@ function sanitizeHtml(html, options, _recursing) {
                   allowed = has(options, 'allowIframeRelativeUrls')
                     ? options.allowIframeRelativeUrls
                     : (!options.allowedIframeHostnames && !options.allowedIframeDomains);
-                } else if (options.allowedIframeHostnames || options.allowedIframeDomains) {
-                  const allowedHostname = (options.allowedIframeHostnames || []).find(function (hostname) {
-                    return hostname === parsed.url.hostname;
-                  });
-                  const allowedDomain = (options.allowedIframeDomains || []).find(function(domain) {
-                    return parsed.url.hostname === domain || parsed.url.hostname.endsWith(`.${domain}`);
-                  });
+                } else if (
+                  options.allowedIframeHostnames ||
+                  options.allowedIframeDomains
+                ) {
+                  const allowedHostname = (options.allowedIframeHostnames || [])
+                    .find(function (hostname) {
+                      return hostname === parsed.url.hostname;
+                    });
+                  const allowedDomain = (options.allowedIframeDomains || [])
+                    .find(function(domain) {
+                      return parsed.url.hostname === domain || parsed.url.hostname.endsWith(`.${domain}`);
+                    });
                   allowed = allowedHostname || allowedDomain;
                 }
               } catch (e) {
@@ -455,9 +476,17 @@ function sanitizeHtml(html, options, _recursing) {
                   return t;
                 });
               if (allowedSpecificClasses && allowedWildcardClasses) {
-                value = filterClasses(value, deepmerge(allowedSpecificClasses, allowedWildcardClasses), allowedClassesGlobs);
+                value = filterClasses(
+                  value,
+                  deepmerge(allowedSpecificClasses, allowedWildcardClasses),
+                  allowedClassesGlobs
+                );
               } else {
-                value = filterClasses(value, allowedSpecificClasses || allowedWildcardClasses, allowedClassesGlobs);
+                value = filterClasses(
+                  value,
+                  allowedSpecificClasses || allowedWildcardClasses,
+                  allowedClassesGlobs
+                );
               }
               if (!value.length) {
                 delete frame.attribs[a];
@@ -468,7 +497,10 @@ function sanitizeHtml(html, options, _recursing) {
               if (options.parseStyleAttributes) {
                 try {
                   const abstractSyntaxTree = postcssParse(name + ' {' + value + '}', { map: false });
-                  const filteredAST = filterCss(abstractSyntaxTree, options.allowedStyles);
+                  const filteredAST = filterCss(
+                    abstractSyntaxTree,
+                    options.allowedStyles
+                  );
 
                   value = stringifyStyleAttributes(filteredAST);
 
@@ -601,7 +633,8 @@ function sanitizeHtml(html, options, _recursing) {
             tempResult = '';
           }
           // remove the opening tag from the result
-          result = result.substring(0, frame.tagPosition) + result.substring(frame.tagPosition + frame.openingTagLength);
+          result = result.substring(0, frame.tagPosition) +
+            result.substring(frame.tagPosition + frame.openingTagLength);
           return;
         } else if (filterResult) {
           result = result.substring(0, frame.tagPosition);
@@ -636,6 +669,16 @@ function sanitizeHtml(html, options, _recursing) {
   parser.write(html);
   parser.end();
 
+  if (options.disallowedTagsMode === 'escape' || options.disallowedTagsMode === 'recursiveEscape') {
+    const lastParsedIndex = parser.endIndex;
+    if (lastParsedIndex != null && lastParsedIndex >= 0 && lastParsedIndex < html.length) {
+      const unparsed = html.substring(lastParsedIndex);
+      result += escapeHtml(unparsed);
+    } else if ((lastParsedIndex == null || lastParsedIndex < 0) && html.length > 0 && result === '') {
+      result = escapeHtml(html);
+    }
+  }
+
   return result;
 
   function initializeState() {
@@ -746,8 +789,10 @@ function sanitizeHtml(html, options, _recursing) {
    * Modifies the abstractSyntaxTree object.
    *
    * @param {object} abstractSyntaxTree  - Object representation of CSS attributes.
-   * @property {array[Declaration]} abstractSyntaxTree.nodes[0] - Each object cointains prop and value key, i.e { prop: 'color', value: 'red' }.
-   * @param {object} allowedStyles       - Keys are properties (i.e color), value is list of permitted regex rules (i.e /green/i).
+   * @property {array[Declaration]} abstractSyntaxTree.nodes[0] -
+   * Each object contains prop and value key, i.e { prop: 'color', value: 'red' }.
+   * @param {object} allowedStyles       - Keys are properties (i.e color),
+   * value is list of permitted regex rules (i.e /green/i).
    * @return {object}                    - The modified tree.
    */
   function filterCss(abstractSyntaxTree, allowedStyles) {
@@ -769,7 +814,8 @@ function sanitizeHtml(html, options, _recursing) {
     }
 
     if (selectedRule) {
-      abstractSyntaxTree.nodes[0].nodes = astRules.nodes.reduce(filterDeclarations(selectedRule), []);
+      abstractSyntaxTree.nodes[0].nodes = astRules.nodes
+        .reduce(filterDeclarations(selectedRule), []);
     }
 
     return abstractSyntaxTree;
@@ -780,7 +826,8 @@ function sanitizeHtml(html, options, _recursing) {
    * values in the inline style attribute format.
    *
    * @param  {AbstractSyntaxTree} filteredAST
-   * @return {string}             - Example: "color:yellow;text-align:center !important;font-family:helvetica;"
+   * @return {string}             - Example:
+   * "color:yellow;text-align:center !important;font-family:helvetica;"
    */
   function stringifyStyleAttributes(filteredAST) {
     return filteredAST.nodes[0].nodes
@@ -797,21 +844,25 @@ function sanitizeHtml(html, options, _recursing) {
     * Filters the existing attributes for the given property. Discards any attributes
     * which don't match the allowlist.
     *
-    * @param  {object} selectedRule             - Example: { color: red, font-family: helvetica }
-    * @param  {array} allowedDeclarationsList   - List of declarations which pass the allowlist.
-    * @param  {object} attributeObject          - Object representing the current css property.
-    * @property {string} attributeObject.type   - Typically 'declaration'.
-    * @property {string} attributeObject.prop   - The CSS property, i.e 'color'.
-    * @property {string} attributeObject.value  - The corresponding value to the css property, i.e 'red'.
-    * @return {function}                        - When used in Array.reduce, will return an array of Declaration objects
+    * @param  {object} selectedRule - Example: { color: red, font-family: helvetica }
+    * @param  {array} allowedDeclarationsList - List of declarations
+    * which pass the allowlist.
+    * @param  {object} attributeObject - Object representing the current css property.
+    * @property {string} attributeObject.type - Typically 'declaration'.
+    * @property {string} attributeObject.prop - The CSS property, i.e 'color'.
+    * @property {string} attributeObject.value - The corresponding value to
+    * the css property, i.e 'red'.
+    * @return {function} - When used in Array.reduce,
+    * will return an array of Declaration objects
     */
   function filterDeclarations(selectedRule) {
     return function (allowedDeclarationsList, attributeObject) {
       // If this property is allowlisted...
       if (has(selectedRule, attributeObject.prop)) {
-        const matchesRegex = selectedRule[attributeObject.prop].some(function(regularExpression) {
-          return regularExpression.test(attributeObject.value);
-        });
+        const matchesRegex = selectedRule[attributeObject.prop]
+          .some(function(regularExpression) {
+            return regularExpression.test(attributeObject.value);
+          });
 
         if (matchesRegex) {
           allowedDeclarationsList.push(attributeObject);
@@ -923,7 +974,8 @@ sanitizeHtml.defaults = {
   allowedSchemesAppliedToAttributes: [ 'href', 'src', 'cite' ],
   allowProtocolRelative: true,
   enforceHtmlBoundary: false,
-  parseStyleAttributes: true
+  parseStyleAttributes: true,
+  preserveEscapedAttributes: false
 };
 
 sanitizeHtml.simpleTransform = function(newTagName, newAttribs, merge) {
@@ -942,7 +994,7 @@ sanitizeHtml.simpleTransform = function(newTagName, newAttribs, merge) {
 
     return {
       tagName: newTagName,
-      attribs: attribs
+      attribs
     };
   };
 };

package/package.json

@@ -1,19 +1,18 @@
 {
   "name": "sanitize-html",
-  "version": "2.16.0",
+  "version": "2.17.1",
   "description": "Clean up user-submitted HTML, preserving allowlisted elements and allowlisted attributes on a per-element basis",
   "sideEffects": false,
   "main": "index.js",
   "files": [
     "index.js"
   ],
-  "scripts": {
-    "test": "npx eslint . && mocha test/test.js"
-  },
   "repository": {
     "type": "git",
-    "url": "https://github.com/apostrophecms/sanitize-html.git"
+    "url": "https://github.com/apostrophecms/apostrophe.git",
+    "directory": "packages/sanitize-html"
   },
+  "homepage": "https://github.com/apostrophecms/apostrophe/tree/main/packages/sanitize-html#readme",
   "keywords": [
     "html",
     "parser",
@@ -31,14 +30,16 @@
     "postcss": "^8.3.11"
   },
   "devDependencies": {
-    "eslint": "^7.3.1",
-    "eslint-config-apostrophe": "^3.4.0",
-    "eslint-config-standard": "^14.1.1",
-    "eslint-plugin-import": "^2.25.2",
-    "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-promise": "^4.2.1",
-    "eslint-plugin-standard": "^4.0.1",
+    "eslint": "^9.39.1",
     "mocha": "^10.2.0",
-    "sinon": "^9.0.2"
+    "sinon": "^9.0.2",
+    "eslint-config-apostrophe": "^6.0.2"
+  },
+  "apostropheTestConfig": {
+    "requiresMongo": false
+  },
+  "scripts": {
+    "test": "npm run lint && mocha",
+    "lint": "eslint ."
   }
 }