feat(html): switch to htmlparser2 (#5127)

- switch to [`htmlparser2`](https://github.com/fb55/htmlparser2) - no need to fork - won't generate pseudo nodes ([`parse5` will](https://github.com/prettier/prettier/issues/5098#issuecomment-423055181)) - should be [faster](https://github.com/fb55/htmlparser2#performance) - support custom self-closing tags - support HTML entities - remove extra trailing newline for `<template>` - distinguish empty/empty-string attributes (`<tag x>`/`<tag x="">`) - rename `--parser parse5` with `--parser html` - enable `html` since 1.15, which means it's enabled by default if you install the dev version from GitHub after this PR merged.
2018-09-22 21:53:38 +08:00 · 2018-09-22 21:53:38 +08:00 · 13147facc5
parent 0cbacd3156
commit 13147facc5
56 changed files with 427 additions and 303 deletions
--- a/package.json
+++ b/package.json
@ -25,6 +25,7 @@
    "dashify": "0.2.2",
    "dedent": "0.7.0",
    "diff": "3.2.0",
+    "domhandler": "2.4.2",
    "editorconfig": "0.15.0",
    "editorconfig-to-prettier": "0.0.6",
    "emoji-regex": "6.5.1",
@ -37,6 +38,7 @@
    "globby": "6.1.0",
    "graphql": "0.13.2",
    "html-tag-names": "1.1.2",
+    "htmlparser2": "3.9.2",
    "ignore": "3.3.7",
    "jest-docblock": "23.2.0",
    "json-stable-stringify": "1.0.1",
@ -47,7 +49,6 @@
    "minimatch": "3.0.4",
    "minimist": "1.2.0",
    "normalize-path": "3.0.0",
-    "parse5": "5.0.0",
    "parse5-htmlparser2-tree-adapter": "5.0.0",
    "postcss-less": "1.1.5",
    "postcss-media-query-parser": "0.2.3",
--- a/scripts/build/config.js
+++ b/scripts/build/config.js
@ -68,7 +68,7 @@ const parsers = [
    }
  },
  {
-    input: "src/language-html/parser-parse5.js",
+    input: "src/language-html/parser-html.js",
    target: "universal"
  },
  {
--- a/scripts/build/shims/events.js
+++ b/scripts/build/shims/events.js
@ -0,0 +1 @@
+export class EventEmitter {}
--- a/src/common/internal-plugins.js
+++ b/src/common/internal-plugins.js
@ -109,8 +109,8 @@ module.exports = [
  require("../language-html"),
  {
    parsers: {
-      get parse5() {
-        return eval("require")("../language-html/parser-parse5").parsers.parse5;
+      get html() {
+        return eval("require")("../language-html/parser-html").parsers.html;
      }
    }
  },
--- a/src/language-html/clean.js
+++ b/src/language-html/clean.js
@ -1,7 +1,9 @@
 "use strict";

 module.exports = function(ast, newNode) {
-  delete newNode.sourceCodeLocation;
+  delete newNode.startIndex;
+  delete newNode.endIndex;
+  delete newNode.attribs;

  if (ast.type === "text") {
    return null;
@ -11,4 +13,12 @@ module.exports = function(ast, newNode) {
  if (ast.type === "yaml") {
    return null;
  }
+
+  if (ast.type === "attribute") {
+    delete newNode.value;
+  }
+
+  if (ast.type === "directive" && ast.name === "!doctype") {
+    delete newNode.data;
+  }
 };
--- a/src/language-html/embed.js
+++ b/src/language-html/embed.js
@ -20,7 +20,7 @@ function embed(path, print, textToDoc, options) {
          parent.attribs.type === "application/javascript")
      ) {
        const parser = options.parser === "flow" ? "flow" : "babylon";
-        const doc = textToDoc(getText(options, node), { parser });
+        const doc = textToDoc(node.data, { parser });
        return concat([hardline, doc]);
      }

@ -30,17 +30,13 @@ function embed(path, print, textToDoc, options) {
        (parent.attribs.type === "application/x-typescript" ||
          parent.attribs.lang === "ts")
      ) {
-        const doc = textToDoc(
-          getText(options, node),
-          { parser: "typescript" },
-          options
-        );
+        const doc = textToDoc(node.data, { parser: "typescript" }, options);
        return concat([hardline, doc]);
      }

      // Inline Styles
      if (parent.type === "style") {
-        const doc = textToDoc(getText(options, node), { parser: "css" });
+        const doc = textToDoc(node.data, { parser: "css" });
        return concat([hardline, doc]);
      }

@ -106,11 +102,4 @@ function replaceNewlinesWithLiterallines(doc) {
  );
 }

-function getText(options, node) {
-  return options.originalText.slice(
-    options.locStart(node),
-    options.locEnd(node)
-  );
-}
-
 module.exports = embed;
--- a/src/language-html/index.js
+++ b/src/language-html/index.js
@ -6,8 +6,8 @@ const createLanguage = require("../utils/create-language");
 const languages = [
  createLanguage(require("linguist-languages/data/html"), {
    override: {
-      since: null, // unreleased
-      parsers: ["parse5"],
+      since: "1.15.0",
+      parsers: ["html"],
      vscodeLanguageIds: ["html"]
    }
  })
--- a/src/language-html/parser-html.js
+++ b/src/language-html/parser-html.js
@ -0,0 +1,136 @@
+"use strict";
+
+const parseFrontMatter = require("../utils/front-matter");
+const { HTML_TAGS } = require("./utils");
+
+function parse(text /*, parsers, opts*/) {
+  const { frontMatter, content } = parseFrontMatter(text);
+
+  // Inline the require to avoid loading all the JS if we don't use it
+  const Parser = require("htmlparser2/lib/Parser");
+  const DomHandler = require("domhandler");
+
+  /**
+   * modifications:
+   * - empty attributes (e.g., `<tag attr>`) are parsed as `{ [attr]: null }` instead of `{ [attr]: "" }`
+   * - trigger `Handler#onselfclosingtag()`
+   */
+  class CustomParser extends Parser {
+    constructor(cbs, options) {
+      super(cbs, options);
+      this._attribvalue = null;
+    }
+    onattribdata(value) {
+      if (this._attribvalue === null) {
+        this._attribvalue = "";
+      }
+      super.onattribdata(value);
+    }
+    onattribend() {
+      super.onattribend();
+      this._attribvalue = null;
+    }
+    onselfclosingtag() {
+      if (this._options.xmlMode || this._options.recognizeSelfClosing) {
+        const name = this._tagname;
+        this.onopentagend();
+        if (this._stack[this._stack.length - 1] === name) {
+          this._cbs.onselfclosingtag();
+          this._cbs.onclosetag(name);
+          this._stack.pop();
+        }
+      } else {
+        this.onopentagend();
+      }
+    }
+  }
+
+  /**
+   * modifications:
+   * - add `selfClosing` field
+   */
+  class CustomDomHandler extends DomHandler {
+    onselfclosingtag() {
+      this._tagStack[this._tagStack.length - 1].selfClosing = true;
+    }
+  }
+
+  const handler = new CustomDomHandler({
+    withStartIndices: true,
+    withEndIndices: true
+  });
+
+  new CustomParser(handler, {
+    lowerCaseTags: true, // preserve lowercase tag names to avoid false check in htmlparser2 and apply the lowercasing later
+    lowerCaseAttributeNames: false,
+    recognizeSelfClosing: true
+  }).end(content);
+
+  const ast = normalize({ type: "root", children: handler.dom }, text);
+
+  if (frontMatter) {
+    ast.children.unshift(frontMatter);
+  }
+
+  return ast;
+}
+
+function normalize(node, text) {
+  delete node.parent;
+  delete node.next;
+  delete node.prev;
+
+  let isCaseSensitiveTag = false;
+
+  if (node.type === "tag" && !(node.name in HTML_TAGS)) {
+    isCaseSensitiveTag = true;
+    node.name = text.slice(
+      node.startIndex + 1, // <
+      node.startIndex + 1 + node.name.length
+    );
+  }
+
+  if (node.attribs) {
+    node.attributes = Object.keys(node.attribs).map(attributeKey => ({
+      type: "attribute",
+      key: isCaseSensitiveTag ? attributeKey : attributeKey.toLowerCase(),
+      value: node.attribs[attributeKey]
+    }));
+  }
+
+  if (node.children) {
+    node.children = node.children.map(child => normalize(child, text));
+  }
+
+  if (
+    node.type === "tag" &&
+    node.name === "textarea" &&
+    node.children.length === 1 &&
+    node.children[0].type === "text" &&
+    node.children[0].data === "\n" &&
+    !/<\/textarea>$/.test(text.slice(locStart(node), locEnd(node)))
+  ) {
+    node.children = [];
+  }
+
+  return node;
+}
+
+function locStart(node) {
+  return node.startIndex;
+}
+
+function locEnd(node) {
+  return node.endIndex + 1;
+}
+
+module.exports = {
+  parsers: {
+    html: {
+      parse,
+      astFormat: "htmlparser2",
+      locStart,
+      locEnd
+    }
+  }
+};
--- a/src/language-html/parser-parse5.js
+++ b/src/language-html/parser-parse5.js
@ -1,89 +0,0 @@
-"use strict";
-
-const htmlTagNames = require("html-tag-names");
-const parseFrontMatter = require("../utils/front-matter");
-
-const nonFragmentRegex = /^\s*(<!--[\s\S]*?-->\s*)*<(!doctype|html|head|body)[\s>]/i;
-
-function parse(text /*, parsers, opts*/) {
-  // Inline the require to avoid loading all the JS if we don't use it
-  const parse5 = require("parse5");
-  const htmlparser2TreeAdapter = require("parse5-htmlparser2-tree-adapter");
-
-  const { frontMatter, content } = parseFrontMatter(text);
-
-  const isFragment = !nonFragmentRegex.test(content);
-  const ast = (isFragment ? parse5.parseFragment : parse5.parse)(content, {
-    treeAdapter: htmlparser2TreeAdapter,
-    sourceCodeLocationInfo: true
-  });
-
-  const normalizedAst = normalize(ast, text);
-
-  if (frontMatter) {
-    normalizedAst.children.unshift(frontMatter);
-  }
-
-  return normalizedAst;
-}
-
-function normalize(node, text) {
-  delete node.parent;
-  delete node.next;
-  delete node.prev;
-
-  let isCaseSensitiveTag = false;
-
-  // preserve case-sensitive tag names
-  if (
-    node.type === "tag" &&
-    node.sourceCodeLocation &&
-    htmlTagNames.indexOf(node.name) === -1
-  ) {
-    isCaseSensitiveTag = true;
-    node.name = text.slice(
-      node.sourceCodeLocation.startOffset + 1, // <
-      node.sourceCodeLocation.startOffset + 1 + node.name.length
-    );
-  }
-
-  if (node.attribs) {
-    node.attributes = Object.keys(node.attribs).map(attributeKey => {
-      const sourceCodeLocation = node.sourceCodeLocation.attrs[attributeKey];
-      return {
-        type: "attribute",
-        key: isCaseSensitiveTag
-          ? text
-              .slice(
-                sourceCodeLocation.startOffset,
-                sourceCodeLocation.endOffset
-              )
-              .split("=", 1)[0]
-          : attributeKey,
-        value: node.attribs[attributeKey],
-        sourceCodeLocation
-      };
-    });
-  }
-
-  if (node.children) {
-    node.children = node.children.map(child => normalize(child, text));
-  }
-
-  return node;
-}
-
-module.exports = {
-  parsers: {
-    parse5: {
-      parse,
-      astFormat: "htmlparser2",
-      locStart(node) {
-        return node.sourceCodeLocation && node.sourceCodeLocation.startOffset;
-      },
-      locEnd(node) {
-        return node.sourceCodeLocation && node.sourceCodeLocation.endOffset;
-      }
-    }
-  }
-};
--- a/src/language-html/printer-htmlparser2.js
+++ b/src/language-html/printer-htmlparser2.js
@ -18,12 +18,11 @@ const {
  utils: { willBreak, isLineNext, isEmpty }
 } = require("../doc");
 const {
+  VOID_TAGS,
  hasPrettierIgnore,
-  isBooleanAttributeNode,
  isPreTagNode,
  isScriptTagNode,
  isTextAreaTagNode,
-  isVoidTagNode,
  isWhitespaceOnlyText
 } = require("./utils");

@ -37,7 +36,15 @@ function genericPrint(path, options, print) {
    case "directive": {
      return concat([
        "<",
-        n.data.replace('!DOCTYPE html ""', "!DOCTYPE html"),
+        n.name === "!doctype"
+          ? n.data
+              .replace(/\s+/g, " ")
+              .replace(
+                /^(!doctype)(( html)?)/i,
+                (_, doctype, doctypeHtml) =>
+                  doctype.toUpperCase() + doctypeHtml.toLowerCase()
+              )
+          : n.data,
        ">",
        hardline
      ]);
@ -46,7 +53,9 @@ function genericPrint(path, options, print) {
      const parentNode = path.getParentNode();

      if (isPreTagNode(parentNode) || isTextAreaTagNode(parentNode)) {
-        return n.data;
+        return concat(
+          n.data.split(/(\n)/g).map((x, i) => (i % 2 === 1 ? hardline : x))
+        );
      }

      return n.data.replace(/\s+/g, " ").trim();
@ -54,11 +63,11 @@ function genericPrint(path, options, print) {
    case "script":
    case "style":
    case "tag": {
-      const isVoid = isVoidTagNode(n);
+      const isVoid = n.name in VOID_TAGS;
      const openingPrinted = printOpeningTag(path, print, isVoid);

      // Print self closing tag
-      if (isVoid) {
+      if (isVoid || n.selfClosing) {
        return openingPrinted;
      }

@ -71,24 +80,9 @@ function genericPrint(path, options, print) {

      const children = printChildren(path, print, options);

-      // NOTE: If the next token is a U+000A LINE FEED (LF) character token, then ignore that token and move
-      // on to the next one. (Newlines at the start of textarea elements are ignored as an authoring convenience.)
      if (isPreTagNode(n) || isTextAreaTagNode(n)) {
-        const originalTagContent = options.originalText.slice(
-          n.sourceCodeLocation.startTag.endOffset,
-          n.sourceCodeLocation.endTag.startOffset
-        );
-        const hasNewlineAfterTag = /^(\r\n|\r|\n)/.test(originalTagContent);
-
        return dedentToRoot(
-          group(
-            concat([
-              openingPrinted,
-              hasNewlineAfterTag ? hardline : "",
-              concat(children),
-              closingPrinted
-            ])
-          )
+          group(concat([openingPrinted, concat(children), closingPrinted]))
        );
      }

@ -157,18 +151,8 @@ function genericPrint(path, options, print) {
      return concat(["<!--", n.data, "-->"]);
    }
    case "attribute": {
-      if (!n.value) {
-        if (isBooleanAttributeNode(n)) {
-          return n.key;
-        }
-
-        const originalAttributeSourceCode = options.originalText.slice(
-          n.sourceCodeLocation.startOffset,
-          n.sourceCodeLocation.endOffset
-        );
-        const hasEqualSign = originalAttributeSourceCode.indexOf("=") !== -1;
-
-        return hasEqualSign ? concat([n.key, '=""']) : n.key;
+      if (n.value === null) {
+        return n.key;
      }

      return concat([n.key, '="', n.value.replace(/"/g, "&quot;"), '"']);
@ -186,15 +170,23 @@ function genericPrint(path, options, print) {
 function printOpeningTag(path, print, isVoid) {
  const n = path.getValue();

+  const selfClosing = isVoid || n.selfClosing;
+
  // Don't break self-closing elements with no attributes
-  if (isVoid && !n.attributes.length) {
+  if (selfClosing && !n.attributes.length) {
    return concat(["<", n.name, " />"]);
  }

  // Don't break up opening elements with a single long text attribute
  if (n.attributes && n.attributes.length === 1 && n.attributes[0].value) {
    return group(
-      concat(["<", n.name, " ", concat(path.map(print, "attributes")), ">"])
+      concat([
+        "<",
+        n.name,
+        " ",
+        concat(path.map(print, "attributes")),
+        selfClosing ? " />" : ">"
+      ])
    );
  }

@ -205,7 +197,7 @@ function printOpeningTag(path, print, isVoid) {
      indent(
        concat(path.map(attr => concat([line, print(attr)]), "attributes"))
      ),
-      isVoid ? concat([line, "/>"]) : concat([softline, ">"])
+      selfClosing ? concat([line, "/>"]) : concat([softline, ">"])
    ])
  );
 }
--- a/src/language-html/utils.js
+++ b/src/language-html/utils.js
@ -1,51 +1,50 @@
 "use strict";

-// https://html.spec.whatwg.org/multipage/indices.html#attributes-3
-const BOOLEAN_ATTRIBUTES = [
-  "allowfullscreen",
-  "allowpaymentrequest",
-  "async",
-  "autofocus",
-  "autoplay",
-  "checked",
-  "controls",
-  "default",
-  "defer",
-  "disabled",
-  "formnovalidate",
-  "hidden",
-  "ismap",
-  "itemscope",
-  "loop",
-  "multiple",
-  "muted",
-  "nomodule",
-  "novalidate",
-  "open",
-  "readonly",
-  "required",
-  "reversed",
-  "selected",
-  "typemustmatch"
-];
+const htmlTagNames = require("html-tag-names");

-// http://w3c.github.io/html/single-page.html#void-elements
-const VOID_TAGS = [
+const HTML_TAGS = arrayToMap(htmlTagNames);
+
+// NOTE: must be same as the one in htmlparser2 so that the parsing won't be inconsistent
+//       https://github.com/fb55/htmlparser2/blob/v3.9.2/lib/Parser.js#L59-L91
+const VOID_TAGS = arrayToMap([
  "area",
  "base",
+  "basefont",
  "br",
  "col",
+  "command",
  "embed",
+  "frame",
  "hr",
  "img",
  "input",
+  "isindex",
+  "keygen",
  "link",
  "meta",
  "param",
  "source",
  "track",
-  "wbr"
-];
+  "wbr",
+
+  "path",
+  "circle",
+  "ellipse",
+  "line",
+  "rect",
+  "use",
+  "stop",
+  "polyline",
+  "polygon"
+]);
+
+function arrayToMap(array) {
+  const map = Object.create(null);
+  for (const value of array) {
+    map[value] = true;
+  }
+  return map;
+}

 function hasPrettierIgnore(path) {
  const node = path.getValue();
@ -88,16 +87,6 @@ function isWhitespaceOnlyText(node) {
  return node.type === "text" && node.data.trim().length === 0;
 }

-function isBooleanAttributeNode(node) {
-  return (
-    node.type === "attribute" && BOOLEAN_ATTRIBUTES.indexOf(node.key) !== -1
-  );
-}
-
-function isVoidTagNode(node) {
-  return node.type === "tag" && VOID_TAGS.indexOf(node.name) !== -1;
-}
-
 function isPreTagNode(node) {
  return node.type === "tag" && node.name === "pre";
 }
@ -111,11 +100,11 @@ function isScriptTagNode(node) {
 }

 module.exports = {
+  HTML_TAGS,
+  VOID_TAGS,
  hasPrettierIgnore,
-  isBooleanAttributeNode,
-  isWhitespaceOnlyText,
  isPreTagNode,
  isScriptTagNode,
  isTextAreaTagNode,
-  isVoidTagNode
+  isWhitespaceOnlyText
 };
--- a/src/main/core-options.js
+++ b/src/main/core-options.js
@ -122,7 +122,7 @@ const options = {
        since: null,
        description: "Handlebars"
      },
-      { value: "parse5", since: null, description: "HTML" }
+      { value: "html", since: "1.15.0", description: "HTML" }
    ]
  },
  plugins: {
--- a/tests/html_attributes/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_attributes/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`attributes.html - parse5-verify 1`] = `
+exports[`attributes.html - html-verify 1`] = `
 <input name=address maxlength=200>
 <input name='address' maxlength='200'>
 <input name="address" maxlength="200">
@ -131,7 +131,7 @@ and HTML5 Apps. It also documents Mozilla products, like Firefox OS."

 `;

-exports[`boolean.html - parse5-verify 1`] = `
+exports[`boolean.html - html-verify 1`] = `
 <button type="submit">This is valid.</button>
 <button type="submit" disabled>This is valid.</button>
 <button type="submit" disabled="">This is valid.</button>
@ -154,7 +154,7 @@ exports[`boolean.html - parse5-verify 1`] = `
 <button type="submit" disabled>
  This is valid.
 </button>
-<button type="submit" disabled>
+<button type="submit" disabled="">
  This is valid.
 </button>
 <button type="submit" disabled="disabled">
@ -189,26 +189,26 @@ exports[`boolean.html - parse5-verify 1`] = `
 </button>
 <input type="checkbox" checked disabled name="cheese" />
 <input type="checkbox" checked="checked" disabled="disabled" name="cheese" />
-<input type="checkbox" checked disabled name="cheese" />
+<input type="checkbox" checked="" disabled="" name="cheese" />
 <div lang=""></div>

 `;

-exports[`dobule-quotes.html - parse5-verify 1`] = `
+exports[`dobule-quotes.html - html-verify 1`] = `
 <img src="test.png" alt="John 'ShotGun' Nelson">
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <img src="test.png" alt="John 'ShotGun' Nelson" />

 `;

-exports[`single-quotes.html - parse5-verify 1`] = `
+exports[`single-quotes.html - html-verify 1`] = `
 <img src="test.png" alt='John "ShotGun" Nelson'>
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <img src="test.png" alt="John &quot;ShotGun&quot; Nelson" />

 `;

-exports[`without-quotes.html - parse5-verify 1`] = `
+exports[`without-quotes.html - html-verify 1`] = `
 <p title=Title>String</p>
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <p title="Title">String</p>
--- a/tests/html_attributes/jsfmt.spec.js
+++ b/tests/html_attributes/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_aurelia/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_aurelia/snapshots/jsfmt.spec.js.snap
@ -1,13 +1,12 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`basic.html - parse5-verify 1`] = `
+exports[`basic.html - html-verify 1`] = `
 <template>
  <i class.bind="icon"></i>
 </template>
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <template>
  <i class.bind="icon"></i>
-
 </template>

 `;
--- a/tests/html_aurelia/jsfmt.spec.js
+++ b/tests/html_aurelia/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_basics/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_basics/snapshots/jsfmt.spec.js.snap
@ -1,18 +1,18 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`comment.html - parse5-verify 1`] = `
+exports[`comment.html - html-verify 1`] = `
 <!--hello world-->
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <!--hello world-->

 `;

-exports[`empty.html - parse5-verify 1`] = `
+exports[`empty.html - html-verify 1`] = `
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

 `;

-exports[`empty-doc.html - parse5-verify 1`] = `
+exports[`empty-doc.html - html-verify 1`] = `
 <!doctype html>
 <html>
 <head></head>
@ -27,7 +27,7 @@ exports[`empty-doc.html - parse5-verify 1`] = `

 `;

-exports[`form.html - parse5-verify 1`] = `
+exports[`form.html - html-verify 1`] = `
 <form>
  <div class="form-group">
    <label for="exampleInputEmail1">Email address</label>
@ -168,7 +168,7 @@ exports[`form.html - parse5-verify 1`] = `
          value="option1"
          checked
        />
-        Option one is this and that—be sure to include why it's great
+        Option one is this and that&mdash;be sure to include why it's great
      </label>
    </div>
    <div class="form-check">
@ -210,7 +210,7 @@ exports[`form.html - parse5-verify 1`] = `

 `;

-exports[`hello-world.html - parse5-verify 1`] = `
+exports[`hello-world.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html lang="en">
 <head>
@ -229,7 +229,7 @@ exports[`hello-world.html - parse5-verify 1`] = `
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <meta charset="UTF-8">
+    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
@ -242,7 +242,7 @@ exports[`hello-world.html - parse5-verify 1`] = `

 `;

-exports[`html-comments.html - parse5-verify 1`] = `
+exports[`html-comments.html - html-verify 1`] = `
 <!-- htmlhint attr-lowercase: false -->
 <html>
  <body>
@ -253,7 +253,6 @@ exports[`html-comments.html - parse5-verify 1`] = `
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <!-- htmlhint attr-lowercase: false -->
 <html>
-  <head></head>
  <body>
    <a href="#">Anchor</a>
    <div hidden class="foo" id="bar"></div>
@ -262,7 +261,7 @@ exports[`html-comments.html - parse5-verify 1`] = `

 `;

-exports[`html-fragment.html - parse5-verify 1`] = `
+exports[`html-fragment.html - html-verify 1`] = `
 <a href="#">Link</a>

 <textarea>
@ -273,7 +272,7 @@ exports[`html-fragment.html - parse5-verify 1`] = `

 `;

-exports[`html5-boilerplate.html - parse5-verify 1`] = `
+exports[`html5-boilerplate.html - html-verify 1`] = `
 <!doctype html>
 <html class="no-js" lang="">

@ -318,7 +317,7 @@ exports[`html5-boilerplate.html - parse5-verify 1`] = `
 <!DOCTYPE html>
 <html class="no-js" lang="">
  <head>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
    <title></title>
    <meta name="description" content="" />
@ -375,7 +374,7 @@ exports[`html5-boilerplate.html - parse5-verify 1`] = `

 `;

-exports[`more-html.html - parse5-verify 1`] = `
+exports[`more-html.html - html-verify 1`] = `
 <html>
 <head></head>
 <body>
@ -394,7 +393,7 @@ exports[`more-html.html - parse5-verify 1`] = `

 `;

-exports[`void-elements.html - parse5-verify 1`] = `
+exports[`void-elements.html - html-verify 1`] = `
 <html>
 <head>
  <meta charset="UTF-8">
@ -405,7 +404,7 @@ exports[`void-elements.html - parse5-verify 1`] = `
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <html>
  <head>
-    <meta charset="UTF-8">
+    <meta charset="UTF-8" />
    <link rel="stylesheet" href="code-guide.css" />
  </head>
  <body></body>
--- a/tests/html_basics/jsfmt.spec.js
+++ b/tests/html_basics/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_case/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_case/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`case.html - parse5-verify 1`] = `
+exports[`case.html - html-verify 1`] = `
 <!DOCTYPE html>
 <HTML CLASS="no-js mY-ClAsS">
  <HEAD>
@ -21,7 +21,7 @@ exports[`case.html - parse5-verify 1`] = `
 <!DOCTYPE html>
 <html class="no-js mY-ClAsS">
  <head>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
    <title>My tITlE</title>
    <meta name="description" content="My CoNtEnT" />
  </head>
--- a/tests/html_case/jsfmt.spec.js
+++ b/tests/html_case/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_comments/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_comments/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`conditional.html - parse5-verify 1`] = `
+exports[`conditional.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html>
  <body>
@ -16,7 +16,6 @@ exports[`conditional.html - parse5-verify 1`] = `
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <!DOCTYPE html>
 <html>
-  <head></head>
  <body>
    <!--[if IE 5]>This is IE 5<br><![endif]-->
    <!--[if IE 6]>This is IE 6<br><![endif]-->
@ -28,7 +27,7 @@ exports[`conditional.html - parse5-verify 1`] = `

 `;

-exports[`for_debugging.html - parse5-verify 1`] = `
+exports[`for_debugging.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html>
  <body>
@ -50,7 +49,6 @@ exports[`for_debugging.html - parse5-verify 1`] = `
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <!DOCTYPE html>
 <html>
-  <head></head>
  <body>
    <!-- Do not display this at the moment
 <img border="0" src="pic_trulli.jpg" alt="Trulli">
@ -68,7 +66,7 @@ exports[`for_debugging.html - parse5-verify 1`] = `

 `;

-exports[`hidden.html - parse5-verify 1`] = `
+exports[`hidden.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html>
    <body>
@ -85,7 +83,6 @@ exports[`hidden.html - parse5-verify 1`] = `
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <!DOCTYPE html>
 <html>
-  <head></head>
  <body>
    <!--This is a comment-->
    <!-- This is a comment -->
--- a/tests/html_comments/jsfmt.spec.js
+++ b/tests/html_comments/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_css/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_css/snapshots/jsfmt.spec.js.snap
@ -1,13 +1,13 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`empty.html - parse5-verify 1`] = `
+exports[`empty.html - html-verify 1`] = `
 <style></style>
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <style></style>

 `;

-exports[`less.html - parse5-verify 1`] = `
+exports[`less.html - html-verify 1`] = `
 <style type="text/less">
  @nice-blue: #5B83AD;
  @light-blue: @nice-blue + #111;
@ -46,7 +46,7 @@ exports[`less.html - parse5-verify 1`] = `

 `;

-exports[`postcss.html - parse5-verify 1`] = `
+exports[`postcss.html - html-verify 1`] = `
 <style type="text/css">
  body { background: navy; color: yellow; }
 </style>
@ -71,7 +71,7 @@ body {

 `;

-exports[`scss.html - parse5-verify 1`] = `
+exports[`scss.html - html-verify 1`] = `
 <style type="text/x-scss">
  $font-stack:    Helvetica, sans-serif;
  $primary-color: #333;
@ -114,7 +114,7 @@ body {

 `;

-exports[`simple.html - parse5-verify 1`] = `
+exports[`simple.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html>
  <head>
@ -154,7 +154,7 @@ exports[`simple.html - parse5-verify 1`] = `

 `;

-exports[`single-style.html - parse5-verify 1`] = `
+exports[`single-style.html - html-verify 1`] = `
 <style>a { color: red; }</style>
 <style>
  h1 {
--- a/tests/html_css/jsfmt.spec.js
+++ b/tests/html_css/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_doctype_declarations/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_doctype_declarations/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`html4.01_frameset.html - parse5-verify 1`] = `
+exports[`html4.01_frameset.html - html-verify 1`] = `
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
  "http://www.w3.org/TR/html4/frameset.dtd">
 <html>
@ -17,7 +17,7 @@ exports[`html4.01_frameset.html - parse5-verify 1`] = `
 <html>
  <head>
    <title>An HTML standard template</title>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
  </head>
  <body>
    <p>… Your HTML content here …</p>
@ -26,7 +26,7 @@ exports[`html4.01_frameset.html - parse5-verify 1`] = `

 `;

-exports[`html4.01_strict.html - parse5-verify 1`] = `
+exports[`html4.01_strict.html - html-verify 1`] = `
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
 <html>
@ -43,7 +43,7 @@ exports[`html4.01_strict.html - parse5-verify 1`] = `
 <html>
  <head>
    <title>An HTML standard template</title>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
  </head>
  <body>
    <p>… Your HTML content here …</p>
@ -52,7 +52,7 @@ exports[`html4.01_strict.html - parse5-verify 1`] = `

 `;

-exports[`html4.01_transitional.html - parse5-verify 1`] = `
+exports[`html4.01_transitional.html - html-verify 1`] = `
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
 <html>
@ -69,7 +69,7 @@ exports[`html4.01_transitional.html - parse5-verify 1`] = `
 <html>
  <head>
    <title>An HTML standard template</title>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
  </head>
  <body>
    <p>… Your HTML content here …</p>
@ -78,7 +78,7 @@ exports[`html4.01_transitional.html - parse5-verify 1`] = `

 `;

-exports[`html5.html - parse5-verify 1`] = `
+exports[`html5.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html>
  <head>
@ -94,7 +94,7 @@ exports[`html5.html - parse5-verify 1`] = `
 <html>
  <head>
    <title>An HTML standard template</title>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
  </head>
  <body>
    <p>… Your HTML content here …</p>
@ -103,7 +103,7 @@ exports[`html5.html - parse5-verify 1`] = `

 `;

-exports[`xhtml1.1.html - parse5-verify 1`] = `
+exports[`xhtml1.1.html - html-verify 1`] = `
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
--- a/tests/html_doctype_declarations/jsfmt.spec.js
+++ b/tests/html_doctype_declarations/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_js/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_js/snapshots/jsfmt.spec.js.snap
@ -1,13 +1,13 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`empty.html - parse5-verify 1`] = `
+exports[`empty.html - html-verify 1`] = `
 <script></script>
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <script></script>

 `;

-exports[`js.html - parse5-verify 1`] = `
+exports[`js.html - html-verify 1`] = `
 <script type="text/javascript">
  var message = "Alert!";

@ -42,7 +42,7 @@ alert(message);

 `;

-exports[`simple.html - parse5-verify 1`] = `
+exports[`simple.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html>
  <head>
@ -81,7 +81,7 @@ exports[`simple.html - parse5-verify 1`] = `

 `;

-exports[`single-script.html - parse5-verify 1`] = `
+exports[`single-script.html - html-verify 1`] = `
 <script>alert('test');</script>
 <script>
  document.getElementById("demo").innerHTML = "Hello JavaScript!";
@ -96,7 +96,7 @@ document.getElementById("demo").innerHTML = "Hello JavaScript!";

 `;

-exports[`typescript.html - parse5-verify 1`] = `
+exports[`typescript.html - html-verify 1`] = `
 <script type="application/x-typescript">
  class Student {
    fullName: string;
--- a/tests/html_js/jsfmt.spec.js
+++ b/tests/html_js/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_prettier_ignore/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_prettier_ignore/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`document.html - parse5-verify 1`] = `
+exports[`document.html - html-verify 1`] = `
 <!doctype html>
 <html class="no-js" lang="en">
  <head>
@ -48,7 +48,7 @@ exports[`document.html - parse5-verify 1`] = `
 <!DOCTYPE html>
 <html class="no-js" lang="en">
  <head>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
    <title>Title</title>
  </head>
--- a/tests/html_prettier_ignore/jsfmt.spec.js
+++ b/tests/html_prettier_ignore/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_svg/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_svg/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`svg.html - parse5-verify 1`] = `
+exports[`svg.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html>
  <head>
@ -27,7 +27,7 @@ exports[`svg.html - parse5-verify 1`] = `
        stroke="green"
        stroke-width="4"
        fill="yellow"
-      ></circle>
+      />
    </svg>
  </body>
 </html>
--- a/tests/html_svg/jsfmt.spec.js
+++ b/tests/html_svg/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_symbol_entities/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_symbol_entities/snapshots/jsfmt.spec.js.snap
@ -1,12 +1,12 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`symbol_entitites.html - parse5-verify 1`] = `
+exports[`symbol_entitites.html - html-verify 1`] = `
 <p>I will display &euro;</p>
 <p>I will display &#8364;</p>
 <p>I will display &#x20AC;</p>
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-<p>I will display €</p>
-<p>I will display €</p>
-<p>I will display €</p>
+<p>I will display &euro;</p>
+<p>I will display &#8364;</p>
+<p>I will display &#x20AC;</p>

 `;
--- a/tests/html_symbol_entities/jsfmt.spec.js
+++ b/tests/html_symbol_entities/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_tags/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_tags/snapshots/jsfmt.spec.js.snap
@ -1,13 +1,26 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`case-sensitive.html - parse5-verify 1`] = `
+exports[`case-sensitive.html - html-verify 1`] = `
 <CaseSensitive CaseSensitive="true">hello world</CaseSensitive>
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <CaseSensitive CaseSensitive="true">hello world</CaseSensitive>

 `;

-exports[`pre.html - parse5-verify 1`] = `
+exports[`custom-self-closing.html - html-verify 1`] = `
+<div>
+  <ABC />
+  <span></span>
+</div>
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+<div>
+  <ABC />
+  <span></span>
+</div>
+
+`;
+
+exports[`pre.html - html-verify 1`] = `
 <pre>
 --------------------------------------------------------------------------------

@ -175,7 +188,7 @@ ___________________________

 `;

-exports[`tags.html - parse5-verify 1`] = `
+exports[`tags.html - html-verify 1`] = `
 <br/>
 <br />
 <br  />
@ -234,10 +247,10 @@ exports[`tags.html - parse5-verify 1`] = `
 <br
  very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-long-attribute
 />
-<br attribute-a="value">
-<br attribute-a="value">
-<br very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-long-attribute="value">
-<br very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-long-attribute="very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-long-value">
+<br attribute-a="value" />
+<br attribute-a="value" />
+<br very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-long-attribute="value" />
+<br very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-long-attribute="very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-very-long-value" />
 <br
  attribute-a="value"
  attribute-b="value"
@ -342,7 +355,7 @@ exports[`tags.html - parse5-verify 1`] = `

 `;

-exports[`textarea.html - parse5-verify 1`] = `
+exports[`textarea.html - html-verify 1`] = `
 <div>
  <div>
    <div>
@ -403,7 +416,7 @@ exports[`textarea.html - parse5-verify 1`] = `

 `;

-exports[`unsupported.html - parse5-verify 1`] = `
+exports[`unsupported.html - html-verify 1`] = `
 <center></center>
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 <center></center>
--- a/tests/html_tags/custom-self-closing.html
+++ b/tests/html_tags/custom-self-closing.html
@ -0,0 +1,4 @@
+<div>
+  <ABC />
+  <span></span>
+</div>
--- a/tests/html_tags/jsfmt.spec.js
+++ b/tests/html_tags/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/html_yaml/snapshots/jsfmt.spec.js.snap
+++ b/tests/html_yaml/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`invalid.html - parse5-verify 1`] = `
+exports[`invalid.html - html-verify 1`] = `
 ---
    invalid:
 invalid:
@ -22,7 +22,7 @@ invalid:

 `;

-exports[`yaml.html - parse5-verify 1`] = `
+exports[`yaml.html - html-verify 1`] = `
 ---
 hello:     world
 ---
--- a/tests/html_yaml/jsfmt.spec.js
+++ b/tests/html_yaml/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/multiparser_html_css/snapshots/jsfmt.spec.js.snap
+++ b/tests/multiparser_html_css/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`html-with-css-style.html - parse5-verify 1`] = `
+exports[`html-with-css-style.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html lang="en">
 <head>
--- a/tests/multiparser_html_css/jsfmt.spec.js
+++ b/tests/multiparser_html_css/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/multiparser_html_js/snapshots/jsfmt.spec.js.snap
+++ b/tests/multiparser_html_js/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`html-with-js-script.html - parse5-verify 1`] = `
+exports[`html-with-js-script.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html lang="en">
 <head>
--- a/tests/multiparser_html_js/jsfmt.spec.js
+++ b/tests/multiparser_html_js/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests/multiparser_html_ts/snapshots/jsfmt.spec.js.snap
+++ b/tests/multiparser_html_ts/snapshots/jsfmt.spec.js.snap
@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`html-with-ts-script.html - parse5-verify 1`] = `
+exports[`html-with-ts-script.html - html-verify 1`] = `
 <!DOCTYPE html>
 <html lang="en">
 <head>
--- a/tests/multiparser_html_ts/jsfmt.spec.js
+++ b/tests/multiparser_html_ts/jsfmt.spec.js
@ -1 +1 @@
-run_spec(__dirname, ["parse5"]);
+run_spec(__dirname, ["html"]);
--- a/tests_config/require_standalone.js
+++ b/tests_config/require_standalone.js
@ -10,8 +10,8 @@ const sources = [
  "parser-flow.js",
  "parser-glimmer.js",
  "parser-graphql.js",
+  "parser-html.js",
  "parser-markdown.js",
-  "parser-parse5.js",
  "parser-postcss.js",
  "parser-typescript.js",
  "parser-vue.js",
--- a/tests_integration/tests/snapshots/early-exit.js.snap
+++ b/tests_integration/tests/snapshots/early-exit.js.snap
@ -62,7 +62,7 @@ Format options:
  --no-bracket-spacing     Do not print spaces between brackets.
  --jsx-bracket-same-line  Put > on the last line instead of at a new line.
                           Defaults to false.
-  --parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml>
+  --parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml|html>
                           Which parser to use.
  --print-width <int>      The line length where Prettier will try wrap.
                           Defaults to 80.
@ -152,7 +152,7 @@ exports[`show warning with --help not-found (typo) (stderr) 1`] = `
 `;

 exports[`show warning with --help not-found (typo) (stdout) 1`] = `
-"--parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml>
+"--parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml|html>

  Which parser to use.

@ -172,6 +172,7 @@ Valid options:
  mdx              MDX
  vue              Vue
  yaml             YAML
+  html             HTML
 "
 `;

@ -198,7 +199,7 @@ Format options:
  --no-bracket-spacing     Do not print spaces between brackets.
  --jsx-bracket-same-line  Put > on the last line instead of at a new line.
                           Defaults to false.
-  --parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml>
+  --parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml|html>
                           Which parser to use.
  --print-width <int>      The line length where Prettier will try wrap.
                           Defaults to 80.
--- a/tests_integration/tests/snapshots/help-options.js.snap
+++ b/tests_integration/tests/snapshots/help-options.js.snap
@ -267,7 +267,7 @@ exports[`show detailed usage with --help no-semi (write) 1`] = `Array []`;
 exports[`show detailed usage with --help parser (stderr) 1`] = `""`;

 exports[`show detailed usage with --help parser (stdout) 1`] = `
-"--parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml>
+"--parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml|html>

  Which parser to use.

@ -287,6 +287,7 @@ Valid options:
  mdx              MDX
  vue              Vue
  yaml             YAML
+  html             HTML
 "
 `;

--- a/tests_integration/tests/snapshots/plugin-options.js.snap
+++ b/tests_integration/tests/snapshots/plugin-options.js.snap
@ -15,7 +15,7 @@ exports[` 1`] = `
 +                            Defaults to bar.
    --jsx-bracket-same-line  Put > on the last line instead of at a new line.
                             Defaults to false.
-    --parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml>
+    --parser <flow|babylon|typescript|css|less|scss|json|json5|json-stringify|graphql|markdown|mdx|vue|yaml|html>
                             Which parser to use.
    --print-width <int>      The line length where Prettier will try wrap."
 `;
--- a/tests_integration/tests/snapshots/schema.js.snap
+++ b/tests_integration/tests/snapshots/schema.js.snap
@ -146,6 +146,12 @@ This option cannot be used with --range-start and --range-end.",
                "yaml",
              ],
            },
+            Object {
+              "description": "HTML",
+              "enum": Array [
+                "html",
+              ],
+            },
          ],
        },
        "pluginSearchDirs": Object {
--- a/tests_integration/tests/snapshots/support-info.js.snap
+++ b/tests_integration/tests/snapshots/support-info.js.snap
@ -412,7 +412,16 @@ exports[`API getSupportInfo() with version 1.8.2 -> undefined 1`] = `
 - First value
 + Second value

-@@ -14,10 +14,16 @@
+@@ -8,16 +8,25 @@
+        \\"flow\\",
+      ],
+      \\"GraphQL\\": Array [
+        \\"graphql\\",
+      ],
+     \\"HTML\\": Array [
+       \\"html\\",
+     ],
+      \\"JSON\\": Array [
        \\"json\\",
      ],
      \\"JSON with Comments\\": Array [
@ -429,7 +438,7 @@ exports[`API getSupportInfo() with version 1.8.2 -> undefined 1`] = `
        \\"flow\\",
      ],
      \\"JavaScript\\": Array [
-@@ -25,10 +31,13 @@
+@@ -25,10 +34,13 @@
        \\"flow\\",
      ],
      \\"Less\\": Array [
@ -443,7 +452,7 @@ exports[`API getSupportInfo() with version 1.8.2 -> undefined 1`] = `
      ],
      \\"PostCSS\\": Array [
        \\"css\\",
-@@ -37,12 +46,26 @@
+@@ -37,12 +49,26 @@
        \\"scss\\",
      ],
      \\"TypeScript\\": Array [
@ -470,7 +479,7 @@ exports[`API getSupportInfo() with version 1.8.2 -> undefined 1`] = `
        \\"type\\": \\"boolean\\",
      },
      \\"cursorOffset\\": Object {
-@@ -73,16 +96,29 @@
+@@ -73,16 +99,30 @@
          \\"typescript\\",
          \\"css\\",
          \\"less\\",
@ -483,6 +492,7 @@ exports[`API getSupportInfo() with version 1.8.2 -> undefined 1`] = `
 +         \\"mdx\\",
 +         \\"vue\\",
 +         \\"yaml\\",
+         \\"html\\",
        ],
 -       \\"default\\": \\"babylon\\",
 +       \\"default\\": undefined,
@ -501,7 +511,7 @@ exports[`API getSupportInfo() with version 1.8.2 -> undefined 1`] = `
        \\"range\\": Object {
          \\"end\\": Infinity,
          \\"start\\": 0,
-@@ -90,14 +126,15 @@
+@@ -90,14 +130,15 @@
        },
        \\"type\\": \\"int\\",
      },
@ -812,6 +822,29 @@ exports[`CLI --support-info (stdout) 1`] = `
      \\"since\\": \\"1.15.0\\",
      \\"vscodeLanguageIds\\": [\\"mdx\\"]
    },
+    {
+      \\"aceMode\\": \\"html\\",
+      \\"aliases\\": [\\"xhtml\\"],
+      \\"codemirrorMimeType\\": \\"text/html\\",
+      \\"codemirrorMode\\": \\"htmlmixed\\",
+      \\"color\\": \\"#e34c26\\",
+      \\"extensions\\": [
+        \\".html\\",
+        \\".htm\\",
+        \\".html.hl\\",
+        \\".inc\\",
+        \\".st\\",
+        \\".xht\\",
+        \\".xhtml\\"
+      ],
+      \\"linguistLanguageId\\": 146,
+      \\"name\\": \\"HTML\\",
+      \\"parsers\\": [\\"html\\"],
+      \\"since\\": \\"1.15.0\\",
+      \\"tmScope\\": \\"text.html.basic\\",
+      \\"type\\": \\"markup\\",
+      \\"vscodeLanguageIds\\": [\\"html\\"]
+    },
    {
      \\"aceMode\\": \\"html\\",
      \\"color\\": \\"#2c3e50\\",
@ -940,7 +973,8 @@ exports[`CLI --support-info (stdout) 1`] = `
        { \\"description\\": \\"Markdown\\", \\"since\\": \\"1.8.0\\", \\"value\\": \\"markdown\\" },
        { \\"description\\": \\"MDX\\", \\"since\\": \\"1.15.0\\", \\"value\\": \\"mdx\\" },
        { \\"description\\": \\"Vue\\", \\"since\\": \\"1.10.0\\", \\"value\\": \\"vue\\" },
-        { \\"description\\": \\"YAML\\", \\"since\\": \\"1.14.0\\", \\"value\\": \\"yaml\\" }
+        { \\"description\\": \\"YAML\\", \\"since\\": \\"1.14.0\\", \\"value\\": \\"yaml\\" },
+        { \\"description\\": \\"HTML\\", \\"since\\": \\"1.15.0\\", \\"value\\": \\"html\\" }
      ],
      \\"description\\": \\"Which parser to use.\\",
      \\"name\\": \\"parser\\",
--- a/website/playground/codeSamples.js
+++ b/website/playground/codeSamples.js
@ -282,7 +282,7 @@ export default function(parser) {
        "            {{   body         }}",
        "</div> </div>"
      ].join("\n");
-    case "parse5":
+    case "html":
      return [
        "<!DOCTYPE html>",
        '<HTML CLASS="no-js mY-ClAsS">',
--- a/website/playground/markdown.js
+++ b/website/playground/markdown.js
@ -45,8 +45,6 @@ function getMarkdownSyntax(options) {
      return "jsonc";
    case "glimmer":
      return "hbs";
-    case "parse5":
-      return "html";
    default:
      return options.parser;
  }
--- a/website/static/service-worker.js
+++ b/website/static/service-worker.js
@ -12,8 +12,8 @@ toolbox.precache([
  "lib/parser-flow.js",
  "lib/parser-glimmer.js",
  "lib/parser-graphql.js",
+  "lib/parser-html.js",
  "lib/parser-markdown.js",
-  "lib/parser-parse5.js",
  "lib/parser-postcss.js",
  "lib/parser-typescript.js",
  "lib/parser-vue.js",
--- a/website/static/worker.js
+++ b/website/static/worker.js
@ -93,9 +93,9 @@ var parsers = {
  },

  // HTML
-  get parse5() {
-    importScriptOnce("lib/parser-parse5.js");
-    return prettierPlugins.parse5.parsers.parse5;
+  get html() {
+    importScriptOnce("lib/parser-html.js");
+    return prettierPlugins.html.parsers.html;
  }
 };

--- a/yarn.lock
+++ b/yarn.lock
@ -1766,16 +1766,44 @@ doctrine@^2.0.2, doctrine@^2.1.0:
  dependencies:
    esutils "^2.0.2"

+dom-serializer@0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
+  dependencies:
+    domelementtype "~1.1.1"
+    entities "~1.1.1"
+
 domain-browser@^1.1.1:
  version "1.1.7"
  resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.1.7.tgz#867aa4b093faa05f1de08c06f4d7b21fdf8698bc"

+domelementtype@1, domelementtype@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.3.0.tgz#b17aed82e8ab59e52dd9c19b1756e0fc187204c2"
+
+domelementtype@~1.1.1:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.1.3.tgz#bd28773e2642881aec51544924299c5cd822185b"
+
 domexception@^1.0.0:
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/domexception/-/domexception-1.0.1.tgz#937442644ca6a31261ef36e3ec677fe805582c90"
  dependencies:
    webidl-conversions "^4.0.2"

+domhandler@2.4.2, domhandler@^2.3.0:
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-2.4.2.tgz#8805097e933d65e85546f726d60f5eb88b44f803"
+  dependencies:
+    domelementtype "1"
+
+domutils@^1.5.1:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.7.0.tgz#56ea341e834e06e6748af7a1cb25da67ea9f8c2a"
+  dependencies:
+    dom-serializer "0"
+    domelementtype "1"
+
 ecc-jsbn@~0.1.1:
  version "0.1.1"
  resolved "https://registry.yarnpkg.com/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz#0fc73a9ed5f0d53c38193398523ef7e543777505"
@ -1836,6 +1864,10 @@ enhanced-resolve@^3.4.0:
    object-assign "^4.0.1"
    tapable "^0.2.7"

+entities@^1.1.1, entities@~1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.1.tgz#6e5c2d0a5621b5dadaecef80b90edfb5cd7772f0"
+
 errno@^0.1.3:
  version "0.1.4"
  resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.4.tgz#b896e23a9e5e8ba33871fc996abd3635fc9a1c7d"
@ -2717,6 +2749,17 @@ html-tag-names@1.1.2:
  version "1.1.2"
  resolved "https://registry.yarnpkg.com/html-tag-names/-/html-tag-names-1.1.2.tgz#f65168964c5a9c82675efda882875dcb2a875c22"

+htmlparser2@3.9.2:
+  version "3.9.2"
+  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.9.2.tgz#1bdf87acca0f3f9e53fa4fcceb0f4b4cbb00b338"
+  dependencies:
+    domelementtype "^1.3.0"
+    domhandler "^2.3.0"
+    domutils "^1.5.1"
+    entities "^1.1.1"
+    inherits "^2.0.1"
+    readable-stream "^2.0.2"
+
 http-signature@~1.1.0:
  version "1.1.1"
  resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.1.1.tgz#df72e267066cd0ac67fb76adf8e134a8fbcf91bf"
@ -4390,7 +4433,7 @@ parse5@4.0.0:
  version "4.0.0"
  resolved "https://registry.yarnpkg.com/parse5/-/parse5-4.0.0.tgz#6d78656e3da8d78b4ec0b906f7c08ef1dfe3f608"

-parse5@5.0.0, parse5@^5.0.0:
+parse5@^5.0.0:
  version "5.0.0"
  resolved "https://registry.yarnpkg.com/parse5/-/parse5-5.0.0.tgz#4d02710d44f3c3846197a11e205d4ef17842b81a"