htmlnano 2.0.2 → 2.0.4

package/lib/modules/custom.js

@@ -4,17 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = custom;
-
 /** Meta-module that runs custom modules  */
 function custom(tree, options, customModules) {
   if (!customModules) {
     return tree;
   }
-
   if (!Array.isArray(customModules)) {
     customModules = [customModules];
   }
-
   customModules.forEach(customModule => {
     tree = customModule(tree, options);
   });

package/lib/modules/deduplicateAttributeValues.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.onAttrs = onAttrs;
-
 var _collapseAttributeWhitespace = require("./collapseAttributeWhitespace");
-
 /** Deduplicate values inside list-like attributes (e.g. class, rel) */
 function onAttrs() {
   return attrs => {
@@ -15,7 +13,9 @@ function onAttrs() {
       if (!_collapseAttributeWhitespace.attributesWithLists.has(attrName)) {
         return;
       }
-
+      if (typeof attrs[attrName] !== 'string') {
+        return;
+      }
       const attrValues = attrs[attrName].split(/\s/);
       const uniqeAttrValues = new Set();
       const deduplicatedAttrValues = [];
@@ -25,11 +25,9 @@ function onAttrs() {
           deduplicatedAttrValues.push('');
           return;
         }
-
         if (uniqeAttrValues.has(attrValue)) {
           return;
         }
-
         deduplicatedAttrValues.push(attrValue);
         uniqeAttrValues.add(attrValue);
       });

package/lib/modules/mergeScripts.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = mergeScripts;
-
 /* Merge multiple <script> into one */
 function mergeScripts(tree) {
   let scriptNodesIndex = {};
@@ -13,18 +12,16 @@ function mergeScripts(tree) {
     tag: 'script'
   }, node => {
     const nodeAttrs = node.attrs || {};
-
-    if (nodeAttrs.src) {
+    if ('src' in nodeAttrs
+    // Skip SRI, reasons are documented in "minifyJs" module
+    || 'integrity' in nodeAttrs) {
       scriptSrcIndex++;
       return node;
     }
-
     const scriptType = nodeAttrs.type || 'text/javascript';
-
     if (scriptType !== 'text/javascript' && scriptType !== 'application/javascript') {
       return node;
     }
-
     const scriptKey = JSON.stringify({
       id: nodeAttrs.id,
       class: nodeAttrs.class,
@@ -33,31 +30,25 @@ function mergeScripts(tree) {
       async: nodeAttrs.async !== undefined,
       index: scriptSrcIndex
     });
-
     if (!scriptNodesIndex[scriptKey]) {
       scriptNodesIndex[scriptKey] = [];
     }
-
     scriptNodesIndex[scriptKey].push(node);
     return node;
   });
-
   for (const scriptNodes of Object.values(scriptNodesIndex)) {
     let lastScriptNode = scriptNodes.pop();
     scriptNodes.reverse().forEach(scriptNode => {
       let scriptContent = (scriptNode.content || []).join(' ');
       scriptContent = scriptContent.trim();
-
       if (scriptContent.slice(-1) !== ';') {
         scriptContent += ';';
       }
-
       lastScriptNode.content = lastScriptNode.content || [];
       lastScriptNode.content.unshift(scriptContent);
       scriptNode.tag = false;
       scriptNode.content = [];
     });
   }
-
   return tree;
 }

package/lib/modules/mergeStyles.js

@@ -4,36 +4,32 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = mergeStyles;
-
 var _helpers = require("../helpers");
-
 /* Merge multiple <style> into one */
 function mergeStyles(tree) {
   const styleNodes = {};
   tree.match({
     tag: 'style'
   }, node => {
-    const nodeAttrs = node.attrs || {}; // Skip <style scoped></style>
+    const nodeAttrs = node.attrs || {};
+    // Skip <style scoped></style>
     // https://developer.mozilla.org/en/docs/Web/HTML/Element/style
-
-    if (nodeAttrs.scoped !== undefined) {
+    //
+    // Also skip SRI, reasons are documented in "minifyJs" module
+    if ('scoped' in nodeAttrs || 'integrity' in nodeAttrs) {
       return node;
     }
-
     if ((0, _helpers.isAmpBoilerplate)(node)) {
       return node;
     }
-
     const styleType = nodeAttrs.type || 'text/css';
     const styleMedia = nodeAttrs.media || 'all';
     const styleKey = styleType + '_' + styleMedia;
-
     if (styleNodes[styleKey]) {
       const styleContent = (node.content || []).join(' ');
       styleNodes[styleKey].content.push(' ' + styleContent);
       return '';
     }
-
     node.content = node.content || [];
     styleNodes[styleKey] = node;
     return node;

package/lib/modules/minifyConditionalComments.js

@@ -4,55 +4,44 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = minifyConditionalComments;
-
 var _htmlnano = _interopRequireDefault(require("../htmlnano"));
-
 var _helpers = require("../helpers");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 // Spec: https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/compatibility/ms537512(v=vs.85)
 const CONDITIONAL_COMMENT_REGEXP = /(<!--\[if\s+?[^<>[\]]+?]>)([\s\S]+?)(<!\[endif\]-->)/gm;
-/** Minify content inside conditional comments */
 
+/** Minify content inside conditional comments */
 async function minifyConditionalComments(tree, htmlnanoOptions) {
   // forEach, tree.walk, tree.match just don't support Promise.
   for (let i = 0, len = tree.length; i < len; i++) {
     const node = tree[i];
-
     if (typeof node === 'string' && (0, _helpers.isConditionalComment)(node)) {
       tree[i] = await minifycontentInsideConditionalComments(node, htmlnanoOptions);
     }
-
     if (node.content && node.content.length) {
       tree[i].content = await minifyConditionalComments(node.content, htmlnanoOptions);
     }
   }
-
   return tree;
 }
-
 async function minifycontentInsideConditionalComments(text, htmlnanoOptions) {
   let match;
-  const matches = []; // FIXME!
-  // String#matchAll is supported since Node.js 12
+  const matches = [];
 
+  // FIXME!
+  // String#matchAll is supported since Node.js 12
   while ((match = CONDITIONAL_COMMENT_REGEXP.exec(text)) !== null) {
     matches.push([match[1], match[2], match[3]]);
   }
-
   if (!matches.length) {
     return Promise.resolve(text);
   }
-
   return Promise.all(matches.map(async match => {
     const result = await _htmlnano.default.process(match[1], htmlnanoOptions, {}, {});
     let minified = result.html;
-
     if (match[1].includes('<html') && minified.includes('</html>')) {
       minified = minified.replace('</html>', '');
     }
-
     return match[0] + minified + match[2];
   }));
 }

package/lib/modules/minifyCss.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = minifyCss;
-
 var _helpers = require("../helpers");
-
 const cssnano = (0, _helpers.optionalRequire)('cssnano');
 const postcss = (0, _helpers.optionalRequire)('postcss');
 const postcssOptions = {
@@ -15,46 +13,44 @@ const postcssOptions = {
   // > Set it to CSS file path or to `undefined` to prevent this warning.
   from: undefined
 };
-/** Minify CSS with cssnano */
 
+/** Minify CSS with cssnano */
 function minifyCss(tree, options, cssnanoOptions) {
   if (!cssnano || !postcss) {
     return tree;
   }
-
   let promises = [];
   tree.walk(node => {
+    // Skip SRI, reasons are documented in "minifyJs" module
+    if (node.attrs && 'integrity' in node.attrs) {
+      return node;
+    }
     if ((0, _helpers.isStyleNode)(node)) {
       promises.push(processStyleNode(node, cssnanoOptions));
     } else if (node.attrs && node.attrs.style) {
       promises.push(processStyleAttr(node, cssnanoOptions));
     }
-
     return node;
   });
   return Promise.all(promises).then(() => tree);
 }
-
 function processStyleNode(styleNode, cssnanoOptions) {
-  let css = (0, _helpers.extractCssFromStyleNode)(styleNode); // Improve performance by avoiding calling stripCdata again and again
+  let css = (0, _helpers.extractCssFromStyleNode)(styleNode);
 
+  // Improve performance by avoiding calling stripCdata again and again
   let isCdataWrapped = false;
-
   if (css.includes('CDATA')) {
     const strippedCss = stripCdata(css);
     isCdataWrapped = css !== strippedCss;
     css = strippedCss;
   }
-
   return postcss([cssnano(cssnanoOptions)]).process(css, postcssOptions).then(result => {
     if (isCdataWrapped) {
       return styleNode.content = ['<![CDATA[' + result + ']]>'];
     }
-
     return styleNode.content = [result.css];
   });
 }
-
 function processStyleAttr(node, cssnanoOptions) {
   // CSS "color: red;" is invalid. Therefore it should be wrapped inside some selector:
   // a{color: red;}
@@ -62,19 +58,16 @@ function processStyleAttr(node, cssnanoOptions) {
   const wrapperEnd = '}';
   const wrappedStyle = wrapperStart + (node.attrs.style || '') + wrapperEnd;
   return postcss([cssnano(cssnanoOptions)]).process(wrappedStyle, postcssOptions).then(result => {
-    const minifiedCss = result.css; // Remove wrapperStart at the start and wrapperEnd at the end of minifiedCss
-
+    const minifiedCss = result.css;
+    // Remove wrapperStart at the start and wrapperEnd at the end of minifiedCss
     node.attrs.style = minifiedCss.substring(wrapperStart.length, minifiedCss.length - wrapperEnd.length);
   });
 }
-
 function stripCdata(css) {
   const leftStrippedCss = css.replace('<![CDATA[', '');
-
   if (leftStrippedCss === css) {
     return css;
   }
-
   const strippedCss = leftStrippedCss.replace(']]>', '');
   return leftStrippedCss === strippedCss ? css : strippedCss;
 }

package/lib/modules/minifyJs.js

@@ -4,96 +4,93 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = minifyJs;
-
 var _helpers = require("../helpers");
-
 var _removeRedundantAttributes = require("./removeRedundantAttributes");
-
 const terser = (0, _helpers.optionalRequire)('terser');
-/** Minify JS with Terser */
 
+/** Minify JS with Terser */
 function minifyJs(tree, options, terserOptions) {
   if (!terser) return tree;
   let promises = [];
   tree.walk(node => {
+    const nodeAttrs = node.attrs || {};
+
+    /**
+     * Skip SRI
+     *
+     * If the input <script /> has an SRI attribute, it means that the original <script /> could be trusted,
+     * and should not be altered anymore.
+     *
+     * htmlnano is exactly an MITM that SRI is designed to protect from. If htmlnano or its dependencies get
+     * compromised and introduces malicious code, then it is up to the original SRI to protect the end user.
+     *
+     * So htmlnano will simply skip <script /> that has SRI.
+     * If developers do trust htmlnano, they should generate SRI after htmlnano modify the <script />.
+     */
+    if ('integrity' in nodeAttrs) {
+      return node;
+    }
     if (node.tag && node.tag === 'script') {
-      const nodeAttrs = node.attrs || {};
       const mimeType = nodeAttrs.type || 'text/javascript';
-
       if (_removeRedundantAttributes.redundantScriptTypes.has(mimeType) || mimeType === 'module') {
         promises.push(processScriptNode(node, terserOptions));
       }
     }
-
     if (node.attrs) {
       promises = promises.concat(processNodeWithOnAttrs(node, terserOptions));
     }
-
     return node;
   });
   return Promise.all(promises).then(() => tree);
 }
-
 function stripCdata(js) {
   const leftStrippedJs = js.replace(/\/\/\s*<!\[CDATA\[/, '').replace(/\/\*\s*<!\[CDATA\[\s*\*\//, '');
-
   if (leftStrippedJs === js) {
     return js;
   }
-
   const strippedJs = leftStrippedJs.replace(/\/\/\s*\]\]>/, '').replace(/\/\*\s*\]\]>\s*\*\//, '');
   return leftStrippedJs === strippedJs ? js : strippedJs;
 }
-
 function processScriptNode(scriptNode, terserOptions) {
   let js = (scriptNode.content || []).join('').trim();
-
   if (!js) {
     return scriptNode;
-  } // Improve performance by avoiding calling stripCdata again and again
-
+  }
 
+  // Improve performance by avoiding calling stripCdata again and again
   let isCdataWrapped = false;
-
   if (js.includes('CDATA')) {
     const strippedJs = stripCdata(js);
     isCdataWrapped = js !== strippedJs;
     js = strippedJs;
   }
-
   return terser.minify(js, terserOptions).then(result => {
     if (result.error) {
       throw new Error(result.error);
     }
-
     if (result.code === undefined) {
       return;
     }
-
     let content = result.code;
-
     if (isCdataWrapped) {
       content = '/*<![CDATA[*/' + content + '/*]]>*/';
     }
-
     scriptNode.content = [content];
   });
 }
-
 function processNodeWithOnAttrs(node, terserOptions) {
-  const jsWrapperStart = 'function a(){';
-  const jsWrapperEnd = '}a();';
+  const jsWrapperStart = 'a=function(){';
+  const jsWrapperEnd = '};a();';
   const promises = [];
-
   for (const attrName of Object.keys(node.attrs || {})) {
     if (!(0, _helpers.isEventHandler)(attrName)) {
       continue;
-    } // For example onclick="return false" is valid,
+    }
+
+    // For example onclick="return false" is valid,
     // but "return false;" is invalid (error: 'return' outside of function)
     // Therefore the attribute's code should be wrapped inside function:
     // "function _(){return false;}"
-
-
     let wrappedJs = jsWrapperStart + node.attrs[attrName] + jsWrapperEnd;
     let promise = terser.minify(wrappedJs, terserOptions).then(({
       code
@@ -103,6 +100,5 @@ function processNodeWithOnAttrs(node, terserOptions) {
     });
     promises.push(promise);
   }
-
   return promises;
 }

package/lib/modules/minifyJson.js

@@ -5,17 +5,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.onContent = onContent;
 const rNodeAttrsTypeJson = /(\/|\+)json/;
-
 function onContent() {
   return (content, node) => {
+    // Skip SRI, reasons are documented in "minifyJs" module
+    if (node.attrs && 'integrity' in node.attrs) {
+      return content;
+    }
     if (node.attrs && node.attrs.type && rNodeAttrsTypeJson.test(node.attrs.type)) {
       try {
         // cast minified JSON to an array
         return [JSON.stringify(JSON.parse((content || []).join('')))];
-      } catch (error) {// Invalid JSON
+      } catch (error) {
+        // Invalid JSON
       }
     }
-
     return content;
   };
 }

package/lib/modules/minifySvg.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = minifySvg;
-
 var _helpers = require("../helpers");
-
 const svgo = (0, _helpers.optionalRequire)('svgo');
-/** Minify SVG with SVGO */
 
+/** Minify SVG with SVGO */
 function minifySvg(tree, options, svgoOptions = {}) {
   if (!svgo) return tree;
   tree.match({
@@ -19,12 +17,22 @@ function minifySvg(tree, options, svgoOptions = {}) {
       closingSingleTag: 'slash',
       quoteAllAttributes: true
     });
-    const result = svgo.optimize(svgStr, svgoOptions);
-    node.tag = false;
-    node.attrs = {}; // result.data is a string, we need to cast it to an array
-
-    node.content = [result.data];
-    return node;
+    try {
+      const result = svgo.optimize(svgStr, svgoOptions);
+      node.tag = false;
+      node.attrs = {};
+      // result.data is a string, we need to cast it to an array
+      node.content = [result.data];
+      return node;
+    } catch (error) {
+      console.error('htmlnano fails to minify the svg:');
+      console.error(error);
+      if (error.name === 'SvgoParserError') {
+        console.error(error.toString());
+      }
+      // We return the node as-is
+      return node;
+    }
   });
   return tree;
 }

package/lib/modules/minifyUrls.js

@@ -4,13 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = minifyUrls;
-
 var _helpers = require("../helpers");
-
 const RelateUrl = (0, _helpers.optionalRequire)('relateurl');
 const srcset = (0, _helpers.optionalRequire)('srcset');
-const terser = (0, _helpers.optionalRequire)('terser'); // Adopts from https://github.com/kangax/html-minifier/blob/51ce10f4daedb1de483ffbcccecc41be1c873da2/src/htmlminifier.js#L209-L221
+const terser = (0, _helpers.optionalRequire)('terser');
 
+// Adopts from https://github.com/kangax/html-minifier/blob/51ce10f4daedb1de483ffbcccecc41be1c873da2/src/htmlminifier.js#L209-L221
 const tagsHaveUriValuesForAttributes = new Set(['a', 'area', 'link', 'base', 'object', 'blockquote', 'q', 'del', 'ins', 'form', 'input', 'head', 'audio', 'embed', 'iframe', 'img', 'script', 'track', 'video']);
 const tagsHasHrefAttributes = new Set(['a', 'area', 'link', 'base']);
 const attributesOfImgTagHasUriValues = new Set(['src', 'longdesc', 'usemap']);
@@ -24,15 +23,12 @@ const tagsHasSrcAttributes = new Set(['audio', 'embed', 'iframe', 'img', 'input'
  * but technically it does comply with HTML Standard.
  */
 'source']);
-
 const isUriTypeAttribute = (tag, attr) => {
   return tagsHasHrefAttributes.has(tag) && attr === 'href' || tag === 'img' && attributesOfImgTagHasUriValues.has(attr) || tag === 'object' && attributesOfObjectTagHasUriValues.has(attr) || tagsHasCiteAttributes.has(tag) && attr === 'cite' || tag === 'form' && attr === 'action' || tag === 'input' && attr === 'usemap' || tag === 'head' && attr === 'profile' || tag === 'script' && attr === 'for' || tagsHasSrcAttributes.has(tag) && attr === 'src';
 };
-
 const isSrcsetAttribute = (tag, attr) => {
   return tag === 'source' && attr === 'srcset' || tag === 'img' && attr === 'srcset' || tag === 'link' && attr === 'imagesrcset';
 };
-
 const processModuleOptions = options => {
   // FIXME!
   // relateurl@1.0.0-alpha only supports URL while stable version (0.2.7) only supports string
@@ -41,57 +37,51 @@ const processModuleOptions = options => {
   if (options instanceof URL) return options.toString();
   return false;
 };
-
 const isLinkRelCanonical = ({
   tag,
   attrs
 }) => {
   // Return false early for non-"link" tag
   if (tag !== 'link') return false;
-
   for (const [attrName, attrValue] of Object.entries(attrs)) {
     if (attrName.toLowerCase() === 'rel' && attrValue === 'canonical') return true;
   }
-
   return false;
 };
-
 const JAVASCRIPT_URL_PROTOCOL = 'javascript:';
 let relateUrlInstance;
 let STORED_URL_BASE;
-/** Convert absolute url into relative url */
 
+/** Convert absolute url into relative url */
 function minifyUrls(tree, options, moduleOptions) {
   let promises = [];
-  const urlBase = processModuleOptions(moduleOptions); // Invalid configuration, return tree directly
+  const urlBase = processModuleOptions(moduleOptions);
 
+  // Invalid configuration, return tree directly
   if (!urlBase) return tree;
+
   /** Bring up a reusable RelateUrl instances (only once)
    *
    * STORED_URL_BASE is used to invalidate RelateUrl instances,
    * avoiding require.cache acrossing multiple htmlnano instance with different configuration,
    * e.g. unit tests cases.
    */
-
   if (!relateUrlInstance || STORED_URL_BASE !== urlBase) {
     if (RelateUrl) {
       relateUrlInstance = new RelateUrl(urlBase);
     }
-
     STORED_URL_BASE = urlBase;
   }
-
   tree.walk(node => {
     if (!node.attrs) return node;
     if (!node.tag) return node;
-    if (!tagsHaveUriValuesForAttributes.has(node.tag)) return node; // Prevent link[rel=canonical] being processed
-    // Can't be excluded by isUriTypeAttribute()
+    if (!tagsHaveUriValuesForAttributes.has(node.tag)) return node;
 
+    // Prevent link[rel=canonical] being processed
+    // Can't be excluded by isUriTypeAttribute()
     if (isLinkRelCanonical(node)) return node;
-
     for (const [attrName, attrValue] of Object.entries(node.attrs)) {
       const attrNameLower = attrName.toLowerCase();
-
       if (isUriTypeAttribute(node.tag, attrNameLower)) {
         if (isJavaScriptUrl(attrValue)) {
           promises.push(minifyJavaScriptUrl(node, attrName));
@@ -104,55 +94,49 @@ function minifyUrls(tree, options, moduleOptions) {
             node.attrs[attrName] = relateUrlInstance.relate(attrValue);
           }
         }
-
         continue;
       }
-
       if (isSrcsetAttribute(node.tag, attrNameLower)) {
         if (srcset) {
           try {
-            const parsedSrcset = srcset.parse(attrValue);
+            const parsedSrcset = srcset.parse(attrValue, {
+              strict: true
+            });
             node.attrs[attrName] = srcset.stringify(parsedSrcset.map(srcset => {
               if (relateUrlInstance) {
                 srcset.url = relateUrlInstance.relate(srcset.url);
               }
-
               return srcset;
             }));
-          } catch (e) {// srcset will throw an Error for invalid srcset.
+          } catch (e) {
+            // srcset will throw an Error for invalid srcset.
           }
         }
-
         continue;
       }
     }
-
     return node;
   });
   if (promises.length > 0) return Promise.all(promises).then(() => tree);
   return Promise.resolve(tree);
 }
-
 function isJavaScriptUrl(url) {
   return typeof url === 'string' && url.toLowerCase().startsWith(JAVASCRIPT_URL_PROTOCOL);
 }
-
+const jsWrapperStart = 'function a(){';
+const jsWrapperEnd = '}a();';
 function minifyJavaScriptUrl(node, attrName) {
   if (!terser) return Promise.resolve();
-  const jsWrapperStart = 'function a(){';
-  const jsWrapperEnd = '}a();';
   let result = node.attrs[attrName];
-
   if (result) {
-    result = result.slice(JAVASCRIPT_URL_PROTOCOL.length);
+    result = jsWrapperStart + result.slice(JAVASCRIPT_URL_PROTOCOL.length) + jsWrapperEnd;
     return terser.minify(result, {}) // Default Option is good enough
     .then(({
       code
     }) => {
       const minifiedJs = code.substring(jsWrapperStart.length, code.length - jsWrapperEnd.length);
-      node.attrs[attrName] = minifiedJs;
+      node.attrs[attrName] = JAVASCRIPT_URL_PROTOCOL + minifiedJs;
     });
   }
-
   return Promise.resolve();
 }