From 0080f2d5813747cbbe44021197e352564e02b782 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Scott=20Gonz=C3=A1lez?= Date: Tue, 12 Jul 2011 11:36:34 -0400 Subject: [PATCH] Use .attr() for boolean ARIA attributes. --- tests/unit/accordion/accordion_core.js | 16 ++++----- tests/unit/progressbar/progressbar_core.js | 4 +-- ui/jquery.ui.accordion.js | 39 +++++++++++----------- ui/jquery.ui.autocomplete.js | 6 ++-- ui/jquery.ui.button.js | 16 ++++----- ui/jquery.ui.menu.js | 24 ++++++------- ui/jquery.ui.menubar.js | 30 ++++++++--------- ui/jquery.ui.popup.js | 16 ++++----- ui/jquery.ui.widget.js | 4 +-- 9 files changed, 77 insertions(+), 78 deletions(-) diff --git a/tests/unit/accordion/accordion_core.js b/tests/unit/accordion/accordion_core.js index 7bf71c31b..280339c26 100644 --- a/tests/unit/accordion/accordion_core.js +++ b/tests/unit/accordion/accordion_core.js @@ -39,15 +39,15 @@ test( "accessibility", function () { equals( element.attr( "role" ), "tablist", "main role" ); equals( headers.attr( "role" ), "tab", "tab roles" ); equals( headers.next().attr( "role" ), "tabpanel", "tabpanel roles" ); - equals( headers.eq( 1 ).prop( "aria-expanded" ), true, "active tab has aria-expanded" ); - equals( headers.eq( 0 ).prop( "aria-expanded" ), false, "inactive tab has aria-expanded" ); - equals( headers.eq( 1 ).prop( "aria-selected" ), true, "active tab has aria-selected" ); - equals( headers.eq( 0 ).prop( "aria-selected" ), false, "inactive tab has aria-selected" ); + 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" ); element.accordion( "option", "active", 0 ); - equals( headers.eq( 0 ).prop( "aria-expanded" ), true, "newly active tab has aria-expanded" ); - equals( headers.eq( 1 ).prop( "aria-expanded" ), false, "newly inactive tab has aria-expanded" ); - equals( headers.eq( 0 ).prop( "aria-selected" ), true, "active tab has aria-selected" ); - equals( headers.eq( 1 ).prop( "aria-selected" ), false, "inactive tab has aria-selected" ); + 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 ) ); diff --git a/tests/unit/progressbar/progressbar_core.js b/tests/unit/progressbar/progressbar_core.js index 2380061db..a499d858c 100644 --- a/tests/unit/progressbar/progressbar_core.js +++ b/tests/unit/progressbar/progressbar_core.js @@ -19,10 +19,10 @@ test("accessibility", function() { el.progressbar("value", 77); equals(el.attr("aria-valuenow"), 77, "aria-valuenow"); el.progressbar("disable"); - equals(el.prop("aria-disabled"), true, "aria-disabled on"); + equals(el.attr("aria-disabled"), "true", "aria-disabled on"); el.progressbar("enable"); // FAIL: for some reason IE6 and 7 return a boolean false instead of the string - equals(el.prop("aria-disabled"), false, "aria-disabled off"); + equals(el.attr("aria-disabled"), "false", "aria-disabled off"); }); })(jQuery); diff --git a/ui/jquery.ui.accordion.js b/ui/jquery.ui.accordion.js index fc0ba3910..14b67586e 100644 --- a/ui/jquery.ui.accordion.js +++ b/ui/jquery.ui.accordion.js @@ -78,11 +78,11 @@ $.widget( "ui.accordion", { self.headers .not( self.active ) - .prop({ - "aria-expanded": false, - "aria-selected": false + .attr({ + "aria-expanded": "false", + "aria-selected": "false", + tabIndex: -1 }) - .attr( "tabIndex", -1 ) .next() .hide(); @@ -90,12 +90,11 @@ $.widget( "ui.accordion", { if ( !self.active.length ) { self.headers.eq( 0 ).attr( "tabIndex", 0 ); } else { - self.active - .prop({ - "aria-expanded": true, - "aria-selected": true - }) - .attr( "tabIndex", 0 ); + self.active.attr({ + "aria-expanded": "true", + "aria-selected": "true", + tabIndex: 0 + }); } // only need links in tab order for Safari @@ -135,8 +134,8 @@ $.widget( "ui.accordion", { .unbind( ".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" ) - .removeProp( "aria-expanded" ) - .removeProp( "aria-selected" ) + .removeAttr( "aria-expanded" ) + .removeAttr( "aria-selected" ) .removeAttr( "tabIndex" ) .find( "a" ) .removeAttr( "tabIndex" ) @@ -393,18 +392,18 @@ $.widget( "ui.accordion", { // TODO assert that the blur and focus triggers are really necessary, remove otherwise toHide.prev() - .prop({ - "aria-expanded": false, - "aria-selected": false + .attr({ + "aria-expanded": "false", + "aria-selected": "false", + tabIndex: -1 }) - .attr( "tabIndex", -1 ) .blur(); toShow.prev() - .prop({ - "aria-expanded": true, - "aria-selected": true + .attr({ + "aria-expanded": "true", + "aria-selected": "true", + tabIndex: 0 }) - .attr( "tabIndex", 0 ) .focus(); }, diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js index 3f5e2d10a..59caf625d 100644 --- a/ui/jquery.ui.autocomplete.js +++ b/ui/jquery.ui.autocomplete.js @@ -59,9 +59,9 @@ $.widget( "ui.autocomplete", { // TODO verify these actually work as intended .attr({ role: "textbox", - "aria-autocomplete": "list" + "aria-autocomplete": "list", + "aria-haspopup": "true" }) - .prop( "aria-haspopup", true ) .bind( "keydown.autocomplete", function( event ) { if ( self.options.disabled || self.element.prop( "readonly" ) ) { suppressKeyPress = true; @@ -268,7 +268,7 @@ $.widget( "ui.autocomplete", { .removeAttr( "autocomplete" ) .removeAttr( "role" ) .removeAttr( "aria-autocomplete" ) - .removeProp( "aria-haspopup" ); + .removeAttr( "aria-haspopup" ); this.menu.element.remove(); }, diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index 5f48f69a2..ad17ab0c1 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -147,7 +147,7 @@ $.widget( "ui.button", { return false; } $( this ).toggleClass( "ui-state-active" ); - self.buttonElement.prop( "aria-pressed", self.element[0].checked ); + self.buttonElement.attr( "aria-pressed", self.element[0].checked ); }); } else if ( this.type === "radio" ) { this.buttonElement.bind( "click.button", function() { @@ -155,7 +155,7 @@ $.widget( "ui.button", { return false; } $( this ).addClass( "ui-state-active" ); - self.buttonElement.prop( "aria-pressed", true ); + self.buttonElement.attr( "aria-pressed", "true" ); var radio = self.element[ 0 ]; radioGroup( radio ) @@ -164,7 +164,7 @@ $.widget( "ui.button", { return $( this ).button( "widget" )[ 0 ]; }) .removeClass( "ui-state-active" ) - .prop( "aria-pressed", false ); + .attr( "aria-pressed", "false" ); }); } else { this.buttonElement @@ -260,7 +260,7 @@ $.widget( "ui.button", { this.buttonElement .removeClass( baseClasses + " " + stateClasses + " " + typeClasses ) .removeAttr( "role" ) - .removeProp( "aria-pressed" ) + .removeAttr( "aria-pressed" ) .html( this.buttonElement.find(".ui-button-text").html() ); if ( !this.hasTitle ) { @@ -291,22 +291,22 @@ $.widget( "ui.button", { if ( $( this ).is( ":checked" ) ) { $( this ).button( "widget" ) .addClass( "ui-state-active" ) - .prop( "aria-pressed", true ); + .attr( "aria-pressed", "true" ); } else { $( this ).button( "widget" ) .removeClass( "ui-state-active" ) - .prop( "aria-pressed", false ); + .attr( "aria-pressed", "false" ); } }); } else if ( this.type === "checkbox" ) { if ( this.element.is( ":checked" ) ) { this.buttonElement .addClass( "ui-state-active" ) - .prop( "aria-pressed", true ); + .attr( "aria-pressed", "true" ); } else { this.buttonElement .removeClass( "ui-state-active" ) - .prop( "aria-pressed", false ); + .attr( "aria-pressed", "false" ); } } }, diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 8045797ae..aa01e91b9 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -178,8 +178,8 @@ $.widget("ui.menu", { .removeAttr( "role" ) .removeAttr("tabIndex") .removeAttr( "aria-labelledby" ) - .removeProp( "aria-expanded" ) - .removeProp( "aria-hidden" ) + .removeAttr( "aria-expanded" ) + .removeAttr( "aria-hidden" ) .show(); //destroy menu items @@ -191,7 +191,7 @@ $.widget("ui.menu", { .removeClass( "ui-corner-all ui-state-hover" ) .removeAttr( "tabIndex" ) .removeAttr( "role" ) - .removeProp( "aria-haspopup" ) + .removeAttr( "aria-haspopup" ) .removeAttr( "id" ) .children(".ui-icon").remove(); }, @@ -203,9 +203,9 @@ $.widget("ui.menu", { .addClass( "ui-menu ui-widget ui-widget-content ui-corner-all" ) .attr("role", "menu") .hide() - .prop({ - "aria-hidden": true, - "aria-expanded": false + .attr({ + "aria-hidden": "true", + "aria-expanded": "false" }); // don't refresh list items that are already adapted @@ -222,7 +222,7 @@ $.widget("ui.menu", { submenus.each(function() { var menu = $(this); var item = menu.prev("a") - item.prop("aria-haspopup", true) + item.attr("aria-haspopup", "true") .prepend(''); menu.attr("aria-labelledby", item.attr("id")); }); @@ -290,19 +290,19 @@ $.widget("ui.menu", { _open: function(submenu) { clearTimeout(this.timer); - this.element.find(".ui-menu").not(submenu.parents()).hide().prop("aria-hidden", true); + this.element.find(".ui-menu").not(submenu.parents()).hide().attr("aria-hidden", "true"); var position = $.extend({}, { of: this.active }, $.type(this.options.position) == "function" ? this.options.position(this.active) : this.options.position ); - submenu.show().removeProp("aria-hidden").prop("aria-expanded", true).position(position); + submenu.show().removeAttr("aria-hidden").attr("aria-expanded", "true").position(position); }, closeAll: function() { this.element - .find("ul").hide().prop("aria-hidden", true).prop("aria-expanded", false).end() + .find("ul").hide().attr("aria-hidden", "true").attr("aria-expanded", "false").end() .find("a.ui-state-active").removeClass("ui-state-active"); this.blur(); this.activeMenu = this.element; @@ -310,14 +310,14 @@ $.widget("ui.menu", { _close: function() { this.active.parent() - .find("ul").hide().prop("aria-hidden", true).prop("aria-expanded", false).end() + .find("ul").hide().attr("aria-hidden", "true").attr("aria-expanded", "false").end() .find("a.ui-state-active").removeClass("ui-state-active"); }, left: function(event) { var newItem = this.active && this.active.parents("li:not(.ui-menubar-item)").first(); if (newItem && newItem.length) { - this.active.parent().prop("aria-hidden", true).prop("aria-expanded", false).hide(); + this.active.parent().attr("aria-hidden", "true").attr("aria-expanded", "false").hide(); this.focus(event, newItem); return true; } diff --git a/ui/jquery.ui.menubar.js b/ui/jquery.ui.menubar.js index 2ce59bd6c..0f80f4fda 100644 --- a/ui/jquery.ui.menubar.js +++ b/ui/jquery.ui.menubar.js @@ -48,9 +48,9 @@ $.widget( "ui.menubar", { } }) .hide() - .prop({ - "aria-hidden": true, - "aria-expanded": false + .attr({ + "aria-hidden": "true", + "aria-expanded": "false" }) .bind( "keydown.menubar", function( event ) { var menu = $( this ); @@ -108,7 +108,7 @@ $.widget( "ui.menubar", { }) .addClass( "ui-button ui-widget ui-button-text-only ui-menubar-link" ) .attr( "role", "menuitem" ) - .prop( "aria-haspopup", true ) + .attr( "aria-haspopup", "true" ) .wrapInner( "" ); // TODO review if these options are a good choice, maybe they can be merged @@ -158,7 +158,7 @@ $.widget( "ui.menubar", { .unbind( ".menubar" ) .removeClass( "ui-button ui-widget ui-button-text-only ui-menubar-link ui-state-default" ) .removeAttr( "role" ) - .removeProp( "aria-haspopup" ) + .removeAttr( "aria-haspopup" ) // TODO unwrap? .children( "span.ui-button-text" ).each(function( i, e ) { var item = $( this ); @@ -170,8 +170,8 @@ $.widget( "ui.menubar", { this.element.find( ":ui-menu" ) .menu( "destroy" ) .show() - .removeProp( "aria-hidden" ) - .removeProp( "aria-expanded" ) + .removeAttr( "aria-hidden" ) + .removeAttr( "aria-expanded" ) .removeAttr( "tabindex" ) .unbind( ".menubar" ); }, @@ -182,9 +182,9 @@ $.widget( "ui.menubar", { this.active .menu( "closeAll" ) .hide() - .prop({ - "aria-hidden": true, - "aria-expanded": false + .attr({ + "aria-hidden": "true", + "aria-expanded": "false" }); this.active .prev() @@ -204,9 +204,9 @@ $.widget( "ui.menubar", { this.active .menu( "closeAll" ) .hide() - .prop({ - "aria-hidden": true, - "aria-expanded": false + .attr({ + "aria-hidden": "true", + "aria-expanded": "false" }); this.active .prev() @@ -221,8 +221,8 @@ $.widget( "ui.menubar", { at: "left bottom", of: button }) - .removeProp( "aria-hidden" ) - .prop( "aria-expanded", true ) + .removeAttr( "aria-hidden" ) + .attr( "aria-expanded", "true" ) .menu("focus", event, menu.children( "li" ).first() ) // TODO need a comment here why both events are triggered .focus() diff --git a/ui/jquery.ui.popup.js b/ui/jquery.ui.popup.js index 4c9f20c06..b506a641f 100644 --- a/ui/jquery.ui.popup.js +++ b/ui/jquery.ui.popup.js @@ -41,7 +41,7 @@ $.widget( "ui.popup", { } this.options.trigger - .prop( "aria-haspopup", true ) + .attr( "aria-haspopup", "true" ) .attr( "aria-owns", this.element.attr( "id" ) ); this.element @@ -118,11 +118,11 @@ $.widget( "ui.popup", { this.element .show() .removeClass( "ui-popup" ) - .removeProp( "aria-hidden" ) - .removeProp( "aria-expanded" ); + .removeAttr( "aria-hidden" ) + .removeAttr( "aria-expanded" ); this.options.trigger - .removeProp( "aria-haspopup" ) + .removeAttr( "aria-haspopup" ) .removeAttr( "aria-owns" ); if ( this.generatedId ) { @@ -140,8 +140,8 @@ $.widget( "ui.popup", { this.element .show() - .prop( "aria-hidden", false ) - .prop( "aria-expanded", true ) + .attr( "aria-hidden", "false" ) + .attr( "aria-expanded", "true" ) .position( position ) // TODO find a focussable child, otherwise put focus on element, add tabIndex=0 if not focussable .focus(); @@ -160,8 +160,8 @@ $.widget( "ui.popup", { close: function( event ) { this.element .hide() - .prop( "aria-hidden", true ) - .prop( "aria-expanded", false ); + .attr( "aria-hidden", "true" ) + .attr( "aria-expanded", "false" ); this.options.trigger.attr("tabindex", 0); diff --git a/ui/jquery.ui.widget.js b/ui/jquery.ui.widget.js index 8079f0357..00bc07c4f 100644 --- a/ui/jquery.ui.widget.js +++ b/ui/jquery.ui.widget.js @@ -211,7 +211,7 @@ $.Widget.prototype = { .removeData( this.widgetName ); this.widget() .unbind( "." + this.widgetName ) - .removeProp( "aria-disabled" ) + .removeAttr( "aria-disabled" ) .removeClass( this.widgetBaseClass + "-disabled " + "ui-state-disabled" ); @@ -276,7 +276,7 @@ $.Widget.prototype = { if ( key === "disabled" ) { this.widget() .toggleClass( this.widgetBaseClass + "-disabled ui-state-disabled", !!value ) - .prop( "aria-disabled", value ); + .attr( "aria-disabled", value ); this.hoverable.removeClass( "ui-state-hover" ); this.focusable.removeClass( "ui-state-focus" ); } -- 2.39.5