Progressbar: Only remove aria-valuenow for indeterminate progressbars. Added more accessibility tests.

This commit is contained in:
Scott González 2012-12-06 09:35:41 -05:00
parent 8c763cdf98
commit f1be88e795
3 changed files with 14 additions and 6 deletions

View File

@ -1,8 +1,8 @@
TestHelpers.commonWidgetTests( "progressbar", { TestHelpers.commonWidgetTests( "progressbar", {
defaults: { defaults: {
disabled: false, disabled: false,
value: 0,
max: 100, max: 100,
value: 0,
//callbacks //callbacks
change: null, change: null,

View File

@ -1,7 +1,7 @@
module( "progressbar: core" ); module( "progressbar: core" );
test( "accessibility", function() { test( "accessibility", function() {
expect( 7 ); expect( 11 );
var element = $( "#progressbar" ).progressbar(); var element = $( "#progressbar" ).progressbar();
equal( element.attr( "role" ), "progressbar", "aria role" ); equal( element.attr( "role" ), "progressbar", "aria role" );
@ -12,9 +12,17 @@ test( "accessibility", function() {
element.progressbar( "value", 77 ); element.progressbar( "value", 77 );
equal( element.attr( "aria-valuenow" ), 77, "aria-valuenow" ); equal( element.attr( "aria-valuenow" ), 77, "aria-valuenow" );
element.progressbar( "option", "max", 150 );
equal( element.attr( "aria-valuemax" ), 150, "aria-valuemax" );
element.progressbar( "disable" ); element.progressbar( "disable" );
equal( element.attr( "aria-disabled" ), "true", "aria-disabled on" ); equal( element.attr( "aria-disabled" ), "true", "aria-disabled on" );
element.progressbar( "enable" ); element.progressbar( "enable" );
equal( element.attr( "aria-disabled" ), "false", "aria-disabled off" ); equal( element.attr( "aria-disabled" ), "false", "aria-disabled off" );
element.progressbar( "option", "value", false );
equal( element.attr( "aria-valuemin" ), 0, "aria-valuemin" );
equal( element.attr( "aria-valuemax" ), 150, "aria-valuemax" );
strictEqual( element.attr( "aria-valuenow" ), undefined, "aria-valuenow initially" );
}); });

View File

@ -33,10 +33,10 @@ $.widget( "ui.progressbar", {
this.element this.element
.addClass( "ui-progressbar ui-widget ui-widget-content ui-corner-all" ) .addClass( "ui-progressbar ui-widget ui-widget-content ui-corner-all" )
.attr({ .attr({
// Only set static values, aria-valuenow and aria-valuemax are
// set inside _refreshValue()
role: "progressbar", role: "progressbar",
"aria-valuemin": this.min, "aria-valuemin": this.min
"aria-valuemax": this.options.max,
"aria-valuenow": this.options.value
}); });
this.valueDiv = $( "<div class='ui-progressbar-value ui-widget-header ui-corner-left'></div>" ) this.valueDiv = $( "<div class='ui-progressbar-value ui-widget-header ui-corner-left'></div>" )
@ -126,7 +126,7 @@ $.widget( "ui.progressbar", {
.width( percentage.toFixed(0) + "%" ); .width( percentage.toFixed(0) + "%" );
if ( this.indeterminate ) { if ( this.indeterminate ) {
this.element.removeAttr( "aria-valuemax" ).removeAttr( "aria-valuenow" ); this.element.removeAttr( "aria-valuenow" );
if ( !this.overlayDiv ) { if ( !this.overlayDiv ) {
this.overlayDiv = $( "<div class='ui-progressbar-overlay'></div>" ).appendTo( this.valueDiv ); this.overlayDiv = $( "<div class='ui-progressbar-overlay'></div>" ).appendTo( this.valueDiv );
} }