@testing-library/dom - npm Package Compare versions

Comparing version 8.20.0 to 9.3.3

dist/DOMElementFilter.js

@@ -83,3 +83,3 @@ "use strict";
   var _val$constructor;
-  return (val == null ? void 0 : (_val$constructor = val.constructor) == null ? void 0 : _val$constructor.name) && testNode(val);
+  return (val == null || (_val$constructor = val.constructor) == null ? void 0 : _val$constructor.name) && testNode(val);
 };
@@ -100,3 +100,3 @@ exports.test = test;
       var _val$constructor2;
-      return (val == null ? void 0 : (_val$constructor2 = val.constructor) == null ? void 0 : _val$constructor2.name) && testNode(val);
+      return (val == null || (_val$constructor2 = val.constructor) == null ? void 0 : _val$constructor2.name) && testNode(val);
     },
@@ -103,0 +103,0 @@ serialize: (node, config, indentation, depth, refs, printer) => {

dist/get-queries-for-element.js

@@ -13,3 +13,2 @@ "use strict";
  */
-
 /**
@@ -16,0 +15,0 @@ * @param {HTMLElement} element container

dist/helpers.js

@@ -23,2 +23,3 @@ "use strict";
       // modern timers
+      // eslint-disable-next-line prefer-object-has-own -- not supported by our support matrix
       Object.prototype.hasOwnProperty.call(setTimeout, 'clock')
@@ -25,0 +26,0 @@ );

dist/label-helpers.js

@@ -32,4 +32,3 @@ "use strict";
   if (element.labels !== undefined) {
-    var _labels;
-    return (_labels = element.labels) != null ? _labels : [];
+    return element.labels ?? [];
   }
@@ -36,0 +35,0 @@ if (!isLabelable(element)) return [];

dist/pretty-dom.js

@@ -21,4 +21,4 @@ "use strict";
   try {
-    var _process, _process$env;
-    colors = JSON.parse((_process = process) == null ? void 0 : (_process$env = _process.env) == null ? void 0 : _process$env.COLORS);
+    var _process;
+    colors = JSON.parse((_process = process) == null || (_process = _process.env) == null ? void 0 : _process.COLORS);
   } catch (e) {
@@ -25,0 +25,0 @@ // If this throws, process?.env?.COLORS wasn't parsable. Since we only

dist/queries/label-text.js

@@ -62,13 +62,21 @@ "use strict";
     labelList.filter(label => Boolean(label.formControl)).forEach(label => {
-      if (matcher(label.content, label.formControl, text, matchNormalizer) && label.formControl) labelledElements.push(label.formControl);
+      if (matcher(label.content, label.formControl, text, matchNormalizer) && label.formControl) {
+        labelledElements.push(label.formControl);
+      }
     });
     const labelsValue = labelList.filter(label => Boolean(label.content)).map(label => label.content);
-    if (matcher(labelsValue.join(' '), labelledElement, text, matchNormalizer)) labelledElements.push(labelledElement);
+    if (matcher(labelsValue.join(' '), labelledElement, text, matchNormalizer)) {
+      labelledElements.push(labelledElement);
+    }
     if (labelsValue.length > 1) {
       labelsValue.forEach((labelValue, index) => {
-        if (matcher(labelValue, labelledElement, text, matchNormalizer)) labelledElements.push(labelledElement);
+        if (matcher(labelValue, labelledElement, text, matchNormalizer)) {
+          labelledElements.push(labelledElement);
+        }
         const labelsFiltered = [...labelsValue];
         labelsFiltered.splice(index, 1);
         if (labelsFiltered.length > 1) {
-          if (matcher(labelsFiltered.join(' '), labelledElement, text, matchNormalizer)) labelledElements.push(labelledElement);
+          if (matcher(labelsFiltered.join(' '), labelledElement, text, matchNormalizer)) {
+            labelledElements.push(labelledElement);
+          }
         }
@@ -75,0 +83,0 @@ });

dist/queries/role.js

@@ -13,12 +13,11 @@ "use strict";
 var _allUtils = require("./all-utils");
-function queryAllByRole(container, role, {
-  exact = true,
-  collapseWhitespace,
+/* eslint-disable complexity */
+
+const queryAllByRole = (container, role, {
   hidden = (0, _allUtils.getConfig)().defaultHidden,
   name,
   description,
-  trim,
-  normalizer,
   queryFallbacks = false,
   selected,
+  busy,
   checked,
@@ -28,11 +27,11 @@ pressed,
   level,
-  expanded
-} = {}) {
+  expanded,
+  value: {
+    now: valueNow,
+    min: valueMin,
+    max: valueMax,
+    text: valueText
+  } = {}
+} = {}) => {
   (0, _helpers.checkContainerType)(container);
-  const matcher = exact ? _allUtils.matches : _allUtils.fuzzyMatches;
-  const matchNormalizer = (0, _allUtils.makeNormalizer)({
-    collapseWhitespace,
-    trim,
-    normalizer
-  });
   if (selected !== undefined) {
@@ -45,6 +44,13 @@ var _allRoles$get;
   }
-  if (checked !== undefined) {
+  if (busy !== undefined) {
     var _allRoles$get2;
     // guard against unknown roles
-    if (((_allRoles$get2 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get2.props['aria-checked']) === undefined) {
+    if (((_allRoles$get2 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get2.props['aria-busy']) === undefined) {
+      throw new Error(`"aria-busy" is not supported on role "${role}".`);
+    }
+  }
+  if (checked !== undefined) {
+    var _allRoles$get3;
+    // guard against unknown roles
+    if (((_allRoles$get3 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get3.props['aria-checked']) === undefined) {
       throw new Error(`"aria-checked" is not supported on role "${role}".`);
@@ -54,5 +60,5 @@ }
   if (pressed !== undefined) {
-    var _allRoles$get3;
+    var _allRoles$get4;
     // guard against unknown roles
-    if (((_allRoles$get3 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get3.props['aria-pressed']) === undefined) {
+    if (((_allRoles$get4 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get4.props['aria-pressed']) === undefined) {
       throw new Error(`"aria-pressed" is not supported on role "${role}".`);
@@ -62,3 +68,3 @@ }
   if (current !== undefined) {
-    var _allRoles$get4;
+    var _allRoles$get5;
     /* istanbul ignore next */
@@ -68,3 +74,3 @@ // guard against unknown roles
     // Leaving this for symetry and forward compatibility
-    if (((_allRoles$get4 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get4.props['aria-current']) === undefined) {
+    if (((_allRoles$get5 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get5.props['aria-current']) === undefined) {
       throw new Error(`"aria-current" is not supported on role "${role}".`);
@@ -79,6 +85,34 @@ }
   }
+  if (valueNow !== undefined) {
+    var _allRoles$get6;
+    // guard against unknown roles
+    if (((_allRoles$get6 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get6.props['aria-valuenow']) === undefined) {
+      throw new Error(`"aria-valuenow" is not supported on role "${role}".`);
+    }
+  }
+  if (valueMax !== undefined) {
+    var _allRoles$get7;
+    // guard against unknown roles
+    if (((_allRoles$get7 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get7.props['aria-valuemax']) === undefined) {
+      throw new Error(`"aria-valuemax" is not supported on role "${role}".`);
+    }
+  }
+  if (valueMin !== undefined) {
+    var _allRoles$get8;
+    // guard against unknown roles
+    if (((_allRoles$get8 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get8.props['aria-valuemin']) === undefined) {
+      throw new Error(`"aria-valuemin" is not supported on role "${role}".`);
+    }
+  }
+  if (valueText !== undefined) {
+    var _allRoles$get9;
+    // guard against unknown roles
+    if (((_allRoles$get9 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get9.props['aria-valuetext']) === undefined) {
+      throw new Error(`"aria-valuetext" is not supported on role "${role}".`);
+    }
+  }
   if (expanded !== undefined) {
-    var _allRoles$get5;
+    var _allRoles$get10;
     // guard against unknown roles
-    if (((_allRoles$get5 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get5.props['aria-expanded']) === undefined) {
+    if (((_allRoles$get10 = _ariaQuery.roles.get(role)) == null ? void 0 : _allRoles$get10.props['aria-expanded']) === undefined) {
       throw new Error(`"aria-expanded" is not supported on role "${role}".`);
@@ -96,3 +130,3 @@ }
   // Only query elements that can be matched by the following filters
-  makeRoleSelector(role, exact, normalizer ? matchNormalizer : undefined))).filter(node => {
+  makeRoleSelector(role))).filter(node => {
     const isRoleSpecifiedExplicitly = node.hasAttribute('role');
@@ -102,14 +136,12 @@ if (isRoleSpecifiedExplicitly) {
       if (queryFallbacks) {
-        return roleValue.split(' ').filter(Boolean).some(text => matcher(text, node, role, matchNormalizer));
+        return roleValue.split(' ').filter(Boolean).some(roleAttributeToken => roleAttributeToken === role);
       }
-      // if a custom normalizer is passed then let normalizer handle the role value
-      if (normalizer) {
-        return matcher(roleValue, node, role, matchNormalizer);
-      }
-      // other wise only send the first word to match
-      const [firstWord] = roleValue.split(' ');
-      return matcher(firstWord, node, role, matchNormalizer);
+      // other wise only send the first token to match
+      const [firstRoleAttributeToken] = roleValue.split(' ');
+      return firstRoleAttributeToken === role;
     }
     const implicitRoles = (0, _roleHelpers.getImplicitAriaRoles)(node);
-    return implicitRoles.some(implicitRole => matcher(implicitRole, node, role, matchNormalizer));
+    return implicitRoles.some(implicitRole => {
+      return implicitRole === role;
+    });
   }).filter(element => {
@@ -119,2 +151,5 @@ if (selected !== undefined) {
     }
+    if (busy !== undefined) {
+      return busy === (0, _roleHelpers.computeAriaBusy)(element);
+    }
     if (checked !== undefined) {
@@ -135,2 +170,18 @@ return checked === (0, _roleHelpers.computeAriaChecked)(element);
     }
+    if (valueNow !== undefined || valueMax !== undefined || valueMin !== undefined || valueText !== undefined) {
+      let valueMatches = true;
+      if (valueNow !== undefined) {
+        valueMatches && (valueMatches = valueNow === (0, _roleHelpers.computeAriaValueNow)(element));
+      }
+      if (valueMax !== undefined) {
+        valueMatches && (valueMatches = valueMax === (0, _roleHelpers.computeAriaValueMax)(element));
+      }
+      if (valueMin !== undefined) {
+        valueMatches && (valueMatches = valueMin === (0, _roleHelpers.computeAriaValueMin)(element));
+      }
+      if (valueText !== undefined) {
+        valueMatches && (valueMatches = (0, _allUtils.matches)((0, _roleHelpers.computeAriaValueText)(element) ?? null, element, valueText, text => text));
+      }
+      return valueMatches;
+    }
     // don't care if aria attributes are unspecified
@@ -159,11 +210,6 @@ return true;
   });
-}
-function makeRoleSelector(role, exact, customNormalizer) {
-  var _roleElements$get;
-  if (typeof role !== 'string') {
-    // For non-string role parameters we can not determine the implicitRoleSelectors.
-    return '*';
-  }
-  const explicitRoleSelector = exact && !customNormalizer ? `*[role~="${role}"]` : '*[role]';
-  const roleRelations = (_roleElements$get = _ariaQuery.roleElements.get(role)) != null ? _roleElements$get : new Set();
+};
+function makeRoleSelector(role) {
+  const explicitRoleSelector = `*[role~="${role}"]`;
+  const roleRelations = _ariaQuery.roleElements.get(role) ?? new Set();
   const implicitRoleSelectors = new Set(Array.from(roleRelations).map(({
@@ -170,0 +216,0 @@ name

dist/queries/text.js

@@ -48,3 +48,3 @@ "use strict";
   const isNormalizedDifferent = normalizedText !== text.toString();
-  const isCustomSelector = (selector != null ? selector : '*') !== '*';
+  const isCustomSelector = (selector ?? '*') !== '*';
   return `Unable to find an element with the text: ${isNormalizedDifferent ? `${normalizedText} (normalized from '${text}')` : text}${isCustomSelector ? `, which matches selector '${selector}'` : ''}. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.`;
@@ -51,0 +51,0 @@ };

dist/role-helpers.js

@@ -6,2 +6,3 @@ "use strict";
 });
+exports.computeAriaBusy = computeAriaBusy;
 exports.computeAriaChecked = computeAriaChecked;
@@ -12,2 +13,6 @@ exports.computeAriaCurrent = computeAriaCurrent;
 exports.computeAriaSelected = computeAriaSelected;
+exports.computeAriaValueMax = computeAriaValueMax;
+exports.computeAriaValueMin = computeAriaValueMin;
+exports.computeAriaValueNow = computeAriaValueNow;
+exports.computeAriaValueText = computeAriaValueText;
 exports.computeHeadingLevel = computeHeadingLevel;
@@ -231,2 +236,11 @@ exports.getImplicitAriaRoles = getImplicitAriaRoles;
  * @param {Element} element -
+ * @returns {boolean} -
+ */
+function computeAriaBusy(element) {
+  // https://www.w3.org/TR/wai-aria-1.1/#aria-busy
+  return element.getAttribute('aria-busy') === 'true';
+}
+
+/**
+ * @param {Element} element -
  * @returns {boolean | undefined} - false/true if (not)checked, undefined if not checked-able
@@ -263,5 +277,4 @@ */
 function computeAriaCurrent(element) {
-  var _ref, _checkBooleanAttribut;
   // https://www.w3.org/TR/wai-aria-1.1/#aria-current
-  return (_ref = (_checkBooleanAttribut = checkBooleanAttribute(element, 'aria-current')) != null ? _checkBooleanAttribut : element.getAttribute('aria-current')) != null ? _ref : false;
+  return checkBooleanAttribute(element, 'aria-current') ?? element.getAttribute('aria-current') ?? false;
 }
@@ -307,2 +320,38 @@
   return ariaLevelAttribute || implicitHeadingLevels[element.tagName];
+}
+
+/**
+ * @param {Element} element -
+ * @returns {number | undefined} -
+ */
+function computeAriaValueNow(element) {
+  const valueNow = element.getAttribute('aria-valuenow');
+  return valueNow === null ? undefined : +valueNow;
+}
+
+/**
+ * @param {Element} element -
+ * @returns {number | undefined} -
+ */
+function computeAriaValueMax(element) {
+  const valueMax = element.getAttribute('aria-valuemax');
+  return valueMax === null ? undefined : +valueMax;
+}
+
+/**
+ * @param {Element} element -
+ * @returns {number | undefined} -
+ */
+function computeAriaValueMin(element) {
+  const valueMin = element.getAttribute('aria-valuemin');
+  return valueMin === null ? undefined : +valueMin;
+}
+
+/**
+ * @param {Element} element -
+ * @returns {string | undefined} -
+ */
+function computeAriaValueText(element) {
+  const valueText = element.getAttribute('aria-valuetext');
+  return valueText === null ? undefined : valueText;
 }

dist/suggestions.js

@@ -62,3 +62,3 @@ "use strict";
 function getSuggestedQuery(element, variant = 'get', method) {
-  var _element$getAttribute, _getImplicitAriaRoles;
+  var _getImplicitAriaRoles;
   // don't create suggestions for script and style elements
@@ -70,3 +70,3 @@ if (element.matches((0, _config.getConfig)().defaultIgnore)) {
   //We prefer to suggest something else if the role is generic
-  const role = (_element$getAttribute = element.getAttribute('role')) != null ? _element$getAttribute : (_getImplicitAriaRoles = (0, _roleHelpers.getImplicitAriaRoles)(element)) == null ? void 0 : _getImplicitAriaRoles[0];
+  const role = element.getAttribute('role') ?? ((_getImplicitAriaRoles = (0, _roleHelpers.getImplicitAriaRoles)(element)) == null ? void 0 : _getImplicitAriaRoles[0]);
   if (role !== 'generic' && canSuggest('Role', method, role)) {
@@ -73,0 +73,0 @@ return makeSuggestion('Role', element, role, {

dist/wait-for.js

@@ -21,3 +21,5 @@ "use strict";
   onTimeout = error => {
-    error.message = (0, _config.getConfig)().getElementError(error.message, container).message;
+    Object.defineProperty(error, 'message', {
+      value: (0, _config.getConfig)().getElementError(error.message, container).message
+    });
     return error;
@@ -58,8 +60,14 @@ },
         }
-        // we *could* (maybe should?) use `advanceTimersToNextTimer` but it's
-        // possible that could make this loop go on forever if someone is using
-        // third party code that's setting up recursive timers so rapidly that
-        // the user's timer's don't get a chance to resolve. So we'll advance
-        // by an interval instead. (We have a test for this case).
-        advanceTimersWrapper(() => {
+
+        // In this rare case, we *need* to wait for in-flight promises
+        // to resolve before continuing. We don't need to take advantage
+        // of parallelization so we're fine.
+        // https://stackoverflow.com/a/59243586/971592
+        // eslint-disable-next-line no-await-in-loop
+        await advanceTimersWrapper(async () => {
+          // we *could* (maybe should?) use `advanceTimersToNextTimer` but it's
+          // possible that could make this loop go on forever if someone is using
+          // third party code that's setting up recursive timers so rapidly that
+          // the user's timer's don't get a chance to resolve. So we'll advance
+          // by an interval instead. (We have a test for this case).
           jest.advanceTimersByTime(interval);
@@ -76,14 +84,2 @@ });
         }
-
-        // In this rare case, we *need* to wait for in-flight promises
-        // to resolve before continuing. We don't need to take advantage
-        // of parallelization so we're fine.
-        // https://stackoverflow.com/a/59243586/971592
-        // eslint-disable-next-line no-await-in-loop
-        await advanceTimersWrapper(async () => {
-          await new Promise(r => {
-            setTimeout(r, 0);
-            jest.advanceTimersByTime(0);
-          });
-        });
       }
@@ -90,0 +86,0 @@ } else {

package.json

 {
   "name": "@testing-library/dom",
-  "version": "8.20.0",
+  "version": "9.3.3",
   "description": "Simple and complete DOM testing utilities that encourage good testing practices.",
@@ -24,3 +24,3 @@ "main": "dist/index.js",
   "engines": {
-    "node": ">=12"
+    "node": ">=14"
   },
@@ -44,3 +44,3 @@ "browserslist": [
     "samsung 16.0",
-    "node 12.0"
+    "node 14.0"
   ],
@@ -67,6 +67,6 @@ "scripts": {
     "@types/aria-query": "^5.0.1",
-    "aria-query": "^5.0.0",
+    "aria-query": "5.1.3",
     "chalk": "^4.1.0",
     "dom-accessibility-api": "^0.5.9",
-    "lz-string": "^1.4.4",
+    "lz-string": "^1.5.0",
     "pretty-format": "^27.0.2"
@@ -76,10 +76,15 @@ },
     "@testing-library/jest-dom": "^5.11.6",
-    "@types/lz-string": "^1.3.34",
+    "browserslist": "4.21.8",
+    "caniuse-lite": "1.0.30001502",
     "jest-in-case": "^1.0.2",
     "jest-snapshot-serializer-ansi": "^1.0.0",
     "jest-watch-select-projects": "^2.0.0",
-    "jsdom": "^16.4.0",
-    "kcd-scripts": "^11.0.0",
+    "jsdom": "20.0.0",
+    "kcd-scripts": "^13.0.0",
     "typescript": "^4.1.2"
   },
+  "overrides": {
+    "browserslist": "4.21.8",
+    "caniuse-lite": "1.0.30001502"
+  },
   "eslintConfig": {
@@ -90,2 +95,5 @@ "extends": [
     ],
+    "parserOptions": {
+      "ecmaVersion": 2020
+    },
     "rules": {
@@ -95,2 +103,3 @@ "@typescript-eslint/prefer-optional-chain": "off",
       "@typescript-eslint/no-unsafe-member-access": "off",
+      "@typescript-eslint/no-unnecessary-boolean-literal-compare": "off",
       "@typescript-eslint/prefer-includes": "off",
@@ -97,0 +106,0 @@ "import/prefer-default-export": "off",

types/matches.d.ts

@@ -10,4 +10,4 @@ import {ARIARole} from 'aria-query'
 // Get autocomplete for ARIARole union types, while still supporting another string
-// Ref: https://github.com/microsoft/TypeScript/issues/29729#issuecomment-505826972
-export type ByRoleMatcher = ARIARole | MatcherFunction | {}
+// Ref: https://github.com/microsoft/TypeScript/issues/29729#issuecomment-567871939
+export type ByRoleMatcher = ARIARole | (string & {})
 
@@ -14,0 +14,0 @@ export type NormalizerFn = (text: string) => string

types/queries.d.ts

@@ -69,3 +69,5 @@ import {ByRoleMatcher, Matcher, MatcherOptions} from './matches'
 
-export interface ByRoleOptions extends MatcherOptions {
+export interface ByRoleOptions {
+  /** suppress suggestions for a specific query */
+  suggest?: boolean
   /**
@@ -84,2 +86,7 @@ * If true includes elements in the query set that are usually excluded from
    * If true only includes elements in the query set that are marked as
+   * busy in the accessibility tree, i.e., `aria-busy="true"`
+   */
+  busy?: boolean
+  /**
+   * If true only includes elements in the query set that are marked as
    * checked in the accessibility tree, i.e., `aria-checked="true"`
@@ -108,2 +115,8 @@ */
   level?: number
+  value?: {
+    now?: number
+    min?: number
+    max?: number
+    text?: Matcher
+  }
   /**
@@ -110,0 +123,0 @@ * Includes every role used in the `role` attribute

types/role-helpers.d.ts

@@ -1,5 +0,14 @@
-export function logRoles(container: HTMLElement): string
+export function logRoles(
+  container: HTMLElement,
+  options?: LogRolesOptions,
+): string
+
+interface LogRolesOptions {
+  hidden?: boolean
+}
+
 export function getRoles(container: HTMLElement): {
   [index: string]: HTMLElement[]
 }
+
 /**
@@ -9,2 +18,3 @@ * https://testing-library.com/docs/dom-testing-library/api-helpers#isinaccessible
 export function isInaccessible(element: Element): boolean
+
 export function computeHeadingLevel(element: Element): number | undefined

New alerts

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Found 1 instance in 1 package

Fixed alerts

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2968712

1.81%

Lines of code

25544

1.96%

Number of lines in readme file

398

0.76%

Worsened metrics

Dev dependency count

9

12.5%

Number of package files

51

-1.92%