Skip to main content

Search and Top Navigation

Ticket #3482: progress-aria.3.diff


File progress-aria.3.diff, 2.1 KB (added by davidb, October 28, 2008 06:45PM UTC)

improved tests.

Index: tests/progressbar.js
===================================================================
--- tests/progressbar.js	(revision 846)
+++ tests/progressbar.js	(working copy)
@@ -52,5 +52,20 @@
 
 });
 
+test("accessibility", function() {
+	expect(7);
+	el = $("#progressbar").progressbar();
 
+	equals(el.ariaRole(), "progressbar", "aria role");
+	equals(el.ariaState("valuemin"), 0, "aria-valuemin");
+	equals(el.ariaState("valuemax"), 100, "aria-valuemax");
+	equals(el.ariaState("valuenow"), 0, "aria-valuenow initially");
+	el.progressbar("progress", 77);
+	equals(el.ariaState("valuenow"), 77, "aria-valuenow");
+	el.progressbar("disable");
+	equals(el.ariaState("disabled"), "true", "aria-disabled");
+	el.progressbar("enable");
+	equals(el.ariaState("disabled"), "false", "enabled");
+});
+
 })(jQuery);
Index: ui/ui.progressbar.js
===================================================================
--- ui/ui.progressbar.js	(revision 846)
+++ ui/ui.progressbar.js	(working copy)
@@ -23,7 +23,10 @@
 			text = options.text || '0%';
 		
 		this.element.addClass("ui-progressbar").width(options.width);
-		
+		this.element.ariaRole("progressbar");
+		this.element.ariaState("valuemin","0");
+		this.element.ariaState("valuemax","100");
+		this.element.ariaState("valuenow","0");
 		$.extend(this, {
 			active: false,
 			pixelState: 0,
@@ -97,11 +100,13 @@
 	disable: function() {
 		this.element.addClass("ui-progressbar-disabled");
 		this.disabled = true;
+		this.element.ariaState("disabled", true);
 	},
 	
 	enable: function() {
 		this.element.removeClass("ui-progressbar-disabled");
 		this.disabled = false;
+		this.element.ariaState("disabled", false);
 	},
 	
 	pause: function() {
@@ -120,9 +125,11 @@
 		this.bar.width(this.pixelState);
 		this.textElement.width(this.pixelState);
 		
+		var percent = Math.round(this.percentState);
 		if (this.options.range && !this.options.text) {
-			this.textElement.html(Math.round(this.percentState) + '%');
+			this.textElement.html(percent + '%');
 		}
+		this.element.ariaState("valuenow", percent);
 		this._propagate('progress', this.ui());
 	},

Download in other formats:

Original Format