jenkins-bot has submitted this change and it was merged.
Change subject: Make edit toolbar accessible to screen readers
......................................................................
Make edit toolbar accessible to screen readers
Removed redundant attributes, added aria-* attributes and properly
declared the links with role=button.
Tested with JAWS 14 and NVDA.
Bug: 24592
Change-Id: I27e18798d18b63655ea716eee2be1c7ab5303759
---
M modules/jquery.wikiEditor.toolbar.js
1 file changed, 34 insertions(+), 11 deletions(-)
Approvals:
Bartosz Dziewoński: Looks good to me, approved
jenkins-bot: Verified
diff --git a/modules/jquery.wikiEditor.toolbar.js
b/modules/jquery.wikiEditor.toolbar.js
index b43dff4..e1bc6f1 100644
--- a/modules/jquery.wikiEditor.toolbar.js
+++ b/modules/jquery.wikiEditor.toolbar.js
@@ -314,13 +314,13 @@
var offsetOrIcon =
$.wikiEditor.autoIconOrOffset( tool.icon, tool.offset,
$.wikiEditor.imgPath +
'toolbar/'
);
- if ( typeof offsetOrIcon == 'object' ) {
+ if ( typeof offsetOrIcon === 'object' )
{
$button = $( '<a/>' )
.attr( {
'href' : '#',
- 'alt' : label,
'title' : label,
'rel' : id,
+ 'role' :
'button',
'class' : 'tool
tool-button wikiEditor-toolbar-spritedButton'
} )
.text( label )
@@ -336,6 +336,7 @@
'alt' : label,
'title' : label,
'rel' : id,
+ 'role' : 'button',
'class' : 'tool
tool-button'
} );
}
@@ -575,7 +576,12 @@
var $link =
$( '<a/>' )
.addClass( selected == id ? 'current' : null )
- .attr( 'href', '#' )
+ .attr( {
+ href: '#',
+ role: 'button',
+ 'aria-pressed': 'false',
+ 'aria-controls': 'wikiEditor-section-'
+ id
+ } )
.text( $.wikiEditor.autoMsg( section, 'label' )
)
.data( 'context', context )
.mouseup( function( e ) {
@@ -587,14 +593,23 @@
return false;
} )
.click( function( e ) {
+ // We have to set aria-pressed over
here, as NVDA wont recognize it
+ // if we do it in the below .each as it
seems
+ $(this).attr( 'aria-pressed', 'true' );
+ $( '.tab > a' ).each( function( i, elem
) {
+ if ( elem !== e.target ) {
+ $( elem ).attr(
'aria-pressed', 'false' );
+ }
+ } );
var $sections = $(this).data( 'context'
).$ui.find( '.sections' );
var $section =
$(this).data( 'context'
).$ui.find( '.section-' + $(this).parent().attr( 'rel' ) );
var show = $section.css( 'display' ) ==
'none';
- var $previousSections =
$section.parent().find( '.section-visible' );
- $previousSections.css( 'position',
'absolute' );
- $previousSections.removeClass(
'section-visible' );
- $previousSections.fadeOut( 'fast',
function() { $(this).css( 'position', 'static' ); } );
+ $section.parent().find(
'.section-visible' )
+ .css( 'position', 'absolute' )
+ .attr( 'aria-expanded', 'false'
)
+ .removeClass( 'section-visible'
)
+ .fadeOut( 'fast', function() {
$(this).css( 'position', 'static' ); } );
$(this).parent().parent().find( 'a'
).removeClass( 'current' );
$sections.css( 'overflow', 'hidden' );
var animate = function( $that ) {
@@ -606,8 +621,9 @@
} );
};
if ( show ) {
- $section.addClass(
'section-visible' );
- $section.fadeIn( 'fast' );
+ $section.addClass(
'section-visible' )
+ .attr( 'aria-expanded',
'true' )
+ .fadeIn( 'fast' );
if ( $section.hasClass(
'loading' ) ) {
// Loading of this
section was deferred, load it now
var $that = $(this);
@@ -646,7 +662,11 @@
.append( $link );
},
buildSection: function( context, id, section ) {
- var $section = $( '<div/>' ).attr( { 'class': section.type + '
section section-' + id, 'rel': id } );
+ var $section = $( '<div/>' ).attr( {
+ 'class': section.type + ' section section-' + id,
+ 'rel': id,
+ id: 'wikiEditor-section-' + id
+ } );
var selected = $.cookie( 'wikiEditor-' + context.instance +
'-toolbar-section' );
var show = selected == id;
@@ -663,7 +683,10 @@
// Show or hide section
if ( id !== 'main' ) {
- $section.css( 'display', show ? 'block' : 'none' );
+ $section
+ .css( 'display', show ? 'block' : 'none' )
+ .attr( 'aria-expanded', show ? 'true' : 'false'
);
+
if ( show ) {
$section.addClass( 'section-visible' );
}
--
To view, visit https://gerrit.wikimedia.org/r/79639
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I27e18798d18b63655ea716eee2be1c7ab5303759
Gerrit-PatchSet: 3
Gerrit-Project: mediawiki/extensions/WikiEditor
Gerrit-Branch: master
Gerrit-Owner: Hoo man <h...@online.de>
Gerrit-Reviewer: Aude <aude.w...@gmail.com>
Gerrit-Reviewer: Bartosz Dziewoński <matma....@gmail.com>
Gerrit-Reviewer: Catrope <roan.katt...@gmail.com>
Gerrit-Reviewer: Daniel Kinzler <daniel.kinz...@wikimedia.de>
Gerrit-Reviewer: Daniel Werner <daniel.wer...@wikimedia.de>
Gerrit-Reviewer: Hoo man <h...@online.de>
Gerrit-Reviewer: Krinkle <krinklem...@gmail.com>
Gerrit-Reviewer: TheDJ <hartman.w...@gmail.com>
Gerrit-Reviewer: jenkins-bot
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
