Make WordPress Core

Ticket #34668: 34668.2.patch

File 34668.2.patch, 2.1 KB (added by sabernhardt, 3 years ago)

adding menuitem role only to top-level links and including aria-expanded attribute

  • src/js/_enqueues/lib/admin-bar.js

     
    7474
    7575                        // Toggle hover class if the enter key is pressed.
    7676                        topMenuItems[i].addEventListener( 'keydown', toggleHoverIfEnter );
     77
     78                        var menuItemToggle = topMenuItems[i].querySelector( 'a[role="menuitem"]' );
     79                        if ( menuItemToggle ) {
     80                                menuItemToggle.setAttribute( 'aria-expanded', 'false' );
     81                        }
    7782                }
    7883
    7984                // Remove hover class if the escape key is pressed.
     
    149154        function toggleHoverIfEnter( event ) {
    150155                var wrapper;
    151156
    152                 if ( event.which !== 13 ) {
     157                // Follow link if pressing Ctrl and/or Shift with Enter (opening in a new tab or window).
     158                if ( event.which !== 13 || event.ctrlKey || event.shiftKey ) {
    153159                        return;
    154160                }
    155161
     
    336342
    337343                        element.className += className;
    338344                }
     345
     346                var menuItemToggle = element.querySelector( 'a' );
     347                if ( className === 'hover' && menuItemToggle && menuItemToggle.hasAttribute( 'aria-expanded' ) ) {
     348                        menuItemToggle.setAttribute( 'aria-expanded', 'true' );
     349                }
    339350        }
    340351
    341352        /**
     
    366377
    367378                        element.className = classes.replace( /^[\s]+|[\s]+$/g, '' );
    368379                }
     380
     381                var menuItemToggle = element.querySelector( 'a' );
     382                if ( className === 'hover' && menuItemToggle && menuItemToggle.hasAttribute( 'aria-expanded' ) ) {
     383                        menuItemToggle.setAttribute( 'aria-expanded', 'false' );
     384                }
    369385        }
    370386
    371387        /**
  • src/wp-includes/class-wp-admin-bar.php

     
    519519                if ( $is_parent ) {
    520520                        $menuclass        = 'menupop ';
    521521                        $aria_attributes .= ' aria-haspopup="true"';
     522
     523                        // Add role to top-level submenus, forcing screen readers out of browse mode.
     524                        if ( $is_root_top_item || $is_top_secondary_item ) {
     525                                $aria_attributes .= ' role="menuitem"';
     526                        }
    522527                }
    523528
    524529                if ( ! empty( $node->meta['class'] ) ) {