ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): cleanup IE edge case in getAriaElementsInRightDomOrder

Browse source
This commit is contained in:
Thijs Louisse 2023-05-09 15:58:00 +02:00
parent 6264fe71f7
commit c6663068a7
1 changed files with 7 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
packages/ui/components/form-core/src/utils/getAriaElementsInRightDomOrder.js
View file

@ -1,6 +1,4 @@
/* eslint-disable no-bitwise */
import { browserDetection } from '@lion/ui/core.js';
const moveDownConditions = [
Node.DOCUMENT_POSITION_PRECEDING,
Node.DOCUMENT_POSITION_CONTAINS,
@ -8,30 +6,25 @@ const moveDownConditions = [
];
/**
* @desc Let the order of adding ids to aria element by DOM order, so that the screen reader
* Let the order of adding ids to aria element by DOM order, so that the screen reader
* respects visual order when reading:
* https://developers.google.com/web/fundamentals/accessibility/focus/dom-order-matters
* @param {HTMLElement[]} descriptionElements - holds references to description or label elements whose
* @param {Element[]} descriptionElements - holds references to description or label elements whose
* id should be returned
* @param {Object} opts
* @param {boolean} [opts.reverse]
* @returns {HTMLElement[]} sorted set of elements based on dom order
* @returns {Element[]} sorted set of elements based on dom order
*/
export function getAriaElementsInRightDomOrder(descriptionElements, { reverse } = {}) {
/**
* @param {HTMLElement} a
* @param {HTMLElement} b
* @return {-1|1}
* @param {Node} a
* @param {Node} b
* @returns {-1|1}
*/
const putPrecedingSiblingsAndLocalParentsFirst = (a, b) => {
// https://developer.mozilla.org/en-US/docs/Web/API/Node/compareDocumentPosition
const pos = a.compareDocumentPosition(b);
// Unfortunately, for IE, we have to switch the order (?)
if (moveDownConditions.includes(pos)) {
return browserDetection.isIE11 ? -1 : 1;
}
return browserDetection.isIE11 ? 1 : -1;
return moveDownConditions.includes(pos) ? 1 : -1;
};
const descriptionEls = descriptionElements.filter(el => el); // filter out null references