@najemi-software/vitest-dom 0.7.0 → 0.8.0

package/dist/{chunk-LZZAJDBO.js → chunk-JWT7CU2B.js}

@@ -4,7 +4,12 @@ var __export = (target, all) => {
     __defProp(target, name, { get: all[name], enumerable: true });
 };
 
+// src/matchers/to-be-checked.js
+import { createRequire } from "module";
+
 // src/matchers/utils.ts
+import isEqual from "lodash-es/isEqual.js";
+import isFunction from "lodash-es/isFunction.js";
 import redent from "redent";
 
 // src/matchers/css-parse.js
@@ -36,9 +41,7 @@ function cssParse(css, options) {
   Position.prototype.content = css;
   let errorsList = [];
   function error(msg) {
-    let err = new Error(
-      options.source + ":" + lineno + ":" + column + ": " + msg
-    );
+    let err = new Error(options.source + ":" + lineno + ":" + column + ": " + msg);
     err.reason = msg;
     err.filename = options.source;
     err.line = lineno;
@@ -393,8 +396,6 @@ function addParent(obj, parent) {
 var css_parse_default = cssParse;
 
 // src/matchers/utils.ts
-import isEqual from "lodash-es/isEqual.js";
-import isFunction from "lodash-es/isFunction.js";
 var GenericTypeError = class extends Error {
   constructor(expectedString, received, matcherFn, context) {
     super();
@@ -404,23 +405,13 @@ var GenericTypeError = class extends Error {
     }
     let withType = "";
     try {
-      withType = printWithType(
-        "Received",
-        received,
-        context.utils.printReceived
-      );
+      withType = printWithType("Received", received, context.utils.printReceived);
     } catch (e) {
     }
     this.message = [
-      context.utils.matcherHint(
-        `${context.isNot ? ".not" : ""}.${matcherFn.name}`,
-        "received",
-        ""
-      ),
+      context.utils.matcherHint(`${context.isNot ? ".not" : ""}.${matcherFn.name}`, "received", ""),
       "",
-      `${context.utils.RECEIVED_COLOR(
-        "received"
-      )} value must ${expectedString}.`,
+      `${context.utils.RECEIVED_COLOR("received")} value must ${expectedString}.`,
       withType
     ].join("\n");
   }
@@ -496,13 +487,9 @@ function getMessage(context, matcher, expectedLabel, expectedValue, receivedLabe
     `${matcher}
 `,
     `${expectedLabel}:
-${context.utils.EXPECTED_COLOR(
-      redent(display(context, expectedValue), 2)
-    )}`,
+${context.utils.EXPECTED_COLOR(redent(display(context, expectedValue), 2))}`,
     `${receivedLabel}:
-${context.utils.RECEIVED_COLOR(
-      redent(display(context, receivedValue), 2)
-    )}`
+${context.utils.RECEIVED_COLOR(redent(display(context, receivedValue), 2))}`
   ].join("\n");
 }
 function matches(textToMatch, matcher) {
@@ -611,62 +598,107 @@ function getType(value) {
   throw new Error(`value of unknown type: ${value}`);
 }
 
-// src/matchers/to-be-in-the-dom.js
-function toBeInTheDOM(element, container) {
-  deprecate(
-    "toBeInTheDOM",
-    "Please use toBeInTheDocument for searching the entire document and toContainElement for searching a specific container."
-  );
-  if (element) {
-    checkHtmlElement(element, toBeInTheDOM, this);
-  }
-  if (container) {
-    checkHtmlElement(container, toBeInTheDOM, this);
+// src/matchers/to-be-checked.js
+var require2 = createRequire(import.meta.url);
+var { roles } = require2("aria-query");
+function toBeChecked(element) {
+  checkHtmlElement(element, toBeChecked, this);
+  const isValidInput = () => {
+    return element.tagName.toLowerCase() === "input" && ["checkbox", "radio"].includes(element.type);
+  };
+  const isValidAriaElement = () => {
+    return roleSupportsChecked(element.getAttribute("role")) && ["true", "false"].includes(element.getAttribute("aria-checked"));
+  };
+  if (!isValidInput() && !isValidAriaElement()) {
+    return {
+      pass: false,
+      message: () => `only inputs with type="checkbox" or type="radio" or elements with ${supportedRolesSentence()} and a valid aria-checked attribute can be used with .toBeChecked(). Use .toHaveValue() instead`
+    };
   }
+  const isChecked = () => {
+    if (isValidInput())
+      return element.checked;
+    return element.getAttribute("aria-checked") === "true";
+  };
   return {
-    pass: container ? container.contains(element) : !!element,
+    pass: isChecked(),
     message: () => {
+      const is = isChecked() ? "is" : "is not";
       return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeInTheDOM`,
-          "element",
-          ""
-        ),
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeChecked`, "element", ""),
         "",
-        "Received:",
-        `  ${this.utils.printReceived(
-          element ? element.cloneNode(false) : element
-        )}`
+        `Received element ${is} checked:`,
+        `  ${this.utils.printReceived(element.cloneNode(false))}`
       ].join("\n");
     }
   };
 }
+function supportedRolesSentence() {
+  return toSentence(
+    supportedRoles().map((role) => `role="${role}"`),
+    { lastWordConnector: " or " }
+  );
+}
+function supportedRoles() {
+  return roles.keys().filter(roleSupportsChecked);
+}
+function roleSupportsChecked(role) {
+  return roles.get(role)?.props["aria-checked"] !== void 0;
+}
 
-// src/matchers/to-be-in-the-document.js
-function toBeInTheDocument(element) {
-  if (element !== null || !this.isNot) {
-    checkHtmlElement(element, toBeInTheDocument, this);
-  }
-  const pass = element === null ? false : element.ownerDocument === element.getRootNode({ composed: true });
-  const errorFound = () => {
-    return `expected document not to contain element, found ${this.utils.stringify(
-      element.cloneNode(true)
-    )} instead`;
-  };
-  const errorNotFound = () => {
-    return `element could not be found in the document`;
+// src/matchers/to-be-disabled.js
+var FORM_TAGS = ["fieldset", "input", "select", "optgroup", "option", "button", "textarea"];
+function isFirstLegendChildOfFieldset(element, parent) {
+  return getTag(element) === "legend" && getTag(parent) === "fieldset" && element.isSameNode(Array.from(parent.children).find((child) => getTag(child) === "legend"));
+}
+function isElementDisabledByParent(element, parent) {
+  return isElementDisabled(parent) && !isFirstLegendChildOfFieldset(element, parent);
+}
+function isCustomElement(tag) {
+  return tag.includes("-");
+}
+function canElementBeDisabled(element) {
+  const tag = getTag(element);
+  return FORM_TAGS.includes(tag) || isCustomElement(tag);
+}
+function isElementDisabled(element) {
+  return canElementBeDisabled(element) && element.hasAttribute("disabled");
+}
+function isAncestorDisabled(element) {
+  const parent = element.parentElement;
+  return Boolean(parent) && (isElementDisabledByParent(element, parent) || isAncestorDisabled(parent));
+}
+function isElementOrAncestorDisabled(element) {
+  return canElementBeDisabled(element) && (isElementDisabled(element) || isAncestorDisabled(element));
+}
+function toBeDisabled(element) {
+  checkHtmlElement(element, toBeDisabled, this);
+  const isDisabled = isElementOrAncestorDisabled(element);
+  return {
+    pass: isDisabled,
+    message: () => {
+      const is = isDisabled ? "is" : "is not";
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeDisabled`, "element", ""),
+        "",
+        `Received element ${is} disabled:`,
+        `  ${this.utils.printReceived(element.cloneNode(false))}`
+      ].join("\n");
+    }
   };
+}
+function toBeEnabled(element) {
+  checkHtmlElement(element, toBeEnabled, this);
+  const isEnabled = !isElementOrAncestorDisabled(element);
   return {
-    pass,
+    pass: isEnabled,
     message: () => {
+      const is = isEnabled ? "is" : "is not";
       return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeInTheDocument`,
-          "element",
-          ""
-        ),
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeEnabled`, "element", ""),
         "",
-        this.utils.RECEIVED_COLOR(this.isNot ? errorFound() : errorNotFound())
+        `Received element ${is} enabled:`,
+        `  ${this.utils.printReceived(element.cloneNode(false))}`
       ].join("\n");
     }
   };
@@ -674,20 +706,13 @@ function toBeInTheDocument(element) {
 
 // src/matchers/to-be-empty.js
 function toBeEmpty(element) {
-  deprecate(
-    "toBeEmpty",
-    "Please use instead toBeEmptyDOMElement for finding empty nodes in the DOM."
-  );
+  deprecate("toBeEmpty", "Please use instead toBeEmptyDOMElement for finding empty nodes in the DOM.");
   checkHtmlElement(element, toBeEmpty, this);
   return {
     pass: element.innerHTML === "",
     message: () => {
       return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeEmpty`,
-          "element",
-          ""
-        ),
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeEmpty`, "element", ""),
         "",
         "Received:",
         `  ${this.utils.printReceived(element.innerHTML)}`
@@ -703,11 +728,7 @@ function toBeEmptyDOMElement(element) {
     pass: isEmptyElement(element),
     message: () => {
       return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeEmptyDOMElement`,
-          "element",
-          ""
-        ),
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeEmptyDOMElement`, "element", ""),
         "",
         "Received:",
         `  ${this.utils.printReceived(element.innerHTML)}`
@@ -716,111 +737,274 @@ function toBeEmptyDOMElement(element) {
   };
 }
 function isEmptyElement(element) {
-  const nonCommentChildNodes = [...element.childNodes].filter(
-    (node) => node.nodeType !== 8
-  );
+  const nonCommentChildNodes = [...element.childNodes].filter((node) => node.nodeType !== 8);
   return nonCommentChildNodes.length === 0;
 }
 
-// src/matchers/to-contain-element.js
-function toContainElement(container, element) {
-  checkHtmlElement(container, toContainElement, this);
-  if (element !== null) {
-    checkHtmlElement(element, toContainElement, this);
+// src/matchers/to-be-in-the-document.js
+function toBeInTheDocument(element) {
+  if (element !== null || !this.isNot) {
+    checkHtmlElement(element, toBeInTheDocument, this);
   }
+  const pass = element === null ? false : element.ownerDocument === element.getRootNode({ composed: true });
+  const errorFound = () => {
+    return `expected document not to contain element, found ${this.utils.stringify(
+      element.cloneNode(true)
+    )} instead`;
+  };
+  const errorNotFound = () => {
+    return `element could not be found in the document`;
+  };
   return {
-    pass: container.contains(element),
+    pass,
     message: () => {
       return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toContainElement`,
-          "element",
-          "element"
-        ),
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeInTheDocument`, "element", ""),
         "",
-        this.utils.RECEIVED_COLOR(`${this.utils.stringify(
-          container.cloneNode(false)
-        )} ${this.isNot ? "contains:" : "does not contain:"} ${this.utils.stringify(element ? element.cloneNode(false) : element)}
-        `)
+        this.utils.RECEIVED_COLOR(this.isNot ? errorFound() : errorNotFound())
       ].join("\n");
     }
   };
 }
 
-// src/matchers/to-contain-html.js
-function getNormalizedHtml(container, htmlText) {
-  const div = container.ownerDocument.createElement("div");
-  div.innerHTML = htmlText;
-  return div.innerHTML;
-}
-function toContainHTML(container, htmlText) {
-  checkHtmlElement(container, toContainHTML, this);
-  if (typeof htmlText !== "string") {
-    throw new Error(`.toContainHTML() expects a string value, got ${htmlText}`);
+// src/matchers/to-be-in-the-dom.js
+function toBeInTheDOM(element, container) {
+  deprecate(
+    "toBeInTheDOM",
+    "Please use toBeInTheDocument for searching the entire document and toContainElement for searching a specific container."
+  );
+  if (element) {
+    checkHtmlElement(element, toBeInTheDOM, this);
+  }
+  if (container) {
+    checkHtmlElement(container, toBeInTheDOM, this);
   }
   return {
-    pass: container.outerHTML.includes(getNormalizedHtml(container, htmlText)),
+    pass: container ? container.contains(element) : !!element,
     message: () => {
       return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toContainHTML`,
-          "element",
-          ""
-        ),
-        "Expected:",
-        `  ${this.utils.EXPECTED_COLOR(htmlText)}`,
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeInTheDOM`, "element", ""),
+        "",
         "Received:",
-        `  ${this.utils.printReceived(container.cloneNode(true))}`
+        `  ${this.utils.printReceived(element ? element.cloneNode(false) : element)}`
       ].join("\n");
     }
   };
 }
 
-// src/matchers/to-have-text-content.js
-function toHaveTextContent(node, checkWith, options = { normalizeWhitespace: true }) {
-  checkNode(node, toHaveTextContent, this);
-  const textContent = options.normalizeWhitespace ? normalize(node.textContent) : node.textContent.replace(/\u00a0/g, " ");
-  const checkingWithEmptyString = textContent !== "" && checkWith === "";
+// src/matchers/to-be-invalid.js
+var FORM_TAGS2 = ["form", "input", "select", "textarea"];
+function isElementHavingAriaInvalid(element) {
+  return element.hasAttribute("aria-invalid") && element.getAttribute("aria-invalid") !== "false";
+}
+function isSupportsValidityMethod(element) {
+  return FORM_TAGS2.includes(getTag(element));
+}
+function isElementInvalid(element) {
+  const isHaveAriaInvalid = isElementHavingAriaInvalid(element);
+  if (isSupportsValidityMethod(element)) {
+    return isHaveAriaInvalid || !element.checkValidity();
+  } else {
+    return isHaveAriaInvalid;
+  }
+}
+function toBeInvalid(element) {
+  checkHtmlElement(element, toBeInvalid, this);
+  const isInvalid = isElementInvalid(element);
   return {
-    pass: !checkingWithEmptyString && matches(textContent, checkWith),
+    pass: isInvalid,
     message: () => {
-      const to = this.isNot ? "not to" : "to";
-      return getMessage(
-        this,
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toHaveTextContent`,
-          "element",
-          ""
-        ),
-        checkingWithEmptyString ? `Checking with empty string will always match, use .toBeEmptyDOMElement() instead` : `Expected element ${to} have text content`,
-        checkWith,
-        "Received",
-        textContent
-      );
+      const is = isInvalid ? "is" : "is not";
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeInvalid`, "element", ""),
+        "",
+        `Received element ${is} currently invalid:`,
+        `  ${this.utils.printReceived(element.cloneNode(false))}`
+      ].join("\n");
     }
   };
 }
-
-// src/matchers/to-have-accessible-description.js
-import { computeAccessibleDescription } from "dom-accessibility-api";
-function toHaveAccessibleDescription(htmlElement, expectedAccessibleDescription) {
-  checkHtmlElement(htmlElement, toHaveAccessibleDescription, this);
-  const actualAccessibleDescription = computeAccessibleDescription(htmlElement);
-  const missingExpectedValue = arguments.length === 1;
-  let pass = false;
-  if (missingExpectedValue) {
-    pass = actualAccessibleDescription !== "";
-  } else {
-    pass = expectedAccessibleDescription instanceof RegExp ? expectedAccessibleDescription.test(actualAccessibleDescription) : this.equals(
-      actualAccessibleDescription,
-      expectedAccessibleDescription
-    );
-  }
+function toBeValid(element) {
+  checkHtmlElement(element, toBeValid, this);
+  const isValid = !isElementInvalid(element);
   return {
-    pass,
+    pass: isValid,
     message: () => {
-      const to = this.isNot ? "not to" : "to";
-      return getMessage(
+      const is = isValid ? "is" : "is not";
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeValid`, "element", ""),
+        "",
+        `Received element ${is} currently valid:`,
+        `  ${this.utils.printReceived(element.cloneNode(false))}`
+      ].join("\n");
+    }
+  };
+}
+
+// src/matchers/to-be-partially-checked.js
+function toBePartiallyChecked(element) {
+  checkHtmlElement(element, toBePartiallyChecked, this);
+  const isValidInput = () => {
+    return element.tagName.toLowerCase() === "input" && element.type === "checkbox";
+  };
+  const isValidAriaElement = () => {
+    return element.getAttribute("role") === "checkbox";
+  };
+  if (!isValidInput() && !isValidAriaElement()) {
+    return {
+      pass: false,
+      message: () => 'only inputs with type="checkbox" or elements with role="checkbox" and a valid aria-checked attribute can be used with .toBePartiallyChecked(). Use .toHaveValue() instead'
+    };
+  }
+  const isPartiallyChecked = () => {
+    const isAriaMixed = element.getAttribute("aria-checked") === "mixed";
+    if (isValidInput()) {
+      return element.indeterminate || isAriaMixed;
+    }
+    return isAriaMixed;
+  };
+  return {
+    pass: isPartiallyChecked(),
+    message: () => {
+      const is = isPartiallyChecked() ? "is" : "is not";
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBePartiallyChecked`, "element", ""),
+        "",
+        `Received element ${is} partially checked:`,
+        `  ${this.utils.printReceived(element.cloneNode(false))}`
+      ].join("\n");
+    }
+  };
+}
+
+// src/matchers/to-be-required.js
+var FORM_TAGS3 = ["select", "textarea"];
+var ARIA_FORM_TAGS = ["input", "select", "textarea"];
+var UNSUPPORTED_INPUT_TYPES = ["color", "hidden", "range", "submit", "image", "reset"];
+var SUPPORTED_ARIA_ROLES = ["combobox", "gridcell", "radiogroup", "spinbutton", "tree"];
+function isRequiredOnFormTagsExceptInput(element) {
+  return FORM_TAGS3.includes(getTag(element)) && element.hasAttribute("required");
+}
+function isRequiredOnSupportedInput(element) {
+  return getTag(element) === "input" && element.hasAttribute("required") && (element.hasAttribute("type") && !UNSUPPORTED_INPUT_TYPES.includes(element.getAttribute("type")) || !element.hasAttribute("type"));
+}
+function isElementRequiredByARIA(element) {
+  return element.hasAttribute("aria-required") && element.getAttribute("aria-required") === "true" && (ARIA_FORM_TAGS.includes(getTag(element)) || element.hasAttribute("role") && SUPPORTED_ARIA_ROLES.includes(element.getAttribute("role")));
+}
+function toBeRequired(element) {
+  checkHtmlElement(element, toBeRequired, this);
+  const isRequired = isRequiredOnFormTagsExceptInput(element) || isRequiredOnSupportedInput(element) || isElementRequiredByARIA(element);
+  return {
+    pass: isRequired,
+    message: () => {
+      const is = isRequired ? "is" : "is not";
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeRequired`, "element", ""),
+        "",
+        `Received element ${is} required:`,
+        `  ${this.utils.printReceived(element.cloneNode(false))}`
+      ].join("\n");
+    }
+  };
+}
+
+// src/matchers/to-be-visible.js
+function isStyleVisible(element) {
+  const { getComputedStyle } = element.ownerDocument.defaultView;
+  const { display: display2, visibility, opacity } = getComputedStyle(element);
+  return display2 !== "none" && visibility !== "hidden" && visibility !== "collapse" && opacity !== "0" && opacity !== 0;
+}
+function isAttributeVisible(element, previousElement) {
+  let detailsVisibility;
+  if (previousElement) {
+    detailsVisibility = element.nodeName === "DETAILS" && previousElement.nodeName !== "SUMMARY" ? element.hasAttribute("open") : true;
+  } else {
+    detailsVisibility = element.nodeName === "DETAILS" ? element.hasAttribute("open") : true;
+  }
+  return !element.hasAttribute("hidden") && detailsVisibility;
+}
+function isElementVisible(element, previousElement) {
+  return isStyleVisible(element) && isAttributeVisible(element, previousElement) && (!element.parentElement || isElementVisible(element.parentElement, element));
+}
+function toBeVisible(element) {
+  checkHtmlElement(element, toBeVisible, this);
+  const isInDocument = element.ownerDocument === element.getRootNode({ composed: true });
+  const isVisible = isInDocument && isElementVisible(element);
+  return {
+    pass: isVisible,
+    message: () => {
+      const is = isVisible ? "is" : "is not";
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toBeVisible`, "element", ""),
+        "",
+        `Received element ${is} visible${isInDocument ? "" : " (element is not in the document)"}:`,
+        `  ${this.utils.printReceived(element.cloneNode(false))}`
+      ].join("\n");
+    }
+  };
+}
+
+// src/matchers/to-contain-element.js
+function toContainElement(container, element) {
+  checkHtmlElement(container, toContainElement, this);
+  if (element !== null) {
+    checkHtmlElement(element, toContainElement, this);
+  }
+  return {
+    pass: container.contains(element),
+    message: () => {
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toContainElement`, "element", "element"),
+        "",
+        this.utils.RECEIVED_COLOR(`${this.utils.stringify(container.cloneNode(false))} ${this.isNot ? "contains:" : "does not contain:"} ${this.utils.stringify(element ? element.cloneNode(false) : element)}
+        `)
+      ].join("\n");
+    }
+  };
+}
+
+// src/matchers/to-contain-html.js
+function getNormalizedHtml(container, htmlText) {
+  const div = container.ownerDocument.createElement("div");
+  div.innerHTML = htmlText;
+  return div.innerHTML;
+}
+function toContainHTML(container, htmlText) {
+  checkHtmlElement(container, toContainHTML, this);
+  if (typeof htmlText !== "string") {
+    throw new Error(`.toContainHTML() expects a string value, got ${htmlText}`);
+  }
+  return {
+    pass: container.outerHTML.includes(getNormalizedHtml(container, htmlText)),
+    message: () => {
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toContainHTML`, "element", ""),
+        "Expected:",
+        `  ${this.utils.EXPECTED_COLOR(htmlText)}`,
+        "Received:",
+        `  ${this.utils.printReceived(container.cloneNode(true))}`
+      ].join("\n");
+    }
+  };
+}
+
+// src/matchers/to-have-accessible-description.js
+import { computeAccessibleDescription } from "dom-accessibility-api";
+function toHaveAccessibleDescription(htmlElement, expectedAccessibleDescription) {
+  checkHtmlElement(htmlElement, toHaveAccessibleDescription, this);
+  const actualAccessibleDescription = computeAccessibleDescription(htmlElement);
+  const missingExpectedValue = arguments.length === 1;
+  let pass = false;
+  if (missingExpectedValue) {
+    pass = actualAccessibleDescription !== "";
+  } else {
+    pass = expectedAccessibleDescription instanceof RegExp ? expectedAccessibleDescription.test(actualAccessibleDescription) : this.equals(actualAccessibleDescription, expectedAccessibleDescription);
+  }
+  return {
+    pass,
+    message: () => {
+      const to = this.isNot ? "not to" : "to";
+      return getMessage(
         this,
         this.utils.matcherHint(
           `${this.isNot ? ".not" : ""}.${toHaveAccessibleDescription.name}`,
@@ -891,11 +1075,7 @@ function toHaveAttribute(htmlElement, name, expectedValue) {
         this.utils.printExpected(name),
         {
           secondArgument: isExpectedValuePresent ? this.utils.printExpected(expectedValue) : void 0,
-          comment: getAttributeComment(
-            this.utils.stringify,
-            name,
-            expectedValue
-          )
+          comment: getAttributeComment(this.utils.stringify, name, expectedValue)
         }
       );
       return getMessage(
@@ -993,587 +1173,76 @@ function toHaveClass(htmlElement, ...params) {
   };
 }
 
-// src/matchers/to-have-style.js
-import chalk from "chalk";
-function getStyleDeclaration(document, css) {
-  const styles = {};
-  const copy = document.createElement("div");
-  Object.keys(css).forEach((property) => {
-    copy.style[property] = css[property];
-    styles[property] = copy.style[property];
-  });
-  return styles;
-}
-function isSubset2(styles, computedStyle) {
-  return !!Object.keys(styles).length && Object.entries(styles).every(
-    ([prop, value]) => computedStyle[prop] === value || computedStyle.getPropertyValue(prop.toLowerCase()) === value
-  );
-}
-function printoutStyles(styles) {
-  return Object.keys(styles).sort().map((prop) => `${prop}: ${styles[prop]};`).join("\n");
-}
-function expectedDiff(diffFn, expected, computedStyles) {
-  const received = Array.from(computedStyles).filter((prop) => expected[prop] !== void 0).reduce(
-    (obj, prop) => Object.assign(obj, { [prop]: computedStyles.getPropertyValue(prop) }),
-    {}
-  );
-  const diffOutput = diffFn(printoutStyles(expected), printoutStyles(received));
-  return diffOutput.replace(`${chalk.red("+ Received")}
-`, "");
-}
-function toHaveStyle(htmlElement, css) {
-  checkHtmlElement(htmlElement, toHaveStyle, this);
-  const parsedCSS = typeof css === "object" ? css : parseCSS(css, toHaveStyle, this);
-  const { getComputedStyle } = htmlElement.ownerDocument.defaultView;
-  const expected = getStyleDeclaration(htmlElement.ownerDocument, parsedCSS);
-  const received = getComputedStyle(htmlElement);
-  return {
-    pass: isSubset2(expected, received),
-    message: () => {
-      const matcher = `${this.isNot ? ".not" : ""}.toHaveStyle`;
-      return [
-        this.utils.matcherHint(matcher, "element", ""),
-        expectedDiff(this.utils.diff, expected, received)
-      ].join("\n\n");
-    }
-  };
-}
-
-// src/matchers/to-have-focus.js
-function toHaveFocus(element) {
-  checkHtmlElement(element, toHaveFocus, this);
+// src/matchers/to-have-description.js
+function toHaveDescription(htmlElement, checkWith) {
+  deprecate("toHaveDescription", "Please use toHaveAccessibleDescription.");
+  checkHtmlElement(htmlElement, toHaveDescription, this);
+  const expectsDescription = checkWith !== void 0;
+  const descriptionIDRaw = htmlElement.getAttribute("aria-describedby") || "";
+  const descriptionIDs = descriptionIDRaw.split(/\s+/).filter(Boolean);
+  let description = "";
+  if (descriptionIDs.length > 0) {
+    const document = htmlElement.ownerDocument;
+    const descriptionEls = descriptionIDs.map((descriptionID) => document.getElementById(descriptionID)).filter(Boolean);
+    description = normalize(descriptionEls.map((el) => el.textContent).join(" "));
+  }
   return {
-    pass: element.ownerDocument.activeElement === element,
+    pass: expectsDescription ? checkWith instanceof RegExp ? checkWith.test(description) : this.equals(description, checkWith) : Boolean(description),
     message: () => {
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toHaveFocus`,
-          "element",
-          ""
-        ),
-        "",
-        ...this.isNot ? [
-          "Received element is focused:",
-          `  ${this.utils.printReceived(element)}`
-        ] : [
-          "Expected element with focus:",
-          `  ${this.utils.printExpected(element)}`,
-          "Received element with focus:",
-          `  ${this.utils.printReceived(
-            element.ownerDocument.activeElement
-          )}`
-        ]
-      ].join("\n");
+      const to = this.isNot ? "not to" : "to";
+      return getMessage(
+        this,
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toHaveDescription`, "element", ""),
+        `Expected the element ${to} have description`,
+        this.utils.printExpected(checkWith),
+        "Received",
+        this.utils.printReceived(description)
+      );
     }
   };
 }
 
-// src/matchers/to-have-form-values.ts
-import escape from "css.escape";
-import { isEqualWith, uniq } from "lodash-es";
-function getMultiElementValue(elements) {
-  const types = uniq(elements.map((element) => element.type));
-  if (types.length !== 1) {
+// src/matchers/to-have-display-value.js
+function toHaveDisplayValue(htmlElement, expectedValue) {
+  checkHtmlElement(htmlElement, toHaveDisplayValue, this);
+  const tagName = htmlElement.tagName.toLowerCase();
+  if (!["select", "input", "textarea"].includes(tagName)) {
     throw new Error(
-      "Multiple form elements with the same name must be of the same type"
-    );
-  }
-  switch (types[0]) {
-    case "radio": {
-      const theChosenOne = elements.find((radio) => radio.checked);
-      return theChosenOne ? theChosenOne.value : void 0;
-    }
-    case "checkbox":
-      return elements.filter((checkbox) => checkbox.checked).map((checkbox) => checkbox.value);
-    default:
-      return elements.map((element) => element.value);
-  }
-}
-function getFormValue(container, name) {
-  container.elements;
-  const elements = [
-    ...container.querySelectorAll(`[name="${escape(name)}"]`)
-  ];
-  if (elements.length === 0) {
-    return void 0;
-  }
-  switch (elements.length) {
-    case 1:
-      return getSingleElementValue(elements[0]);
-    default:
-      return getMultiElementValue(elements);
-  }
-}
-function getPureName(name) {
-  return /\[\]$/.test(name) ? name.slice(0, -2) : name;
-}
-function getAllFormValues(container) {
-  const names = Array.from(container.elements).map(
-    (element) => element.name
-  );
-  return names.reduce(
-    (obj, name) => ({
-      ...obj,
-      [getPureName(name)]: getFormValue(container, name)
-    }),
-    {}
-  );
-}
-function toHaveFormValues(formElement, expectedValues) {
-  checkHtmlElement(formElement, toHaveFormValues, this);
-  if (!formElement.elements) {
-    throw new Error("toHaveFormValues must be called on a form or a fieldset");
-  }
-  const formValues = getAllFormValues(formElement);
-  return {
-    pass: Object.entries(expectedValues).every(
-      ([name, expectedValue]) => isEqualWith(formValues[name], expectedValue, compareArraysAsSet)
-    ),
-    message: () => {
-      const to = this.isNot ? "not to" : "to";
-      const matcher = `${this.isNot ? ".not" : ""}.toHaveFormValues`;
-      const commonKeyValues = Object.keys(formValues).filter((key) => expectedValues.hasOwnProperty(key)).reduce((obj, key) => ({ ...obj, [key]: formValues[key] }), {});
-      return [
-        this.utils.matcherHint(matcher, "element", ""),
-        `Expected the element ${to} have form values`,
-        this.utils.diff(expectedValues, commonKeyValues)
-      ].join("\n\n");
-    }
-  };
-}
-
-// src/matchers/to-be-visible.js
-function isStyleVisible(element) {
-  const { getComputedStyle } = element.ownerDocument.defaultView;
-  const { display: display2, visibility, opacity } = getComputedStyle(element);
-  return display2 !== "none" && visibility !== "hidden" && visibility !== "collapse" && opacity !== "0" && opacity !== 0;
-}
-function isAttributeVisible(element, previousElement) {
-  let detailsVisibility;
-  if (previousElement) {
-    detailsVisibility = element.nodeName === "DETAILS" && previousElement.nodeName !== "SUMMARY" ? element.hasAttribute("open") : true;
-  } else {
-    detailsVisibility = element.nodeName === "DETAILS" ? element.hasAttribute("open") : true;
-  }
-  return !element.hasAttribute("hidden") && detailsVisibility;
-}
-function isElementVisible(element, previousElement) {
-  return isStyleVisible(element) && isAttributeVisible(element, previousElement) && (!element.parentElement || isElementVisible(element.parentElement, element));
-}
-function toBeVisible(element) {
-  checkHtmlElement(element, toBeVisible, this);
-  const isInDocument = element.ownerDocument === element.getRootNode({ composed: true });
-  const isVisible = isInDocument && isElementVisible(element);
-  return {
-    pass: isVisible,
-    message: () => {
-      const is = isVisible ? "is" : "is not";
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeVisible`,
-          "element",
-          ""
-        ),
-        "",
-        `Received element ${is} visible${isInDocument ? "" : " (element is not in the document)"}:`,
-        `  ${this.utils.printReceived(element.cloneNode(false))}`
-      ].join("\n");
-    }
-  };
-}
-
-// src/matchers/to-be-disabled.js
-var FORM_TAGS = [
-  "fieldset",
-  "input",
-  "select",
-  "optgroup",
-  "option",
-  "button",
-  "textarea"
-];
-function isFirstLegendChildOfFieldset(element, parent) {
-  return getTag(element) === "legend" && getTag(parent) === "fieldset" && element.isSameNode(
-    Array.from(parent.children).find((child) => getTag(child) === "legend")
-  );
-}
-function isElementDisabledByParent(element, parent) {
-  return isElementDisabled(parent) && !isFirstLegendChildOfFieldset(element, parent);
-}
-function isCustomElement(tag) {
-  return tag.includes("-");
-}
-function canElementBeDisabled(element) {
-  const tag = getTag(element);
-  return FORM_TAGS.includes(tag) || isCustomElement(tag);
-}
-function isElementDisabled(element) {
-  return canElementBeDisabled(element) && element.hasAttribute("disabled");
-}
-function isAncestorDisabled(element) {
-  const parent = element.parentElement;
-  return Boolean(parent) && (isElementDisabledByParent(element, parent) || isAncestorDisabled(parent));
-}
-function isElementOrAncestorDisabled(element) {
-  return canElementBeDisabled(element) && (isElementDisabled(element) || isAncestorDisabled(element));
-}
-function toBeDisabled(element) {
-  checkHtmlElement(element, toBeDisabled, this);
-  const isDisabled = isElementOrAncestorDisabled(element);
-  return {
-    pass: isDisabled,
-    message: () => {
-      const is = isDisabled ? "is" : "is not";
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeDisabled`,
-          "element",
-          ""
-        ),
-        "",
-        `Received element ${is} disabled:`,
-        `  ${this.utils.printReceived(element.cloneNode(false))}`
-      ].join("\n");
-    }
-  };
-}
-function toBeEnabled(element) {
-  checkHtmlElement(element, toBeEnabled, this);
-  const isEnabled = !isElementOrAncestorDisabled(element);
-  return {
-    pass: isEnabled,
-    message: () => {
-      const is = isEnabled ? "is" : "is not";
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeEnabled`,
-          "element",
-          ""
-        ),
-        "",
-        `Received element ${is} enabled:`,
-        `  ${this.utils.printReceived(element.cloneNode(false))}`
-      ].join("\n");
-    }
-  };
-}
-
-// src/matchers/to-be-required.js
-var FORM_TAGS2 = ["select", "textarea"];
-var ARIA_FORM_TAGS = ["input", "select", "textarea"];
-var UNSUPPORTED_INPUT_TYPES = [
-  "color",
-  "hidden",
-  "range",
-  "submit",
-  "image",
-  "reset"
-];
-var SUPPORTED_ARIA_ROLES = [
-  "combobox",
-  "gridcell",
-  "radiogroup",
-  "spinbutton",
-  "tree"
-];
-function isRequiredOnFormTagsExceptInput(element) {
-  return FORM_TAGS2.includes(getTag(element)) && element.hasAttribute("required");
-}
-function isRequiredOnSupportedInput(element) {
-  return getTag(element) === "input" && element.hasAttribute("required") && (element.hasAttribute("type") && !UNSUPPORTED_INPUT_TYPES.includes(element.getAttribute("type")) || !element.hasAttribute("type"));
-}
-function isElementRequiredByARIA(element) {
-  return element.hasAttribute("aria-required") && element.getAttribute("aria-required") === "true" && (ARIA_FORM_TAGS.includes(getTag(element)) || element.hasAttribute("role") && SUPPORTED_ARIA_ROLES.includes(element.getAttribute("role")));
-}
-function toBeRequired(element) {
-  checkHtmlElement(element, toBeRequired, this);
-  const isRequired = isRequiredOnFormTagsExceptInput(element) || isRequiredOnSupportedInput(element) || isElementRequiredByARIA(element);
-  return {
-    pass: isRequired,
-    message: () => {
-      const is = isRequired ? "is" : "is not";
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeRequired`,
-          "element",
-          ""
-        ),
-        "",
-        `Received element ${is} required:`,
-        `  ${this.utils.printReceived(element.cloneNode(false))}`
-      ].join("\n");
-    }
-  };
-}
-
-// src/matchers/to-be-invalid.js
-var FORM_TAGS3 = ["form", "input", "select", "textarea"];
-function isElementHavingAriaInvalid(element) {
-  return element.hasAttribute("aria-invalid") && element.getAttribute("aria-invalid") !== "false";
-}
-function isSupportsValidityMethod(element) {
-  return FORM_TAGS3.includes(getTag(element));
-}
-function isElementInvalid(element) {
-  const isHaveAriaInvalid = isElementHavingAriaInvalid(element);
-  if (isSupportsValidityMethod(element)) {
-    return isHaveAriaInvalid || !element.checkValidity();
-  } else {
-    return isHaveAriaInvalid;
-  }
-}
-function toBeInvalid(element) {
-  checkHtmlElement(element, toBeInvalid, this);
-  const isInvalid = isElementInvalid(element);
-  return {
-    pass: isInvalid,
-    message: () => {
-      const is = isInvalid ? "is" : "is not";
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeInvalid`,
-          "element",
-          ""
-        ),
-        "",
-        `Received element ${is} currently invalid:`,
-        `  ${this.utils.printReceived(element.cloneNode(false))}`
-      ].join("\n");
-    }
-  };
-}
-function toBeValid(element) {
-  checkHtmlElement(element, toBeValid, this);
-  const isValid = !isElementInvalid(element);
-  return {
-    pass: isValid,
-    message: () => {
-      const is = isValid ? "is" : "is not";
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeValid`,
-          "element",
-          ""
-        ),
-        "",
-        `Received element ${is} currently valid:`,
-        `  ${this.utils.printReceived(element.cloneNode(false))}`
-      ].join("\n");
-    }
-  };
-}
-
-// src/matchers/to-have-value.js
-import { isEqualWith as isEqualWith2 } from "lodash-es";
-function toHaveValue(htmlElement, expectedValue) {
-  checkHtmlElement(htmlElement, toHaveValue, this);
-  if (htmlElement.tagName.toLowerCase() === "input" && ["checkbox", "radio"].includes(htmlElement.type)) {
-    throw new Error(
-      "input with type=checkbox or type=radio cannot be used with .toHaveValue(). Use .toBeChecked() for type=checkbox or .toHaveFormValues() instead"
-    );
-  }
-  const receivedValue = getSingleElementValue(htmlElement);
-  const expectsValue = expectedValue !== void 0;
-  let expectedTypedValue = expectedValue;
-  let receivedTypedValue = receivedValue;
-  if (expectedValue == receivedValue && expectedValue !== receivedValue) {
-    expectedTypedValue = `${expectedValue} (${typeof expectedValue})`;
-    receivedTypedValue = `${receivedValue} (${typeof receivedValue})`;
-  }
-  return {
-    pass: expectsValue ? isEqualWith2(receivedValue, expectedValue, compareArraysAsSet) : Boolean(receivedValue),
-    message: () => {
-      const to = this.isNot ? "not to" : "to";
-      const matcher = this.utils.matcherHint(
-        `${this.isNot ? ".not" : ""}.toHaveValue`,
-        "element",
-        expectedValue
-      );
-      return getMessage(
-        this,
-        matcher,
-        `Expected the element ${to} have value`,
-        expectsValue ? expectedTypedValue : "(any)",
-        "Received",
-        receivedTypedValue
-      );
-    }
-  };
-}
-
-// src/matchers/to-have-display-value.js
-function toHaveDisplayValue(htmlElement, expectedValue) {
-  checkHtmlElement(htmlElement, toHaveDisplayValue, this);
-  const tagName = htmlElement.tagName.toLowerCase();
-  if (!["select", "input", "textarea"].includes(tagName)) {
-    throw new Error(
-      ".toHaveDisplayValue() currently supports only input, textarea or select elements, try with another matcher instead."
+      ".toHaveDisplayValue() currently supports only input, textarea or select elements, try with another matcher instead."
     );
   }
   if (tagName === "input" && ["radio", "checkbox"].includes(htmlElement.type)) {
     throw new Error(
-      `.toHaveDisplayValue() currently does not support input[type="${htmlElement.type}"], try with another matcher instead.`
-    );
-  }
-  const values = getValues(tagName, htmlElement);
-  const expectedValues = getExpectedValues(expectedValue);
-  const numberOfMatchesWithValues = expectedValues.filter(
-    (expected) => values.some(
-      (value) => expected instanceof RegExp ? expected.test(value) : this.equals(value, String(expected))
-    )
-  ).length;
-  const matchedWithAllValues = numberOfMatchesWithValues === values.length;
-  const matchedWithAllExpectedValues = numberOfMatchesWithValues === expectedValues.length;
-  return {
-    pass: matchedWithAllValues && matchedWithAllExpectedValues,
-    message: () => getMessage(
-      this,
-      this.utils.matcherHint(
-        `${this.isNot ? ".not" : ""}.toHaveDisplayValue`,
-        "element",
-        ""
-      ),
-      `Expected element ${this.isNot ? "not " : ""}to have display value`,
-      expectedValue,
-      "Received",
-      values
-    )
-  };
-}
-function getValues(tagName, htmlElement) {
-  return tagName === "select" ? Array.from(htmlElement).filter((option) => option.selected).map((option) => option.textContent) : [htmlElement.value];
-}
-function getExpectedValues(expectedValue) {
-  return expectedValue instanceof Array ? expectedValue : [expectedValue];
-}
-
-// src/matchers/to-be-checked.js
-import { createRequire } from "module";
-var require2 = createRequire(import.meta.url);
-var { roles } = require2("aria-query");
-function toBeChecked(element) {
-  checkHtmlElement(element, toBeChecked, this);
-  const isValidInput = () => {
-    return element.tagName.toLowerCase() === "input" && ["checkbox", "radio"].includes(element.type);
-  };
-  const isValidAriaElement = () => {
-    return roleSupportsChecked(element.getAttribute("role")) && ["true", "false"].includes(element.getAttribute("aria-checked"));
-  };
-  if (!isValidInput() && !isValidAriaElement()) {
-    return {
-      pass: false,
-      message: () => `only inputs with type="checkbox" or type="radio" or elements with ${supportedRolesSentence()} and a valid aria-checked attribute can be used with .toBeChecked(). Use .toHaveValue() instead`
-    };
-  }
-  const isChecked = () => {
-    if (isValidInput())
-      return element.checked;
-    return element.getAttribute("aria-checked") === "true";
-  };
-  return {
-    pass: isChecked(),
-    message: () => {
-      const is = isChecked() ? "is" : "is not";
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBeChecked`,
-          "element",
-          ""
-        ),
-        "",
-        `Received element ${is} checked:`,
-        `  ${this.utils.printReceived(element.cloneNode(false))}`
-      ].join("\n");
-    }
-  };
-}
-function supportedRolesSentence() {
-  return toSentence(
-    supportedRoles().map((role) => `role="${role}"`),
-    { lastWordConnector: " or " }
-  );
-}
-function supportedRoles() {
-  return roles.keys().filter(roleSupportsChecked);
-}
-function roleSupportsChecked(role) {
-  return roles.get(role)?.props["aria-checked"] !== void 0;
-}
-
-// src/matchers/to-be-partially-checked.js
-function toBePartiallyChecked(element) {
-  checkHtmlElement(element, toBePartiallyChecked, this);
-  const isValidInput = () => {
-    return element.tagName.toLowerCase() === "input" && element.type === "checkbox";
-  };
-  const isValidAriaElement = () => {
-    return element.getAttribute("role") === "checkbox";
-  };
-  if (!isValidInput() && !isValidAriaElement()) {
-    return {
-      pass: false,
-      message: () => 'only inputs with type="checkbox" or elements with role="checkbox" and a valid aria-checked attribute can be used with .toBePartiallyChecked(). Use .toHaveValue() instead'
-    };
-  }
-  const isPartiallyChecked = () => {
-    const isAriaMixed = element.getAttribute("aria-checked") === "mixed";
-    if (isValidInput()) {
-      return element.indeterminate || isAriaMixed;
-    }
-    return isAriaMixed;
-  };
-  return {
-    pass: isPartiallyChecked(),
-    message: () => {
-      const is = isPartiallyChecked() ? "is" : "is not";
-      return [
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toBePartiallyChecked`,
-          "element",
-          ""
-        ),
-        "",
-        `Received element ${is} partially checked:`,
-        `  ${this.utils.printReceived(element.cloneNode(false))}`
-      ].join("\n");
-    }
-  };
-}
-
-// src/matchers/to-have-description.js
-function toHaveDescription(htmlElement, checkWith) {
-  deprecate("toHaveDescription", "Please use toHaveAccessibleDescription.");
-  checkHtmlElement(htmlElement, toHaveDescription, this);
-  const expectsDescription = checkWith !== void 0;
-  const descriptionIDRaw = htmlElement.getAttribute("aria-describedby") || "";
-  const descriptionIDs = descriptionIDRaw.split(/\s+/).filter(Boolean);
-  let description = "";
-  if (descriptionIDs.length > 0) {
-    const document = htmlElement.ownerDocument;
-    const descriptionEls = descriptionIDs.map((descriptionID) => document.getElementById(descriptionID)).filter(Boolean);
-    description = normalize(
-      descriptionEls.map((el) => el.textContent).join(" ")
+      `.toHaveDisplayValue() currently does not support input[type="${htmlElement.type}"], try with another matcher instead.`
     );
   }
+  const values = getValues(tagName, htmlElement);
+  const expectedValues = getExpectedValues(expectedValue);
+  const numberOfMatchesWithValues = expectedValues.filter(
+    (expected) => values.some(
+      (value) => expected instanceof RegExp ? expected.test(value) : this.equals(value, String(expected))
+    )
+  ).length;
+  const matchedWithAllValues = numberOfMatchesWithValues === values.length;
+  const matchedWithAllExpectedValues = numberOfMatchesWithValues === expectedValues.length;
   return {
-    pass: expectsDescription ? checkWith instanceof RegExp ? checkWith.test(description) : this.equals(description, checkWith) : Boolean(description),
-    message: () => {
-      const to = this.isNot ? "not to" : "to";
-      return getMessage(
-        this,
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toHaveDescription`,
-          "element",
-          ""
-        ),
-        `Expected the element ${to} have description`,
-        this.utils.printExpected(checkWith),
-        "Received",
-        this.utils.printReceived(description)
-      );
-    }
+    pass: matchedWithAllValues && matchedWithAllExpectedValues,
+    message: () => getMessage(
+      this,
+      this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toHaveDisplayValue`, "element", ""),
+      `Expected element ${this.isNot ? "not " : ""}to have display value`,
+      expectedValue,
+      "Received",
+      values
+    )
   };
 }
+function getValues(tagName, htmlElement) {
+  return tagName === "select" ? Array.from(htmlElement).filter((option) => option.selected).map((option) => option.textContent) : [htmlElement.value];
+}
+function getExpectedValues(expectedValue) {
+  return expectedValue instanceof Array ? expectedValue : [expectedValue];
+}
 
 // src/matchers/to-have-errormessage.js
 function toHaveErrorMessage(htmlElement, checkWith) {
@@ -1601,9 +1270,7 @@ function toHaveErrorMessage(htmlElement, checkWith) {
   if (errormessageIDs.length > 0) {
     const document = htmlElement.ownerDocument;
     const errormessageEls = errormessageIDs.map((errormessageID) => document.getElementById(errormessageID)).filter(Boolean);
-    errormessage = normalize(
-      errormessageEls.map((el) => el.textContent).join(" ")
-    );
+    errormessage = normalize(errormessageEls.map((el) => el.textContent).join(" "));
   }
   return {
     pass: expectsErrorMessage ? checkWith instanceof RegExp ? checkWith.test(errormessage) : this.equals(errormessage, checkWith) : Boolean(errormessage),
@@ -1611,11 +1278,7 @@ function toHaveErrorMessage(htmlElement, checkWith) {
       const to = this.isNot ? "not to" : "to";
       return getMessage(
         this,
-        this.utils.matcherHint(
-          `${this.isNot ? ".not" : ""}.toHaveErrorMessage`,
-          "element",
-          ""
-        ),
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toHaveErrorMessage`, "element", ""),
         `Expected the element ${to} have error message`,
         this.utils.printExpected(checkWith),
         "Received",
@@ -1625,6 +1288,196 @@ function toHaveErrorMessage(htmlElement, checkWith) {
   };
 }
 
