html-validate 8.21.0 → 8.22.0

package/dist/cjs/browser.js

@@ -8,7 +8,6 @@ require('./elements.js');
 require('@sidvind/better-ajv-errors');
 require('./utils/natural-join.js');
 require('fs');
-require('@babel/code-frame');
 require('kleur');
 require('@html-validate/stylish');
 require('semver');

package/dist/cjs/browser.js.map

@@ -1 +1 @@
-{"version":3,"file":"browser.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"browser.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/core.js

@@ -5,7 +5,6 @@ var elements = require('./elements.js');
 var betterAjvErrors = require('@sidvind/better-ajv-errors');
 var utils_naturalJoin = require('./utils/natural-join.js');
 var fs = require('fs');
-var codeFrame = require('@babel/code-frame');
 var kleur = require('kleur');
 var stylish$1 = require('@html-validate/stylish');
 var semver = require('semver');
@@ -1681,6 +1680,7 @@ class DOMNode {
   /**
    * Create a new DOMNode.
    *
+   * @internal
    * @param nodeType - What node type to create.
    * @param nodeName - What node name to use. For `HtmlElement` this corresponds
    * to the tagName but other node types have specific predefined values.
@@ -2349,8 +2349,15 @@ function createAdapter(node) {
   };
 }
 class HtmlElement extends DOMNode {
-  constructor(tagName, parent, closed, meta, location) {
-    const nodeType = tagName ? NodeType.ELEMENT_NODE : NodeType.DOCUMENT_NODE;
+  constructor(details) {
+    const {
+      nodeType,
+      tagName,
+      parent = null,
+      closed = 1 /* EndTag */,
+      meta = null,
+      location
+    } = details;
     super(nodeType, tagName, location);
     if (isInvalidTagName(tagName)) {
       throw new Error(`The tag name provided ("${tagName}") is not a valid name`);
@@ -2373,11 +2380,39 @@ class HtmlElement extends DOMNode {
       }
     }
   }
+  /**
+   * Manually create a new element. This is primary useful for test-cases. While
+   * the API is public it is not meant for general consumption and is not
+   * guaranteed to be stable across versions.
+   *
+   * Use at your own risk. Prefer to use [[Parser]] to parse a string of markup
+   * instead.
+   *
+   * @public
+   * @since 8.22.0
+   * @param tagName - Element tagname.
+   * @param location - Element location.
+   * @param details - Additional element details.
+   */
+  static createElement(tagName, location, details = {}) {
+    const { closed = 1 /* EndTag */, meta = null, parent = null } = details;
+    return new HtmlElement({
+      nodeType: NodeType.ELEMENT_NODE,
+      tagName,
+      parent,
+      closed,
+      meta,
+      location
+    });
+  }
   /**
    * @internal
    */
   static rootNode(location) {
-    const root = new HtmlElement(void 0, null, 1 /* EndTag */, null, location);
+    const root = new HtmlElement({
+      nodeType: NodeType.DOCUMENT_NODE,
+      location
+    });
     root.setAnnotation("#document");
     return root;
   }
