bunjomin
10/4/2018 - 8:10 PM

Aria Label from Inner Heading

This is different than "Aria Label from Element Content" and a bit sloppier

/**
 * AriaLabelFromInnerHeading
 * * This is a semi-sloppy function for generating labels from whatever
 * * heading tags can be found inside the given selector
 * @param {string} targetSelector - A queryselector string for the function's target
 * ex: AriaLabelFromInnerHeading({targetSelector: 'section:not([aria-label])'});
 * */
const AriaLabelFromInnerHeading = ({targetSelector}) => {
  let ariaLabelTargetElements = [...document.querySelectorAll(targetSelector)];
  ariaLabelTargetElements.map((target) => {
    let innerHeading = target.querySelector('h1, h2, h3, h4, h5, h6');
    if (innerHeading === null) {return false}
    return target.setAttribute('aria-label', innerHeading.innerText.trim());
  });
}