+// src/matchers/to-have-focus.js
+function toHaveFocus(element) {
+  checkHtmlElement(element, toHaveFocus, this);
+  return {
+    pass: element.ownerDocument.activeElement === element,
+    message: () => {
+      return [
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toHaveFocus`, "element", ""),
+        "",
+        ...this.isNot ? ["Received element is focused:", `  ${this.utils.printReceived(element)}`] : [
+          "Expected element with focus:",
+          `  ${this.utils.printExpected(element)}`,
+          "Received element with focus:",
+          `  ${this.utils.printReceived(element.ownerDocument.activeElement)}`
+        ]
+      ].join("\n");
+    }
+  };
+}
+
+// src/matchers/to-have-form-values.ts
+import escape from "css.escape";
+import { isEqualWith, uniq } from "lodash-es";
+function getMultiElementValue(elements) {
+  const types = uniq(elements.map((element) => element.type));
+  if (types.length !== 1) {
+    throw new Error("Multiple form elements with the same name must be of the same type");
+  }
+  switch (types[0]) {
+    case "radio": {
+      const theChosenOne = elements.find((radio) => radio.checked);
+      return theChosenOne ? theChosenOne.value : void 0;
+    }
+    case "checkbox":
+      return elements.filter((checkbox) => checkbox.checked).map((checkbox) => checkbox.value);
+    default:
+      return elements.map((element) => element.value);
+  }
+}
+function getFormValue(container, name) {
+  container.elements;
+  const elements = [...container.querySelectorAll(`[name="${escape(name)}"]`)];
+  if (elements.length === 0) {
+    return void 0;
+  }
+  switch (elements.length) {
+    case 1:
+      return getSingleElementValue(elements[0]);
+    default:
+      return getMultiElementValue(elements);
+  }
+}
+function getPureName(name) {
+  return /\[\]$/.test(name) ? name.slice(0, -2) : name;
+}
+function getAllFormValues(container) {
+  const names = Array.from(container.elements).map((element) => element.name);
+  return names.reduce(
+    (obj, name) => ({
+      ...obj,
+      [getPureName(name)]: getFormValue(container, name)
+    }),
+    {}
+  );
+}
+function toHaveFormValues(formElement, expectedValues) {
+  checkHtmlElement(formElement, toHaveFormValues, this);
+  if (!formElement.elements) {
+    throw new Error("toHaveFormValues must be called on a form or a fieldset");
+  }
+  const formValues = getAllFormValues(formElement);
+  return {
+    pass: Object.entries(expectedValues).every(
+      ([name, expectedValue]) => isEqualWith(formValues[name], expectedValue, compareArraysAsSet)
+    ),
+    message: () => {
+      const to = this.isNot ? "not to" : "to";
+      const matcher = `${this.isNot ? ".not" : ""}.toHaveFormValues`;
+      const commonKeyValues = Object.keys(formValues).filter((key) => expectedValues.hasOwnProperty(key)).reduce((obj, key) => ({ ...obj, [key]: formValues[key] }), {});
+      return [
+        this.utils.matcherHint(matcher, "element", ""),
+        `Expected the element ${to} have form values`,
+        this.utils.diff(expectedValues, commonKeyValues)
+      ].join("\n\n");
+    }
+  };
+}
+
+// src/matchers/to-have-style.js
+import chalk from "chalk";
+function getStyleDeclaration(document, css) {
+  const styles = {};
+  const copy = document.createElement("div");
+  Object.keys(css).forEach((property) => {
+    copy.style[property] = css[property];
+    styles[property] = copy.style[property];
+  });
+  return styles;
+}
+function isSubset2(styles, computedStyle) {
+  return !!Object.keys(styles).length && Object.entries(styles).every(
+    ([prop, value]) => computedStyle[prop] === value || computedStyle.getPropertyValue(prop.toLowerCase()) === value
+  );
+}
+function printoutStyles(styles) {
+  return Object.keys(styles).sort().map((prop) => `${prop}: ${styles[prop]};`).join("\n");
+}
+function expectedDiff(diffFn, expected, computedStyles) {
+  const received = Array.from(computedStyles).filter((prop) => expected[prop] !== void 0).reduce((obj, prop) => Object.assign(obj, { [prop]: computedStyles.getPropertyValue(prop) }), {});
+  const diffOutput = diffFn(printoutStyles(expected), printoutStyles(received));
+  return diffOutput.replace(`${chalk.red("+ Received")}
+`, "");
+}
+function toHaveStyle(htmlElement, css) {
+  checkHtmlElement(htmlElement, toHaveStyle, this);
+  const parsedCSS = typeof css === "object" ? css : parseCSS(css, toHaveStyle, this);
+  const { getComputedStyle } = htmlElement.ownerDocument.defaultView;
+  const expected = getStyleDeclaration(htmlElement.ownerDocument, parsedCSS);
+  const received = getComputedStyle(htmlElement);
+  return {
+    pass: isSubset2(expected, received),
+    message: () => {
+      const matcher = `${this.isNot ? ".not" : ""}.toHaveStyle`;
+      return [
+        this.utils.matcherHint(matcher, "element", ""),
+        expectedDiff(this.utils.diff, expected, received)
+      ].join("\n\n");
+    }
+  };
+}
+
+// src/matchers/to-have-text-content.js
+function toHaveTextContent(node, checkWith, options = { normalizeWhitespace: true }) {
+  checkNode(node, toHaveTextContent, this);
+  const textContent = options.normalizeWhitespace ? normalize(node.textContent) : node.textContent.replace(/\u00a0/g, " ");
+  const checkingWithEmptyString = textContent !== "" && checkWith === "";
+  return {
+    pass: !checkingWithEmptyString && matches(textContent, checkWith),
+    message: () => {
+      const to = this.isNot ? "not to" : "to";
+      return getMessage(
+        this,
+        this.utils.matcherHint(`${this.isNot ? ".not" : ""}.toHaveTextContent`, "element", ""),
+        checkingWithEmptyString ? `Checking with empty string will always match, use .toBeEmptyDOMElement() instead` : `Expected element ${to} have text content`,
+        checkWith,
+        "Received",
+        textContent
+      );
+    }
+  };
+}
+
+// src/matchers/to-have-value.js
+import { isEqualWith as isEqualWith2 } from "lodash-es";
+function toHaveValue(htmlElement, expectedValue) {
+  checkHtmlElement(htmlElement, toHaveValue, this);
+  if (htmlElement.tagName.toLowerCase() === "input" && ["checkbox", "radio"].includes(htmlElement.type)) {
+    throw new Error(
+      "input with type=checkbox or type=radio cannot be used with .toHaveValue(). Use .toBeChecked() for type=checkbox or .toHaveFormValues() instead"
+    );
+  }
+  const receivedValue = getSingleElementValue(htmlElement);
+  const expectsValue = expectedValue !== void 0;
+  let expectedTypedValue = expectedValue;
+  let receivedTypedValue = receivedValue;
+  if (expectedValue == receivedValue && expectedValue !== receivedValue) {
+    expectedTypedValue = `${expectedValue} (${typeof expectedValue})`;
+    receivedTypedValue = `${receivedValue} (${typeof receivedValue})`;
+  }
+  return {
+    pass: expectsValue ? isEqualWith2(receivedValue, expectedValue, compareArraysAsSet) : Boolean(receivedValue),
+    message: () => {
+      const to = this.isNot ? "not to" : "to";
+      const matcher = this.utils.matcherHint(
+        `${this.isNot ? ".not" : ""}.toHaveValue`,
+        "element",
+        expectedValue
+      );
+      return getMessage(
+        this,
+        matcher,
+        `Expected the element ${to} have value`,
+        expectsValue ? expectedTypedValue : "(any)",
+        "Received",
+        receivedTypedValue
+      );
+    }
+  };
+}
+
 // src/matchers/matchers.ts
 var matchers_exports = {};
 __export(matchers_exports, {
@@ -1657,32 +1510,32 @@ __export(matchers_exports, {
 });
 
 export {
-  toBeInTheDOM,
-  toBeInTheDocument,
+  toBeChecked,
+  toBeDisabled,
+  toBeEnabled,
   toBeEmpty,
   toBeEmptyDOMElement,
+  toBeInTheDocument,
+  toBeInTheDOM,
+  toBeInvalid,
+  toBeValid,
+  toBePartiallyChecked,
+  toBeRequired,
+  toBeVisible,
   toContainElement,
   toContainHTML,
-  toHaveTextContent,
   toHaveAccessibleDescription,
   toHaveAccessibleName,
   toHaveAttribute,
   toHaveClass,
-  toHaveStyle,
+  toHaveDescription,
+  toHaveDisplayValue,
+  toHaveErrorMessage,
   toHaveFocus,
   toHaveFormValues,
-  toBeVisible,
-  toBeDisabled,
-  toBeEnabled,
-  toBeRequired,
-  toBeInvalid,
-  toBeValid,
+  toHaveStyle,
+  toHaveTextContent,
   toHaveValue,
-  toHaveDisplayValue,
-  toBeChecked,
-  toBePartiallyChecked,
-  toHaveDescription,
-  toHaveErrorMessage,
   matchers_exports
 };
-//# sourceMappingURL=chunk-LZZAJDBO.js.map
+//# sourceMappingURL=chunk-JWT7CU2B.js.map