@@ -2396,7 +2431,14 @@ class HtmlElement extends DOMNode {
     const open = startToken.data[1] !== "/";
     const closed = isClosed(endToken, meta);
     const location = sliceLocation(startToken.location, 1);
-    return new HtmlElement(tagName, open ? parent : null, closed, meta, location);
+    return new HtmlElement({
+      nodeType: NodeType.ELEMENT_NODE,
+      tagName,
+      parent: open ? parent : null,
+      closed,
+      meta,
+      location
+    });
   }
   /**
    * Returns annotated name if set or defaults to `<tagName>`.
@@ -2826,6 +2868,35 @@ function isClosed(endToken, meta) {
   return closed;
 }
 
+function dumpTree(root) {
+  const lines = [];
+  function decoration(node) {
+    let output = "";
+    if (node.id) {
+      output += `#${node.id}`;
+    }
+    if (node.hasAttribute("class")) {
+      output += `.${node.classList.join(".")}`;
+    }
+    return output;
+  }
+  function writeNode(node, level, sibling) {
+    if (node.parent) {
+      const indent = "  ".repeat(level - 1);
+      const l = node.childElements.length > 0 ? "\u252C" : "\u2500";
+      const b = sibling < node.parent.childElements.length - 1 ? "\u251C" : "\u2514";
+      lines.push(`${indent}${b}\u2500${l} ${node.tagName}${decoration(node)}`);
+    } else {
+      lines.push("(root)");
+    }
+    node.childElements.forEach((child, index) => {
+      writeNode(child, level + 1, index);
+    });
+  }
+  writeNode(root, 0, 0);
+  return lines;
+}
+
 function escape(value) {
   return JSON.stringify(value);
 }
@@ -12096,33 +12167,8 @@ class Engine {
   }
   dumpTree(source) {
     const parser = this.instantiateParser();
-    const document = parser.parseHtml(source[0]);
-    const lines = [];
-    function decoration(node) {
-      let output = "";
-      if (node.id) {
-        output += `#${node.id}`;
-      }
-      if (node.hasAttribute("class")) {
-        output += `.${node.classList.join(".")}`;
-      }
-      return output;
-    }
-    function writeNode(node, level, sibling) {
-      if (node.parent) {
-        const indent = "  ".repeat(level - 1);
-        const l = node.childElements.length > 0 ? "\u252C" : "\u2500";
-        const b = sibling < node.parent.childElements.length - 1 ? "\u251C" : "\u2514";
-        lines.push(`${indent}${b}\u2500${l} ${node.tagName}${decoration(node)}`);
-      } else {
-        lines.push("(root)");
-      }
-      node.childElements.forEach((child, index) => {
-        writeNode(child, level + 1, index);
-      });
-    }
-    writeNode(document, 0, 0);
-    return lines;
+    const root = parser.parseHtml(source[0]);
+    return dumpTree(root);
   }
   /**
    * Get rule documentation.
@@ -12797,7 +12843,7 @@ class HtmlValidate {
 }
 
 const name = "html-validate";
-const version = "8.21.0";
+const version = "8.22.0";
 const bugs = "https://gitlab.com/html-validate/html-validate/issues/new";
 
 function definePlugin(plugin) {
@@ -12885,17 +12931,26 @@ const REPLACERS = [
   [
     // (a\ ) -> (a )
     // (a  ) -> (a)
+    // (a ) -> (a)
     // (a \ ) -> (a  )
-    /\\?\s+$/,
-    match => match.indexOf('\\') === 0
-      ? SPACE
-      : EMPTY
+    /((?:\\\\)*?)(\\?\s+)$/,
+    (_, m1, m2) => m1 + (
+      m2.indexOf('\\') === 0
+        ? SPACE
+        : EMPTY
+    )
   ],
 
   // replace (\ ) with ' '
+  // (\ ) -> ' '
+  // (\\ ) -> '\\ '
+  // (\\\ ) -> '\\ '
   [
-    /\\\s/g,
-    () => SPACE
+    /(\\+?)\s/g,
+    (_, m1) => {
+      const {length} = m1;
+      return m1.slice(0, length - length % 2) + SPACE
+    }
   ],
 
   // Escape metacharacters
@@ -13123,7 +13178,8 @@ const makeRegex = (pattern, ignoreCase) => {
 
   if (!source) {
     source = REPLACERS.reduce(
-      (prev, current) => prev.replace(current[0], current[1].bind(pattern)),
+      (prev, [matcher, replacer]) =>
+        prev.replace(matcher, replacer.bind(pattern)),
       pattern
     );
     regexCache[pattern] = source;
@@ -13489,6 +13545,81 @@ const defaults = {
   showSummary: true,
   showSelector: false
 };
+const NEWLINE = /\r\n|[\n\r\u2028\u2029]/;
+function getMarkerLines(loc, source) {
+  const startLoc = {
+    ...loc.start
+  };
+  const endLoc = {
+    ...startLoc,
+    ...loc.end
+  };
+  const linesAbove = 2;
+  const linesBelow = 3;
+  const startLine = startLoc.line;
+  const startColumn = startLoc.column;
+  const endLine = endLoc.line;
+  const endColumn = endLoc.column;
+  const start = Math.max(startLine - (linesAbove + 1), 0);
+  const end = Math.min(source.length, endLine + linesBelow);
+  const lineDiff = endLine - startLine;
+  const markerLines = {};
+  if (lineDiff) {
+    for (let i = 0; i <= lineDiff; i++) {
+      const lineNumber = i + startLine;
+      if (!startColumn) {
+        markerLines[lineNumber] = true;
+      } else if (i === 0) {
+        const sourceLength = source[lineNumber - 1].length;
+        markerLines[lineNumber] = [startColumn, sourceLength - startColumn + 1];
+      } else if (i === lineDiff) {
+        markerLines[lineNumber] = [0, endColumn];
+      } else {
+        const sourceLength = source[lineNumber - i].length;
+        markerLines[lineNumber] = [0, sourceLength];
+      }
+    }
+  } else {
+    if (startColumn === endColumn) {
+      if (startColumn) {
+        markerLines[startLine] = [startColumn, 0];
+      } else {
+        markerLines[startLine] = true;
+      }
+    } else {
+      markerLines[startLine] = [startColumn, endColumn - startColumn];
+    }
+  }
+  return { start, end, markerLines };
+}
+function codeFrameColumns(rawLines, loc) {
+  const lines = rawLines.split(NEWLINE);
+  const { start, end, markerLines } = getMarkerLines(loc, lines);
+  const numberMaxWidth = String(end).length;
+  return rawLines.split(NEWLINE, end).slice(start, end).map((line, index) => {
+    const number = start + 1 + index;
+    const paddedNumber = ` ${String(number)}`.slice(-numberMaxWidth);
+    const gutter = ` ${paddedNumber} |`;
+    const hasMarker = markerLines[number];
+    if (hasMarker) {
+      let markerLine = "";
+      if (Array.isArray(hasMarker)) {
+        const markerSpacing = line.slice(0, Math.max(hasMarker[0] - 1, 0)).replace(/[^\t]/g, " ");
+        const numberOfMarkers = hasMarker[1] || 1;
+        markerLine = [
+          "\n ",
+          gutter.replace(/\d/g, " "),
+          " ",
+          markerSpacing,
+          "^".repeat(numberOfMarkers)
+        ].join("");
+      }
+      return [">", gutter, line.length > 0 ? ` ${line}` : "", markerLine].join("");
+    } else {
+      return [" ", gutter, line.length > 0 ? ` ${line}` : ""].join("");
+    }
+  }).join("\n");
+}
 function pluralize(word, count) {
   return count === 1 ? word : `${word}s`;
 }
@@ -13531,16 +13662,11 @@ function formatMessage(message, parentResult, options) {
   ].filter(String).join(" ");
   const result = [firstLine];
   if (sourceCode) {
-    result.push(
-      codeFrame.codeFrameColumns(
-        sourceCode,
-        {
-          start: getStartLocation(message),
-          end: getEndLocation(message, sourceCode)
-        },
-        { highlightCode: false }
-      )
-    );
+    const output = codeFrameColumns(sourceCode, {
+      start: getStartLocation(message),
+      end: getEndLocation(message, sourceCode)
+    });
+    result.push(output);
   }
   if (options.showSelector) {
     result.push(`${kleur__default.default.bold("Selector:")} ${message.selector ?? "-"}`);