Accordion: set aria-selected to true on selected header, false on others. Fixed #7078 - Accordion: Set aria-selected

Author: rdworth

tests/unit/accordion/accordion_core.js

@@ -28,7 +28,7 @@ test( "ui-accordion-heading class added to headers anchor", function() {
 });
 
 test( "accessibility", function () {
-	expect( 9 );
+	expect( 13 );
 	var ac = $( "#list1" ).accordion().accordion( "option", "active", 1 );
 	var headers = $( ".ui-accordion-header" );
 
@@ -39,9 +39,13 @@ test( "accessibility", function () {
 	equals( headers.next().attr( "role" ), "tabpanel", "tabpanel roles" );
 	equals( headers.eq( 1 ).attr( "aria-expanded" ), "true", "active tab has aria-expanded" );
 	equals( headers.eq( 0 ).attr( "aria-expanded" ), "false", "inactive tab has aria-expanded" );
+	equals( headers.eq( 1 ).attr( "aria-selected" ), "true", "active tab has aria-selected" );
+	equals( headers.eq( 0 ).attr( "aria-selected" ), "false", "inactive tab has aria-selected" );
 	ac.accordion( "option", "active", 0 );
 	equals( headers.eq( 0 ).attr( "aria-expanded" ), "true", "newly active tab has aria-expanded" );
 	equals( headers.eq( 1 ).attr( "aria-expanded" ), "false", "newly inactive tab has aria-expanded" );
+	equals( headers.eq( 0 ).attr( "aria-selected" ), "true", "active tab has aria-selected" );
+	equals( headers.eq( 1 ).attr( "aria-selected" ), "false", "inactive tab has aria-selected" );
 });
 
 }( jQuery ) );

ui/jquery.ui.accordion.js

@@ -75,6 +75,7 @@ $.widget( "ui.accordion", {
 			.not( self.active )
 			.attr({
 				"aria-expanded": "false",
+				"aria-selected": "false",
 				tabIndex: -1
 			})
 			.next()
@@ -87,6 +88,7 @@ $.widget( "ui.accordion", {
 			self.active
 				.attr({
 					"aria-expanded": "true",
+					"aria-selected": "true",
 					tabIndex: 0
 				});
 		}
@@ -129,6 +131,7 @@ $.widget( "ui.accordion", {
 			.removeClass( "ui-accordion-header ui-accordion-disabled ui-helper-reset ui-state-default ui-corner-all ui-state-active ui-state-disabled ui-corner-top" )
 			.removeAttr( "role" )
 			.removeAttr( "aria-expanded" )
+			.removeAttr( "aria-selected" )
 			.removeAttr( "tabIndex" )
 			.find( "a" )
 				.removeAttr( "tabIndex" )
@@ -387,12 +390,14 @@ $.widget( "ui.accordion", {
 		toHide.prev()
 			.attr({
 				"aria-expanded": "false",
+				"aria-selected": "false",
 				tabIndex: -1
 			})
 			.blur();
 		toShow.prev()
 			.attr({
 				"aria-expanded": "true",
+				"aria-selected": "true",
 				tabIndex: 0
 			})
 			.focus();