Changeset 42785 for trunk/src/wp-admin/update-core.php

Timestamp:

03/05/2018 03:49:58 PM (8 years ago)

Author:

afercia

Message:

Accessibility: Change the "Show / Hide dismissed updates" link to a button.

For better accessibility and semantics, user interface controls that perform an
action should be buttons. Links should exclusively be used for navigation.
Also, adds an aria-expanded attribute to communicate the expandable panel state
and improves the buttons spacing.

Props Cheffheid, audrasjb, afercia.
Fixes #38674.

File:

• trunk/src/wp-admin/update-core.php (modified) (1 diff)

trunk/src/wp-admin/update-core.php

@@ -139 +139 @@
         ?>
         <script type="text/javascript">
-
-                jQuery(function($) {
-                        $('dismissed-updates').show();
-                        $('#show-dismissed').toggle(function(){$(this).text('<?php echo $hide_text; ?>');}, function() {$(this).text('<?php echo $show_text; ?>')});
-                        $('#show-dismissed').click(function() { $('#dismissed-updates').toggle('slow');});
+                jQuery(function( $ ) {
+                        $( 'dismissed-updates' ).show();
+                        $( '#show-dismissed' ).toggle( function() { $( this ).text( '<?php echo $hide_text; ?>' ).attr( 'aria-expanded', 'true' ); }, function() { $( this ).text( '<?php echo $show_text; ?>' ).attr( 'aria-expanded', 'false' ); } );
+                        $( '#show-dismissed' ).click( function() { $( '#dismissed-updates' ).toggle( 'fast' ); } );
                 });
         </script>
         <?php
-                echo '<p class="hide-if-no-js"><a id="show-dismissed" href="#">' . __( 'Show hidden updates' ) . '</a></p>';
+                echo '<p class="hide-if-no-js"><button type="button" class="button" id="show-dismissed" aria-expanded="false">' . __( 'Show hidden updates' ) . '</button></p>';
                 echo '<ul id="dismissed-updates" class="core-updates dismissed">';
         foreach ( (array) $dismissed as $update ) {