@testing-library/dom - npm Package Compare versions

Comparing version 5.1.1 to 5.2.0

dist/__tests__/element-queries.js

@@ -377,2 +377,57 @@ import {configure} from '../config'
 
+test('queryAllByRole returns semantic html elements', () => {
+  const {queryAllByRole} = render(`
+    <form>
+      <h1>Heading 1</h1>
+      <h2>Heading 2</h2>
+      <h3>Heading 3</h3>
+      <h4>Heading 4</h4>
+      <h5>Heading 5</h5>
+      <h6>Heading 6</h6>
+      <ol>
+        <li></li>
+        <li></li>
+      </ol>
+      <ul>
+        <li></li>
+      </ul>
+      <input>
+      <input type="text">
+      <input type="checkbox">
+      <input type="radio">
+      <table>
+        <thead>
+          <tr>
+            <th></th>
+            <th scope="row"></th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr></tr>
+          <tr></tr>
+        </tbody>
+      </table>
+      <table role="grid"></table>
+      <button>Button</button>
+    </form>
+  `)
+
+  expect(queryAllByRole(/table/i)).toHaveLength(1)
+  expect(queryAllByRole(/tabl/i, {exact: false})).toHaveLength(1)
+  expect(queryAllByRole(/columnheader/i)).toHaveLength(1)
+  expect(queryAllByRole(/rowheader/i)).toHaveLength(1)
+  expect(queryAllByRole(/grid/i)).toHaveLength(1)
+  expect(queryAllByRole(/form/i)).toHaveLength(1)
+  expect(queryAllByRole(/button/i)).toHaveLength(1)
+  expect(queryAllByRole(/heading/i)).toHaveLength(6)
+  expect(queryAllByRole('list')).toHaveLength(2)
+  expect(queryAllByRole(/listitem/i)).toHaveLength(3)
+  expect(queryAllByRole(/textbox/i)).toHaveLength(2)
+  expect(queryAllByRole(/checkbox/i)).toHaveLength(1)
+  expect(queryAllByRole(/radio/i)).toHaveLength(1)
+  expect(queryAllByRole('row')).toHaveLength(3)
+  expect(queryAllByRole(/rowgroup/i)).toHaveLength(2)
+  expect(queryAllByRole(/(table)|(textbox)/i)).toHaveLength(3)
+})
+
 test('getAll* matchers return an array', () => {
@@ -379,0 +434,0 @@ const {

dist/@testing-library/dom.cjs.js

@@ -10,2 +10,3 @@ 'use strict';
 var MutationObserver = _interopDefault(require('@sheerun/mutationobserver-shim'));
+var ariaQuery = require('aria-query');
 var waitForExpect = _interopDefault(require('wait-for-expect'));
@@ -683,4 +684,107 @@ var _objectWithoutPropertiesLoose = _interopDefault(require('@babel/runtime/helpers/objectWithoutPropertiesLoose'));
 
-var queryAllByRole = queryAllByAttribute.bind(null, 'role');
+function buildElementRoleList(elementRolesMap) {
+  function makeElementSelector(_ref) {
+    var name = _ref.name,
+        _ref$attributes = _ref.attributes,
+        attributes = _ref$attributes === void 0 ? [] : _ref$attributes;
+    return "" + name + attributes.map(function (_ref2) {
+      var attributeName = _ref2.name,
+          value = _ref2.value;
+      return "[" + attributeName + "=" + value + "]";
+    }).join('');
+  }
 
+  function getSelectorSpecificity(_ref3) {
+    var _ref3$attributes = _ref3.attributes,
+        attributes = _ref3$attributes === void 0 ? [] : _ref3$attributes;
+    return attributes.length;
+  }
+
+  var result = [];
+
+  for (var _iterator = elementRolesMap.entries(), _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
+    var _ref6;
+
+    if (_isArray) {
+      if (_i >= _iterator.length) break;
+      _ref6 = _iterator[_i++];
+    } else {
+      _i = _iterator.next();
+      if (_i.done) break;
+      _ref6 = _i.value;
+    }
+
+    var _ref7 = _ref6,
+        element = _ref7[0],
+        roles = _ref7[1];
+    result = [].concat(result, [{
+      selector: makeElementSelector(element),
+      roles: Array.from(roles),
+      specificity: getSelectorSpecificity(element)
+    }]);
+  }
+
+  return result.sort(function (_ref4, _ref5) {
+    var leftSpecificity = _ref4.specificity;
+    var rightSpecificity = _ref5.specificity;
+    return rightSpecificity - leftSpecificity;
+  });
+}
+
+var elementRoleList = buildElementRoleList(ariaQuery.elementRoles);
+
+function queryAllByRole(container, role, _temp) {
+  var _ref8 = _temp === void 0 ? {} : _temp,
+      _ref8$exact = _ref8.exact,
+      exact = _ref8$exact === void 0 ? true : _ref8$exact,
+      collapseWhitespace = _ref8.collapseWhitespace,
+      trim = _ref8.trim,
+      normalizer = _ref8.normalizer;
+
+  var matcher = exact ? matches : fuzzyMatches;
+  var matchNormalizer = makeNormalizer({
+    collapseWhitespace: collapseWhitespace,
+    trim: trim,
+    normalizer: normalizer
+  });
+
+  function getImplicitAriaRole(currentNode) {
+    for (var _iterator2 = elementRoleList, _isArray2 = Array.isArray(_iterator2), _i2 = 0, _iterator2 = _isArray2 ? _iterator2 : _iterator2[Symbol.iterator]();;) {
+      var _ref9;
+
+      if (_isArray2) {
+        if (_i2 >= _iterator2.length) break;
+        _ref9 = _iterator2[_i2++];
+      } else {
+        _i2 = _iterator2.next();
+        if (_i2.done) break;
+        _ref9 = _i2.value;
+      }
+
+      var _ref10 = _ref9,
+          selector = _ref10.selector,
+          roles = _ref10.roles;
+
+      if (currentNode.matches(selector)) {
+        return [].concat(roles);
+      }
+    }
+
+    return [];
+  }
+
+  return Array.from(container.querySelectorAll('*')).filter(function (node) {
+    var isRoleSpecifiedExplicitly = node.hasAttribute('role');
+
+    if (isRoleSpecifiedExplicitly) {
+      return matcher(node.getAttribute('role'), node, role, matchNormalizer);
+    }
+
+    var implicitRoles = getImplicitAriaRole(node);
+    return implicitRoles.some(function (implicitRole) {
+      return matcher(implicitRole, node, role, matchNormalizer);
+    });
+  });
+}
+
 var getMultipleError$6 = function (c, id) {
@@ -687,0 +791,0 @@ return "Found multiple elements by [role=" + id + "]";

dist/@testing-library/dom.esm.js

 import _extends from '@babel/runtime/helpers/esm/extends';
 import prettyFormat from 'pretty-format';
 import MutationObserver from '@sheerun/mutationobserver-shim';
+import { elementRoles } from 'aria-query';
 import waitForExpect from 'wait-for-expect';
@@ -676,4 +677,107 @@ import _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';
 
-var queryAllByRole = queryAllByAttribute.bind(null, 'role');
+function buildElementRoleList(elementRolesMap) {
+  function makeElementSelector(_ref) {
+    var name = _ref.name,
+        _ref$attributes = _ref.attributes,
+        attributes = _ref$attributes === void 0 ? [] : _ref$attributes;
+    return "" + name + attributes.map(function (_ref2) {
+      var attributeName = _ref2.name,
+          value = _ref2.value;
+      return "[" + attributeName + "=" + value + "]";
+    }).join('');
+  }
 
+  function getSelectorSpecificity(_ref3) {
+    var _ref3$attributes = _ref3.attributes,
+        attributes = _ref3$attributes === void 0 ? [] : _ref3$attributes;
+    return attributes.length;
+  }
+
+  var result = [];
+
+  for (var _iterator = elementRolesMap.entries(), _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
+    var _ref6;
+
+    if (_isArray) {
+      if (_i >= _iterator.length) break;
+      _ref6 = _iterator[_i++];
+    } else {
+      _i = _iterator.next();
+      if (_i.done) break;
+      _ref6 = _i.value;
+    }
+
+    var _ref7 = _ref6,
+        element = _ref7[0],
+        roles = _ref7[1];
+    result = [].concat(result, [{
+      selector: makeElementSelector(element),
+      roles: Array.from(roles),
+      specificity: getSelectorSpecificity(element)
+    }]);
+  }
+
+  return result.sort(function (_ref4, _ref5) {
+    var leftSpecificity = _ref4.specificity;
+    var rightSpecificity = _ref5.specificity;
+    return rightSpecificity - leftSpecificity;
+  });
+}
+
+var elementRoleList = buildElementRoleList(elementRoles);
+
+function queryAllByRole(container, role, _temp) {
+  var _ref8 = _temp === void 0 ? {} : _temp,
+      _ref8$exact = _ref8.exact,
+      exact = _ref8$exact === void 0 ? true : _ref8$exact,
+      collapseWhitespace = _ref8.collapseWhitespace,
+      trim = _ref8.trim,
+      normalizer = _ref8.normalizer;
+
+  var matcher = exact ? matches : fuzzyMatches;
+  var matchNormalizer = makeNormalizer({
+    collapseWhitespace: collapseWhitespace,
+    trim: trim,
+    normalizer: normalizer
+  });
+
+  function getImplicitAriaRole(currentNode) {
+    for (var _iterator2 = elementRoleList, _isArray2 = Array.isArray(_iterator2), _i2 = 0, _iterator2 = _isArray2 ? _iterator2 : _iterator2[Symbol.iterator]();;) {
+      var _ref9;
+
+      if (_isArray2) {
+        if (_i2 >= _iterator2.length) break;
+        _ref9 = _iterator2[_i2++];
+      } else {
+        _i2 = _iterator2.next();
+        if (_i2.done) break;
+        _ref9 = _i2.value;
+      }
+
+      var _ref10 = _ref9,
+          selector = _ref10.selector,
+          roles = _ref10.roles;
+
+      if (currentNode.matches(selector)) {
+        return [].concat(roles);
+      }
+    }
+
+    return [];
+  }
+
+  return Array.from(container.querySelectorAll('*')).filter(function (node) {
+    var isRoleSpecifiedExplicitly = node.hasAttribute('role');
+
+    if (isRoleSpecifiedExplicitly) {
+      return matcher(node.getAttribute('role'), node, role, matchNormalizer);
+    }
+
+    var implicitRoles = getImplicitAriaRole(node);
+    return implicitRoles.some(function (implicitRole) {
+      return matcher(implicitRole, node, role, matchNormalizer);
+    });
+  });
+}
+
 var getMultipleError$6 = function (c, id) {
@@ -680,0 +784,0 @@ return "Found multiple elements by [role=" + id + "]";

dist/queries/role.js

@@ -6,10 +6,87 @@ "use strict";
 });
-exports.findByRole = exports.findAllByRole = exports.getByRole = exports.getAllByRole = exports.queryAllByRole = exports.queryByRole = void 0;
+exports.queryAllByRole = queryAllByRole;
+exports.findByRole = exports.findAllByRole = exports.getByRole = exports.getAllByRole = exports.queryByRole = void 0;
 
 var _allUtils = require("./all-utils");
 
-const queryAllByRole = _allUtils.queryAllByAttribute.bind(null, 'role');
+var _ariaQuery = require("aria-query");
 
-exports.queryAllByRole = queryAllByRole;
+function buildElementRoleList(elementRolesMap) {
+  function makeElementSelector({
+    name,
+    attributes = []
+  }) {
+    return `${name}${attributes.map(({
+      name: attributeName,
+      value
+    }) => `[${attributeName}=${value}]`).join('')}`;
+  }
 
+  function getSelectorSpecificity({
+    attributes = []
+  }) {
+    return attributes.length;
+  }
+
+  let result = [];
+
+  for (const [element, roles] of elementRolesMap.entries()) {
+    result = [...result, {
+      selector: makeElementSelector(element),
+      roles: Array.from(roles),
+      specificity: getSelectorSpecificity(element)
+    }];
+  }
+
+  return result.sort(function ({
+    specificity: leftSpecificity
+  }, {
+    specificity: rightSpecificity
+  }) {
+    return rightSpecificity - leftSpecificity;
+  });
+}
+
+const elementRoleList = buildElementRoleList(_ariaQuery.elementRoles);
+
+function queryAllByRole(container, role, {
+  exact = true,
+  collapseWhitespace,
+  trim,
+  normalizer
+} = {}) {
+  const matcher = exact ? _allUtils.matches : _allUtils.fuzzyMatches;
+  const matchNormalizer = (0, _allUtils.makeNormalizer)({
+    collapseWhitespace,
+    trim,
+    normalizer
+  });
+
+  function getImplicitAriaRole(currentNode) {
+    for (const _ref of elementRoleList) {
+      const {
+        selector,
+        roles
+      } = _ref;
+
+      if (currentNode.matches(selector)) {
+        return [...roles];
+      }
+    }
+
+    return [];
+  }
+
+  return Array.from(container.querySelectorAll('*')).filter(node => {
+    const isRoleSpecifiedExplicitly = node.hasAttribute('role');
+
+    if (isRoleSpecifiedExplicitly) {
+      return matcher(node.getAttribute('role'), node, role, matchNormalizer);
+    }
+
+    const implicitRoles = getImplicitAriaRole(node);
+    return implicitRoles.some(implicitRole => matcher(implicitRole, node, role, matchNormalizer));
+  });
+}
+
 const getMultipleError = (c, id) => `Found multiple elements by [role=${id}]`;
@@ -16,0 +93,0 @@

package.json

 {
   "name": "@testing-library/dom",
-  "version": "5.1.1",
+  "version": "5.2.0",
   "description": "Simple and complete DOM testing utilities that encourage good testing practices.",
@@ -47,2 +47,3 @@ "main": "dist/index.js",
     "@sheerun/mutationobserver-shim": "^0.3.2",
+    "aria-query": "3.0.0",
     "pretty-format": "^24.8.0",
@@ -49,0 +50,0 @@ "wait-for-expect": "^1.2.0"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1651971

increased by59.93%

Lines of code

16304

increased by40.17%

Worsened metrics

Dependency count

5

increased by25%

Dependency changes

• + Addedaria-query@3.0.0

• + Addedaria-query@3.0.0(transitive)

• + Addedast-types-flow@0.0.7(transitive)

• + Addedcommander@2.20.3(transitive)