Make the tabIndex hook first a propHook and add it to attrHooks for b…

…ack-compat reasons. Fixes #9979.
langpavel · Aug 4, 2011 · fd4ee2a · fd4ee2a
1 parent 3cfb134
commit fd4ee2a
Show file tree

Hide file tree

Showing 2 changed files with 75 additions and 15 deletions.
diff --git a/src/attributes.js b/src/attributes.js
@@ -405,19 +405,6 @@ jQuery.extend({
 				}
 			}
 		},
-		tabIndex: {
-			get: function( elem ) {
-				// elem.tabIndex doesn't always return the correct value when it hasn't been explicitly set
-				// http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/
-				var attributeNode = elem.getAttributeNode("tabIndex");
-
-				return attributeNode && attributeNode.specified ?
-					parseInt( attributeNode.value, 10 ) :
-					rfocusable.test( elem.nodeName ) || rclickable.test( elem.nodeName ) && elem.href ?
-						0 :
-						undefined;
-			}
-		},
 		// Use the value property for back compat
 		// Use the formHook for button elements in IE6/7 (#1954)
 		value: {
@@ -480,7 +467,7 @@ jQuery.extend({
 			}
 
 		} else {
-			if ( hooks && "get" in hooks && (ret = hooks.get( elem, name )) !== undefined ) {
+			if ( hooks && "get" in hooks && (ret = hooks.get( elem, name )) !== null ) {
 				return ret;
 
 			} else {
@@ -489,9 +476,26 @@ jQuery.extend({
 		}
 	},
 
-	propHooks: {}
+	propHooks: {
+		tabIndex: {
+			get: function( elem ) {
+				// elem.tabIndex doesn't always return the correct value when it hasn't been explicitly set
+				// http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/
+				var attributeNode = elem.getAttributeNode("tabIndex");
+
+				return attributeNode && attributeNode.specified ?
+					parseInt( attributeNode.value, 10 ) :
+					rfocusable.test( elem.nodeName ) || rclickable.test( elem.nodeName ) && elem.href ?
+						0 :
+						undefined;
+			}
+		}
+	}
 });
 
+// Add the tabindex propHook to attrHooks for back-compat
+jQuery.attrHooks.tabIndex = jQuery.propHooks.tabIndex;
+
 // Hook for boolean attributes
 boolHook = {
 	get: function( elem, name ) {
@@ -604,6 +608,7 @@ if ( !jQuery.support.optSelected ) {
 					parent.parentNode.selectedIndex;
 				}
 			}
+			return null;
 		}
 	});
 }

diff --git a/test/unit/attributes.js b/test/unit/attributes.js
@@ -527,6 +527,61 @@ test("prop(String, Object)", function() {
 	jQuery( document ).removeProp("nonexisting");
 });
 
+test("prop('tabindex')", function() {
+	expect(8);
+
+	// elements not natively tabbable
+	equals(jQuery("#listWithTabIndex").prop("tabindex"), 5, "not natively tabbable, with tabindex set to 0");
+	equals(jQuery("#divWithNoTabIndex").prop("tabindex"), undefined, "not natively tabbable, no tabindex set");
+
+	// anchor with href
+	equals(jQuery("#linkWithNoTabIndex").prop("tabindex"), 0, "anchor with href, no tabindex set");
+	equals(jQuery("#linkWithTabIndex").prop("tabindex"), 2, "anchor with href, tabindex set to 2");
+	equals(jQuery("#linkWithNegativeTabIndex").prop("tabindex"), -1, "anchor with href, tabindex set to -1");
+
+	// anchor without href
+	equals(jQuery("#linkWithNoHrefWithNoTabIndex").prop("tabindex"), undefined, "anchor without href, no tabindex set");
+	equals(jQuery("#linkWithNoHrefWithTabIndex").prop("tabindex"), 1, "anchor without href, tabindex set to 2");
+	equals(jQuery("#linkWithNoHrefWithNegativeTabIndex").prop("tabindex"), -1, "anchor without href, no tabindex set");
+});
+
+test("prop('tabindex', value)", function() {
+	expect(9);
+
+	var element = jQuery("#divWithNoTabIndex");
+	equals(element.prop("tabindex"), undefined, "start with no tabindex");
+
+	// set a positive string
+	element.prop("tabindex", "1");
+	equals(element.prop("tabindex"), 1, "set tabindex to 1 (string)");
+
+	// set a zero string
+	element.prop("tabindex", "0");
+	equals(element.prop("tabindex"), 0, "set tabindex to 0 (string)");
+
+	// set a negative string
+	element.prop("tabindex", "-1");
+	equals(element.prop("tabindex"), -1, "set tabindex to -1 (string)");
+
+	// set a positive number
+	element.prop("tabindex", 1);
+	equals(element.prop("tabindex"), 1, "set tabindex to 1 (number)");
+
+	// set a zero number
+	element.prop("tabindex", 0);
+	equals(element.prop("tabindex"), 0, "set tabindex to 0 (number)");
+
+	// set a negative number
+	element.prop("tabindex", -1);
+	equals(element.prop("tabindex"), -1, "set tabindex to -1 (number)");
+
+	element = jQuery("#linkWithTabIndex");
+	equals(element.prop("tabindex"), 2, "start with tabindex 2");
+
+	element.prop("tabindex", -1);
+	equals(element.prop("tabindex"), -1, "set negative tabindex");
+});
+
 test("removeProp(String)", function() {
 	expect(6);
 	var attributeNode = document.createAttribute("irrelevant"),