From fb3a5d40106a83d10734f203189dc390cfaa0b94 Mon Sep 17 00:00:00 2001 From: David Bolter Date: Mon, 22 Sep 2008 15:47:41 +0000 Subject: [PATCH] Added ariaRole and ariaState to ui.core with tests. Added ARIA role and state to ui.dialog Fixes #3350 (Inspired by jARIA plugin from Chris Hoffman) --- tests/core.html | 1 + tests/core.js | 15 +++++++++++++++ ui/ui.core.js | 27 +++++++++++++++++++++++++++ ui/ui.dialog.js | 2 ++ 4 files changed, 45 insertions(+) diff --git a/tests/core.html b/tests/core.html index 510d4f3a7..5da16011a 100644 --- a/tests/core.html +++ b/tests/core.html @@ -65,6 +65,7 @@ +
diff --git a/tests/core.js b/tests/core.js index 144c27265..f9885e684 100644 --- a/tests/core.js +++ b/tests/core.js @@ -53,4 +53,19 @@ test("tabbable - tabindex", function() { ok(!$('#input4-4').is(':tabbable'), 'input, tabindex -50'); }); +test("aria", function() { + expect(10); + + ok(!$('#aria').attr('role'), 'role is empty via attr'); + ok(!$('#aria').ariaRole(), 'role is empty via ariaRole'); + equals($('#aria').ariaRole('dialog').attr('role').replace(/^wairole:/, ""), 'dialog', 'role is dialog'); + equals($('#aria').ariaRole(), 'dialog', 'role is dialog'); + equals($('#aria').ariaRole('tablist').attr('role').replace(/^wairole:/, ""), 'tablist', 'role is tablist via attr'); + equals($('#aria').ariaRole(), 'tablist', 'role is tablist via ariaRole'); + ok(!$('#aria').attr('expanded'), 'state expanded absent via attr'); + ok(!$('#aria').ariaState('expanded'), 'state expanded absent via ariaState'); + equals($('#aria').ariaState('expanded', 'true').ariaState('expanded'), 'true', 'aria expanded is true'); + equals($('#aria').ariaState('expanded', 'false').ariaState('expanded'), 'false', 'aria expanded is false'); +}); + })(jQuery); diff --git a/ui/ui.core.js b/ui/ui.core.js index 2cf48d11f..be0caa920 100644 --- a/ui/ui.core.js +++ b/ui/ui.core.js @@ -437,4 +437,31 @@ $.ui.mouse.defaults = { delay: 0 }; + +// WAI-ARIA Semantics +var isFF2 = $.browser.mozilla && (parseFloat($.browser.version) < 1.9); +$.fn.extend({ + ariaRole : function(role) { + // setter? + if (role) { + return this.each(function(i, el) { + $(el).attr("role", isFF2 ? "wairole:" + role : role); + }); + } + // getter just returns first jquery member's role string + return (this.eq(0).attr("role") || "").replace(/^wairole:/, ""); + }, + + ariaState : function(state, value) { + // setter? + if (value) + return this.each(function(i, el) { + isFF2? el.setAttributeNS("http://www.w3.org/2005/07/aaa", "aaa:" + state, value) : + $(el).attr("aria-" + state, value); + }); + // getter + return this.attr(isFF2? "aaa:"+state : "aria-" + state); + } +}); + })(jQuery); diff --git a/ui/ui.dialog.js b/ui/ui.dialog.js index c0a99494c..c856af5ce 100644 --- a/ui/ui.dialog.js +++ b/ui/ui.dialog.js @@ -84,6 +84,8 @@ $.widget("ui.dialog", { (options.closeOnEscape && ev.keyCode && ev.keyCode == $.keyCode.ESCAPE && self.close()); }) + .ariaRole("dialog") + .ariaState("labelledby", titleId) .mousedown(function() { self._moveToTop(); }),