aria-current polyfill for Android

aria-current.js

/**
 * Polyfill to make aria-current work with Android
 * This happens on page load, re-run if loading content dynamically.
 * Ensure you have a class .sr-only in your CSS
 *
 * (wtfpl) github.com/victorloux
 */

// Test if the browser is an Android Chrome
if(/Android/.test(navigator.userAgent) && /Chrome\/[.0-9]*/.test(navigator.userAgent))
{
    // select all elements with an aria-current attribute, and for each...
    document.querySelectorAll('[aria-current]').forEach((el) => {
        // get current value of aria-current
        acValue = el.getAttribute('aria-current');

        // if aria-current="true" announce "current item"
        if(acValue == "true") acValue = "item";

        // add a screen-reader only text to say "current page"
        // role="text" is a hack to ensure it is grouped with its parent
        // and not announced afterwards.
        el.insertAdjacentHTML(
            'beforeend',
            '<span class="sr-only" role="text">, current ' + acValue + '</span>'
        );

        // remove the ARIA attribute to avoid a
        // duplicated announcement, just in case it gets fixed
        // + add as a class so that it can still be styled
        el.removeAttribute('aria-current');
        el.classList.add('aria-current');
    });
}