Accessibility Quick Check in the Admin Bar

add_action( 'admin_bar_menu', function ( $bar ) {
    if ( is_admin() || ! current_user_can( 'edit_posts' ) ) {
        return;
    }

    $bar->add_node( array(
        'id'    => 'wpide-a11y-check',
        'title' => 'A11y check',
        'href'  => '#wpide-a11y-check',
    ) );
}, 90 );

add_action( 'wp_footer', function () {
    if ( ! is_admin_bar_showing() || ! current_user_can( 'edit_posts' ) ) {
        return;
    }
    ?>
<style>.wpide-a11y-flag{outline:3px solid #d63638!important;outline-offset:2px;}.wpide-a11y-flag-warn{outline:3px dashed #dba617!important;outline-offset:2px;}</style>
<script>
(function () {
    var link = document.querySelector('#wp-admin-bar-wpide-a11y-check > a');
    if (!link) { return; }
    link.addEventListener('click', function (event) {
        event.preventDefault();
        var problems = [];
        function flag(el, msg, warn) { el.classList.add(warn ? 'wpide-a11y-flag-warn' : 'wpide-a11y-flag'); el.title = msg; problems.push(msg); }
        var scope = document.body;
        scope.querySelectorAll('img:not([alt])').forEach(function (el) { flag(el, 'Image without alt attribute'); });
        scope.querySelectorAll('a[href], button').forEach(function (el) {
            if (el.closest('#wpadminbar')) { return; }
            var name = (el.textContent || '').trim() || el.getAttribute('aria-label') || el.getAttribute('title') || (el.querySelector('img[alt]:not([alt=""])') ? 'img' : '');
            if (!name) { flag(el, 'Link or button without an accessible name'); }
        });
        scope.querySelectorAll('input:not([type=hidden]):not([type=submit]):not([type=button]), select, textarea').forEach(function (el) {
            if (el.closest('#wpadminbar')) { return; }
            var labelled = el.getAttribute('aria-label') || el.getAttribute('aria-labelledby') || el.closest('label') || (el.id && document.querySelector('label[for="' + CSS.escape(el.id) + '"]'));
            if (!labelled) { flag(el, 'Form field without a label'); }
        });
        var last = 0;
        scope.querySelectorAll('h1, h2, h3, h4, h5, h6').forEach(function (el) {
            if (el.closest('#wpadminbar')) { return; }
            var level = parseInt(el.tagName.substring(1), 10);
            if (last && level > last + 1) { flag(el, 'Heading skips from H' + last + ' to H' + level, true); }
            last = level;
        });
        if (document.querySelectorAll('h1').length !== 1) { problems.push('Page has ' + document.querySelectorAll('h1').length + ' H1 headings'); }
        if (!document.documentElement.getAttribute('lang')) { problems.push('The html element has no lang attribute'); }
        var unique = {};
        problems.forEach(function (p) { unique[p] = (unique[p] || 0) + 1; });
        var summary = Object.keys(unique).map(function (p) { return unique[p] + ' x ' + p; }).join('\n');
        window.alert(problems.length ? 'Found ' + problems.length + ' possible problem(s), outlined on the page:\n\n' + summary : 'No common problems found on this page.');
    });
})();
</script>
    <?php
}, 99 );