r1015 - in branches/experimental/tabbable: . tests

r1015 - in branches/experimental/tabbable: . tests


Author: a.farkas.pm
Date: Wed Nov 26 11:04:40 2008
New Revision: 1015
Modified:
branches/experimental/tabbable/tests/core.html
branches/experimental/tabbable/tests/core.js
branches/experimental/tabbable/ui.core.js
Log:
#3559: added some tests and enabled suggested getTabIndex-function
Modified: branches/experimental/tabbable/tests/core.html
==============================================================================
--- branches/experimental/tabbable/tests/core.html    (original)
+++ branches/experimental/tabbable/tests/core.html    Wed Nov 26 11:04:40 2008
@@ -66,6 +66,29 @@
        <input id="input4-3" tabindex="-1" />
        <input id="input4-4" tabindex="-50" />
    </div>
+    
+    <div id="wrap4">
+        <input id="input4-1" tabindex="0" />
+        <input id="input4-2" tabindex="10" />
+        <input id="input4-3" tabindex="-1" />
+        <input id="input4-4" tabindex="-50" />
+    </div>
+    
+    <div id="wrap5">
+        <div id="div5-1" tabindex="0"></div>
+        <div id="div5-2" tabindex="10"></div>
+        <div id="div5-3" tabindex="-1"></div>
+        <div id="div5-4" tabindex="-50"></div>
+        <div id="div5-5" tabindex="10" style="display: none;" /></div>
+    </div>
+    
+    <div id="wrap6">
+        <div id="div6-1"></div>
+        <div id="div6-2" tabindex="foo"></div>
+        <div id="div6-3" tabindex="3foo"></div>
+        <a href="#" id="anchor6-4" tabindex="foo">anchor</a>
+    </div>
+    
</div>
</body>
Modified: branches/experimental/tabbable/tests/core.js
==============================================================================
--- branches/experimental/tabbable/tests/core.js    (original)
+++ branches/experimental/tabbable/tests/core.js    Wed Nov 26 11:04:40 2008
@@ -53,4 +53,94 @@
    ok(!$('#input4-4').is(':tabbable'), 'input, tabindex -50');
});
+test("tabbable - natively tabbable with various tabindex", function() {
+    expect(4);
+    ok( $('#input4-1').is(':tabbable'), 'input, tabindex 0');
+    ok( $('#input4-2').is(':tabbable'), 'input, tabindex 10');
+    ok(!$('#input4-3').is(':tabbable'), 'input, tabindex -1');
+    ok(!$('#input4-4').is(':tabbable'), 'input, tabindex -50');
+});
+
+test("tabbable - not natively tabbable with tabindex", function() {
+    expect(5);
+    ok( $('#div5-1').is(':tabbable'), 'div, tabindex 0');
+    ok( $('#div5-2').is(':tabbable'), 'div, tabindex 10');
+    ok(!$('#div5-3').is(':tabbable'), 'div, tabindex -1');
+    ok(!$('#div5-4').is(':tabbable'), 'div, tabindex -50');
+    ok(!$('#div5-5').is(':tabbable'), 'div, - display: none tabindex 10');
+});
+
+test("tabbable - wrong or without tabindex", function() {
+    expect(4);
+    ok(!$('#div6-1').is(':tabbable'), 'div, without tabindex');
+    ok(!$('#div6-2').is(':tabbable'), 'div, tabindex foo');
+    //do we have to mess with this?
+    ok(!$('#div6-3').is(':tabbable'), 'div, tabindex 3foo');
+    ok($('#anchor6-4').is(':tabbable'), 'a, tabindex foo');
+});
+
+//focus
+
+test("focusable - enabled elements", function() {
+    expect(10);
+    ok( $('#input1-1').is(':focusable'), 'input, no type');
+    ok( $('#input1-2').is(':focusable'), 'input, type text');
+    ok( $('#input1-3').is(':focusable'), 'input, type checkbox');
+    ok( $('#input1-4').is(':focusable'), 'input, type radio');
+    ok( $('#input1-5').is(':focusable'), 'input, type button');
+    ok(!$('#input1-6').is(':focusable'), 'input, type hidden');
+    ok( $('#input1-7').is(':focusable'), 'select');
+    ok( $('#input1-8').is(':focusable'), 'textarea');
+    ok( $('#anchor1-1').is(':focusable'), 'anchor with href');
+    ok(!$('#anchor1-2').is(':focusable'), 'anchor without href');
+});
+
+test("focusable - disabled elements", function() {
+    expect(8);
+    ok(!$('#input2-1').is(':focusable'), 'input, no type');
+    ok(!$('#input2-2').is(':focusable'), 'input, type text');
+    ok(!$('#input2-3').is(':focusable'), 'input, type checkbox');
+    ok(!$('#input2-4').is(':focusable'), 'input, type radio');
+    ok(!$('#input2-5').is(':focusable'), 'input, type button');
+    ok(!$('#input2-6').is(':focusable'), 'input, type hidden');
+    ok(!$('#input2-7').is(':focusable'), 'select');
+    ok(!$('#input2-8').is(':focusable'), 'textarea');
+});
+
+test("focusable - hidden styles", function() {
+    expect(6);
+    ok(!$('#input3-1').is(':focusable'), 'input, hidden wrapper - display:
none');
+    ok(!$('#anchor3-1').is(':focusable'), 'anchor, hidden wrapper - display:
none');
+    ok(!$('#input3-2').is(':focusable'), 'input, hidden wrapper - visibility:
hidden');
+    ok(!$('#anchor3-2').is(':focusable'), 'anchor, hidden wrapper -
visibility: hidden');
+    ok(!$('#input3-3').is(':focusable'), 'input, display: none');
+    ok(!$('#input3-4').is(':focusable'), 'input, visibility: hidden');
+});
+
+test("focusable - natively tabbable with various tabindex", function() {
+    expect(4);
+    ok( $('#input4-1').is(':focusable'), 'input, tabindex 0');
+    ok( $('#input4-2').is(':focusable'), 'input, tabindex 10');
+    ok($('#input4-3').is(':focusable'), 'input, tabindex -1');
+    ok($('#input4-4').is(':focusable'), 'input, tabindex -50');
+});
+
+test("focusable - not natively tabbable with tabindex", function() {
+    expect(5);
+    ok( $('#div5-1').is(':focusable'), 'div, tabindex 0');
+    ok( $('#div5-2').is(':focusable'), 'div, tabindex 10');
+    ok($('#div5-3').is(':focusable'), 'div, tabindex -1');
+    ok($('#div5-4').is(':focusable'), 'div, tabindex -50');
+    ok(!$('#div5-5').is(':focusable'), 'div, - display: none tabindex 10');
+});
+
+test("focusable - wrong or without tabindex", function() {
+    expect(4);
+    ok(!$('#div6-1').is(':focusable'), 'div, without tabindex');
+    ok(!$('#div6-2').is(':focusable'), 'div, tabindex foo');
+    //do we have to mess with this?
+    ok(!$('#div6-3').is(':focusable'), 'div, tabindex 3foo');
+    ok($('#anchor6-4').is(':focusable'), 'a, tabindex foo');
+});
+
})(jQuery);
Modified: branches/experimental/tabbable/ui.core.js
==============================================================================
--- branches/experimental/tabbable/ui.core.js    (original)
+++ branches/experimental/tabbable/ui.core.js    Wed Nov 26 11:04:40 2008
@@ -15,24 +15,9 @@
        ? 'tabIndex'
        : 'tabindex');
-//
-//// Can this replace hasTabindexAttr and getTabIndex below?
-//function getTabIndex(element) {
-//    var attr = elem.getAttributeNode(normalizedTabindex);
-//    return attr && attr.specified && attr.value || undefined;
-//}
-
-function hasTabindexAttr(element) {
-    var attributeNode = element.getAttributeNode(normalizedTabindex);
-    return attributeNode ? attributeNode.specified : false;
-}
-
function getTabIndex(element) {
-    if (!hasTabindexAttr(element)) {
-        return undefined;
-    }
-    var value = parseInt(element.getAttribute(normalizedTabindex), 10);
-    return !isNaN(value) ? value : undefined;
+    var attr = element.getAttributeNode(normalizedTabindex);
+    return attr && attr.specified && attr.value || undefined;
}
$.extend($.expr[':'], {