Make WordPress Core

Ticket #26639: 26639-1.diff

File 26639-1.diff, 1.8 KB (added by bramd, 11 years ago)

This patch adds an aria-expanded attribute to indicate if the menu is expanded. It also places focus on the first link in the menu if the user expands the menu. It also removes the title attribute and replaces this with a hidden span which is read by default by screenreaders, the title attribute is not.

  • src/wp-admin/js/common.js

     
    557557                        $( '#wp-admin-bar-menu-toggle' ).on( 'click.wp-responsive', function( event ) {
    558558                                event.preventDefault();
    559559                                $wpwrap.toggleClass( 'wp-responsive-open' );
     560                                if ($wpwrap.hasClass('wp-responsive-open')) {
     561                                        event.target.setAttribute('aria-expanded', 'true');
     562                                        $('#menu-dashboard a').focus();
     563                                } else {
     564                                        event.target.setAttribute('aria-expanded', 'false');
     565                                }
    560566                        } );
    561567
    562568                        // Add menu events
  • src/wp-includes/admin-bar.php

     
    166166        if ( is_admin() ) {
    167167                $wp_admin_bar->add_menu( array(
    168168                        'id'    => 'menu-toggle',
    169                         'title' => '<span class="ab-icon"></span>',
     169                        'title' => '<span class="ab-icon" aria-hidden="true"></span><span class="screen-reader-text">Menu</span>',
    170170                        'href'  => '#',
    171                         'meta'  => array(
    172                                 'title' => __( 'Menu' ),
     171                        'meta' => array(
     172                                'expandable' => true,
    173173                        ),
    174174                ) );
    175175        }
  • src/wp-includes/class-wp-admin-bar.php

     
    409409                $has_link  = ! empty( $node->href );
    410410
    411411                $tabindex = isset( $node->meta['tabindex'] ) ? (int) $node->meta['tabindex'] : '';
     412                $expandable = isset( $node->meta['expandable'] ) ? true : false;
     413               
    412414                $aria_attributes = $tabindex ? 'tabindex="' . $tabindex . '"' : '';
     415                if ($expandable) {
     416                        $aria_attributes .= 'aria-expanded="false"';
     417                }
    413418
    414419                $menuclass = '';
    415420