Make WordPress Core

Changeset 41683


Ignore:
Timestamp:
10/02/2017 07:43:02 PM (7 years ago)
Author:
afercia
Message:

Accessibility: List Tables: use aria-current for the views current link.

The aria-current attribute is a simple, effective way to help assistive
technologies users orientate themselves within a list of items. Continues the
introduction in core of the aria-current attribute after [41359] and [41371].

Props joedolson, flixos90, afercia.
Fixes #32399.

Location:
trunk/src/wp-admin
Files:
9 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/includes/class-wp-comments-list-table.php

    r41168 r41683  
    247247
    248248        foreach ( $stati as $status => $label ) {
    249             $class = ( $status === $comment_status ) ? ' class="current"' : '';
     249            $current_link_attributes = '';
     250
     251            if ( $status === $comment_status ) {
     252                $current_link_attributes = ' class="current" aria-current="page"';
     253            }
    250254
    251255            if ( !isset( $num_comments->$status ) )
     
    259263                $link = add_query_arg( 's', esc_attr( wp_unslash( $_REQUEST['s'] ) ), $link );
    260264            */
    261             $status_links[ $status ] = "<a href='$link'$class>" . sprintf(
     265            $status_links[ $status ] = "<a href='$link'$current_link_attributes>" . sprintf(
    262266                translate_nooped_plural( $label, $num_comments->$status ),
    263267                sprintf( '<span class="%s-count">%s</span>',
  • trunk/src/wp-admin/includes/class-wp-ms-themes-list-table.php

    r41220 r41683  
    307307
    308308            if ( 'search' != $type ) {
    309                 $status_links[$type] = sprintf( "<a href='%s' %s>%s</a>",
     309                $status_links[$type] = sprintf( "<a href='%s'%s>%s</a>",
    310310                    esc_url( add_query_arg('theme_status', $type, $url) ),
    311                     ( $type === $status ) ? ' class="current"' : '',
     311                    ( $type === $status ) ? ' class="current" aria-current="page"' : '',
    312312                    sprintf( $text, number_format_i18n( $count ) )
    313313                );
  • trunk/src/wp-admin/includes/class-wp-ms-users-list-table.php

    r41200 r41683  
    135135        $total_admins = count( $super_admins );
    136136
    137         $class = $role != 'super' ? ' class="current"' : '';
     137        $current_link_attributes = $role !== 'super' ? ' class="current" aria-current="page"' : '';
    138138        $role_links = array();
    139         $role_links['all'] = "<a href='" . network_admin_url('users.php') . "'$class>" . sprintf( _nx( 'All <span class="count">(%s)</span>', 'All <span class="count">(%s)</span>', $total_users, 'users' ), number_format_i18n( $total_users ) ) . '</a>';
    140         $class = $role === 'super' ? ' class="current"' : '';
    141         $role_links['super'] = "<a href='" . network_admin_url('users.php?role=super') . "'$class>" . sprintf( _n( 'Super Admin <span class="count">(%s)</span>', 'Super Admins <span class="count">(%s)</span>', $total_admins ), number_format_i18n( $total_admins ) ) . '</a>';
     139        $role_links['all'] = "<a href='" . network_admin_url( 'users.php' ) . "'$current_link_attributes>" . sprintf( _nx( 'All <span class="count">(%s)</span>', 'All <span class="count">(%s)</span>', $total_users, 'users' ), number_format_i18n( $total_users ) ) . '</a>';
     140        $current_link_attributes = $role === 'super' ? ' class="current" aria-current="page"' : '';
     141        $role_links['super'] = "<a href='" . network_admin_url( 'users.php?role=super' ) . "'$current_link_attributes>" . sprintf( _n( 'Super Admin <span class="count">(%s)</span>', 'Super Admins <span class="count">(%s)</span>', $total_admins ), number_format_i18n( $total_admins ) ) . '</a>';
    142142
    143143        return $role_links;
  • trunk/src/wp-admin/includes/class-wp-plugin-install-list-table.php

    r41612 r41683  
    287287        $display_tabs = array();
    288288        foreach ( (array) $tabs as $action => $text ) {
    289             $class = ( $action === $tab ) ? ' current' : '';
     289            $current_link_attributes = ( $action === $tab ) ? ' class="current" aria-current="page"' : '';
    290290            $href = self_admin_url('plugin-install.php?tab=' . $action);
    291             $display_tabs['plugin-install-'.$action] = "<a href='$href' class='$class'>$text</a>";
     291            $display_tabs['plugin-install-'.$action] = "<a href='$href'$current_link_attributes>$text</a>";
    292292        }
    293293        // No longer a real tab.
  • trunk/src/wp-admin/includes/class-wp-plugins-list-table.php

    r41399 r41683  
    433433
    434434            if ( 'search' !== $type ) {
    435                 $status_links[$type] = sprintf( "<a href='%s' %s>%s</a>",
     435                $status_links[$type] = sprintf( "<a href='%s'%s>%s</a>",
    436436                    add_query_arg('plugin_status', $type, 'plugins.php'),
    437                     ( $type === $status ) ? ' class="current"' : '',
     437                    ( $type === $status ) ? ' class="current" aria-current="page"' : '',
    438438                    sprintf( $text, number_format_i18n( $count ) )
    439439                    );
  • trunk/src/wp-admin/includes/class-wp-posts-list-table.php

    r41576 r41683  
    232232        $url = add_query_arg( $args, 'edit.php' );
    233233
    234         $class_html = '';
     234        $class_html = $aria_current = '';
    235235        if ( ! empty( $class ) ) {
    236236             $class_html = sprintf(
     
    238238                esc_attr( $class )
    239239            );
     240
     241            if ( 'current' === $class ) {
     242                $aria_current = ' aria-current="page"';
     243            }
    240244        }
    241245
    242246        return sprintf(
    243             '<a href="%s"%s>%s</a>',
     247            '<a href="%s"%s%s>%s</a>',
    244248            esc_url( $url ),
    245249            $class_html,
     250            $aria_current,
    246251            $label
    247252        );
  • trunk/src/wp-admin/includes/class-wp-theme-install-list-table.php

    r41161 r41683  
    171171        $display_tabs = array();
    172172        foreach ( (array) $tabs as $action => $text ) {
    173             $class = ( $action === $tab ) ? ' class="current"' : '';
     173            $current_link_attributes = ( $action === $tab ) ? ' class="current" aria-current="page"' : '';
    174174            $href = self_admin_url('theme-install.php?tab=' . $action);
    175             $display_tabs['theme-install-'.$action] = "<a href='$href'$class>$text</a>";
     175            $display_tabs['theme-install-'.$action] = "<a href='$href'$current_link_attributes>$text</a>";
    176176        }
    177177
  • trunk/src/wp-admin/includes/class-wp-users-list-table.php

    r41613 r41683  
    197197        }
    198198
    199         $class = empty($role) ? ' class="current"' : '';
     199        $current_link_attributes = empty( $role ) ? ' class="current" aria-current="page"' : '';
     200
    200201        $role_links = array();
    201202
    202203        if ( $count_users ) {
    203             $role_links['all'] = "<a href='$url'$class>" . sprintf( _nx( 'All <span class="count">(%s)</span>', 'All <span class="count">(%s)</span>', $total_users, 'users' ), number_format_i18n( $total_users ) ) . '</a>';
     204            $role_links['all'] = "<a href='$url'$current_link_attributes>" . sprintf( _nx( 'All <span class="count">(%s)</span>', 'All <span class="count">(%s)</span>', $total_users, 'users' ), number_format_i18n( $total_users ) ) . '</a>';
    204205        } else {
    205             $role_links['all'] = "<a href='$url'$class>" . _x( 'All', 'users' ) . '</a>';
     206            $role_links['all'] = "<a href='$url'$current_link_attributes>" . _x( 'All', 'users' ) . '</a>';
    206207        }
    207208        foreach ( $wp_roles->get_names() as $this_role => $name ) {
     
    210211            }
    211212
    212             $class = '';
     213            $current_link_attributes = '';
    213214
    214215            if ( $this_role === $role ) {
    215                 $class = ' class="current"';
     216                $current_link_attributes = ' class="current" aria-current="page"';
    216217            }
    217218
     
    221222                $name = sprintf( __('%1$s <span class="count">(%2$s)</span>'), $name, number_format_i18n( $avail_roles[$this_role] ) );
    222223            }
    223             $role_links[$this_role] = "<a href='" . esc_url( add_query_arg( 'role', $this_role, $url ) ) . "'$class>$name</a>";
     224            $role_links[$this_role] = "<a href='" . esc_url( add_query_arg( 'role', $this_role, $url ) ) . "'$current_link_attributes>$name</a>";
    224225        }
    225226
    226227        if ( ! $count_users || ! empty( $avail_roles['none' ] ) ) {
    227228
    228             $class = '';
     229            $current_link_attributes = '';
    229230
    230231            if ( 'none' === $role ) {
    231                 $class = ' class="current"';
     232                $current_link_attributes = ' class="current" aria-current="page"';
    232233            }
    233234
     
    237238                $name = sprintf( __('%1$s <span class="count">(%2$s)</span>'), $name, number_format_i18n( $avail_roles['none' ] ) );
    238239            }
    239             $role_links['none'] = "<a href='" . esc_url( add_query_arg( 'role', 'none', $url ) ) . "'$class>$name</a>";
     240            $role_links['none'] = "<a href='" . esc_url( add_query_arg( 'role', 'none', $url ) ) . "'$current_link_attributes>$name</a>";
    240241
    241242        }
  • trunk/src/wp-admin/js/theme.js

    r41658 r41683  
    15401540        }
    15411541
    1542         $( '.filter-links li > a.current' ).removeClass( 'current' );
     1542        $( '.filter-links li > a.current' )
     1543            .removeClass( 'current' )
     1544            .removeAttr( 'aria-current' );
     1545
    15431546        $( 'body' ).removeClass( 'show-filters filters-applied show-favorites-form' );
    15441547        $( '.drawer-toggle' ).attr( 'aria-expanded', 'false' );
     
    16641667        themes.router.selectedTab = sort;
    16651668
    1666         $( '.filter-links li > a, .theme-filter' ).removeClass( this.activeClass );
    1667         $( '[data-sort="' + sort + '"]' ).addClass( this.activeClass );
     1669        $( '.filter-links li > a, .theme-filter' )
     1670            .removeClass( this.activeClass )
     1671            .removeAttr( 'aria-current' );
     1672
     1673        $( '[data-sort="' + sort + '"]' )
     1674            .addClass( this.activeClass )
     1675            .attr( 'aria-current', 'page' );
    16681676
    16691677        if ( 'favorites' === sort ) {
     
    16871695        }
    16881696
    1689         $( '.filter-links li > a, .theme-section' ).removeClass( this.activeClass );
    1690         $el.addClass( this.activeClass );
     1697        $( '.filter-links li > a, .theme-section' )
     1698            .removeClass( this.activeClass )
     1699            .removeAttr( 'aria-current' );
     1700        $el
     1701            .addClass( this.activeClass )
     1702            .attr( 'aria-current', 'page' );
    16911703
    16921704        if ( ! filter ) {
     
    17261738
    17271739        $( 'body' ).addClass( 'filters-applied' );
    1728         $( '.filter-links li > a.current' ).removeClass( 'current' );
     1740        $( '.filter-links li > a.current' )
     1741            .removeClass( 'current' )
     1742            .removeAttr( 'aria-current' );
     1743
    17291744        filteringBy.empty();
    17301745
Note: See TracChangeset for help on using the changeset viewer.