[Summary view] [Print] [Text view]

   1  /*

   2   * selector unit tests

   3   */
   4  (function($) {
   5  
   6  module("selectors");
   7  
   8  function isFocusable(selector, msg) {
   9      ok($(selector).is(':focusable'), msg);
  10  }
  11  
  12  function isNotFocusable(selector, msg) {
  13      ok($(selector).length && !$(selector).is(':focusable'), msg);
  14  }
  15  
  16  function isTabbable(selector, msg) {
  17      ok($(selector).is(':tabbable'), msg);
  18  }
  19  
  20  function isNotTabbable(selector, msg) {
  21      ok($(selector).length && !$(selector).is(':tabbable'), msg);
  22  }
  23  
  24  test("data", function() {
  25      expect(15);
  26      
  27      var el;
  28  	function shouldHaveData(msg) {
  29          ok(el.is(':data(test)'), msg);
  30      }
  31  	function shouldNotHaveData(msg) {
  32          ok(!el.is(':data(test)'), msg);
  33      }
  34      
  35      el = $('<div/>');
  36      shouldNotHaveData('data never set');
  37      
  38      el = $('<div/>').data('test', null);
  39      shouldNotHaveData('data is null');
  40      
  41      el = $('<div/>').data('test', true);
  42      shouldHaveData('data set to true');
  43      
  44      el = $('<div/>').data('test', false);
  45      shouldNotHaveData('data set to false');
  46      
  47      el = $('<div/>').data('test', 0);
  48      shouldNotHaveData('data set to 0');
  49      
  50      el = $('<div/>').data('test', 1);
  51      shouldHaveData('data set to 1');
  52      
  53      el = $('<div/>').data('test', '');
  54      shouldNotHaveData('data set to empty string');
  55      
  56      el = $('<div/>').data('test', 'foo');
  57      shouldHaveData('data set to string');
  58      
  59      el = $('<div/>').data('test', []);
  60      shouldHaveData('data set to empty array');
  61      
  62      el = $('<div/>').data('test', [1]);
  63      shouldHaveData('data set to array');
  64      
  65      el = $('<div/>').data('test', {});
  66      shouldHaveData('data set to empty object');
  67      
  68      el = $('<div/>').data('test', {foo: 'bar'});
  69      shouldHaveData('data set to object');
  70      
  71      el = $('<div/>').data('test', new Date());
  72      shouldHaveData('data set to date');
  73      
  74      el = $('<div/>').data('test', /test/);
  75      shouldHaveData('data set to regexp');
  76      
  77      el = $('<div/>').data('test', function() {});
  78      shouldHaveData('data set to function');
  79  });
  80  
  81  test("focusable - visible, enabled elements", function() {
  82      expect(18);
  83      
  84      isFocusable('#visibleAncestor-inputTypeNone', 'input, no type');
  85      isFocusable('#visibleAncestor-inputTypeText', 'input, type text');
  86      isFocusable('#visibleAncestor-inputTypeCheckbox', 'input, type checkbox');
  87      isFocusable('#visibleAncestor-inputTypeRadio', 'input, type radio');
  88      isFocusable('#visibleAncestor-inputTypeButton', 'input, type button');
  89      isNotFocusable('#visibleAncestor-inputTypeHidden', 'input, type hidden');
  90      isFocusable('#visibleAncestor-button', 'button');
  91      isFocusable('#visibleAncestor-select', 'select');
  92      isFocusable('#visibleAncestor-textarea', 'textarea');
  93      isFocusable('#visibleAncestor-object', 'object');
  94      isFocusable('#visibleAncestor-anchorWithHref', 'anchor with href');
  95      isNotFocusable('#visibleAncestor-anchorWithoutHref', 'anchor without href');
  96      isFocusable('#visibleAncestor-areaWithHref', 'area with href');
  97      isNotFocusable('#visibleAncestor-areaWithoutHref', 'area without href');
  98      isNotFocusable('#visibleAncestor-span', 'span');
  99      isNotFocusable('#visibleAncestor-div', 'div');
 100      isFocusable("#visibleAncestor-spanWithTabindex", 'span with tabindex');
 101      isFocusable("#visibleAncestor-divWithNegativeTabindex", 'div with tabindex');
 102  });
 103  
 104  test("focusable - disabled elements", function() {
 105      expect(9);
 106      
 107      isNotFocusable('#disabledElement-inputTypeNone', 'input, no type');
 108      isNotFocusable('#disabledElement-inputTypeText', 'input, type text');
 109      isNotFocusable('#disabledElement-inputTypeCheckbox', 'input, type checkbox');
 110      isNotFocusable('#disabledElement-inputTypeRadio', 'input, type radio');
 111      isNotFocusable('#disabledElement-inputTypeButton', 'input, type button');
 112      isNotFocusable('#disabledElement-inputTypeHidden', 'input, type hidden');
 113      isNotFocusable('#disabledElement-button', 'button');
 114      isNotFocusable('#disabledElement-select', 'select');
 115      isNotFocusable('#disabledElement-textarea', 'textarea');
 116  });
 117  
 118  test("focusable - hidden styles", function() {
 119      expect(8);
 120      
 121      isNotFocusable('#displayNoneAncestor-input', 'input, display: none parent');
 122      isNotFocusable('#displayNoneAncestor-span', 'span with tabindex, display: none parent');
 123      
 124      isNotFocusable('#visibilityHiddenAncestor-input', 'input, visibility: hidden parent');
 125      isNotFocusable('#visibilityHiddenAncestor-span', 'span with tabindex, visibility: hidden parent');
 126      
 127      isNotFocusable('#displayNone-input', 'input, display: none');
 128      isNotFocusable('#visibilityHidden-input', 'input, visibility: hidden');
 129      
 130      isNotFocusable('#displayNone-span', 'span with tabindex, display: none');
 131      isNotFocusable('#visibilityHidden-span', 'span with tabindex, visibility: hidden');
 132  });
 133  
 134  test("focusable -  natively tabbable with various tabindex", function() {
 135      expect(4);
 136      
 137      isFocusable('#inputTabindex0', 'input, tabindex 0');
 138      isFocusable('#inputTabindex10', 'input, tabindex 10');
 139      isFocusable('#inputTabindex-1', 'input, tabindex -1');
 140      isFocusable('#inputTabindex-50', 'input, tabindex -50');
 141  });
 142  
 143  test("focusable -  not natively tabbable with various tabindex", function() {
 144      expect(4);
 145      
 146      isFocusable('#spanTabindex0', 'span, tabindex 0');
 147      isFocusable('#spanTabindex10', 'span, tabindex 10');
 148      isFocusable('#spanTabindex-1', 'span, tabindex -1');
 149      isFocusable('#spanTabindex-50', 'span, tabindex -50');
 150  });
 151  
 152  test("focusable - invalid tabindex", function() {
 153      expect(4);
 154      
 155      isFocusable('#inputTabindexfoo', 'input, tabindex foo');
 156      isFocusable('#inputTabindex3foo', 'input, tabindex 3foo');
 157      isNotFocusable('#spanTabindexfoo', 'span tabindex foo');
 158      isNotFocusable('#spanTabindex3foo', 'span, tabindex 3foo');
 159  });
 160  
 161  test("tabbable - visible, enabled elements", function() {
 162      expect(18);
 163      
 164      isTabbable('#visibleAncestor-inputTypeNone', 'input, no type');
 165      isTabbable('#visibleAncestor-inputTypeText', 'input, type text');
 166      isTabbable('#visibleAncestor-inputTypeCheckbox', 'input, type checkbox');
 167      isTabbable('#visibleAncestor-inputTypeRadio', 'input, type radio');
 168      isTabbable('#visibleAncestor-inputTypeButton', 'input, type button');
 169      isNotTabbable('#visibleAncestor-inputTypeHidden', 'input, type hidden');
 170      isTabbable('#visibleAncestor-button', 'button');
 171      isTabbable('#visibleAncestor-select', 'select');
 172      isTabbable('#visibleAncestor-textarea', 'textarea');
 173      isTabbable('#visibleAncestor-object', 'object');
 174      isTabbable('#visibleAncestor-anchorWithHref', 'anchor with href');
 175      isNotTabbable('#visibleAncestor-anchorWithoutHref', 'anchor without href');
 176      isTabbable('#visibleAncestor-areaWithHref', 'area with href');
 177      isNotTabbable('#visibleAncestor-areaWithoutHref', 'area without href');
 178      isNotTabbable('#visibleAncestor-span', 'span');
 179      isNotTabbable('#visibleAncestor-div', 'div');
 180      isTabbable("#visibleAncestor-spanWithTabindex", 'span with tabindex');
 181      isNotTabbable("#visibleAncestor-divWithNegativeTabindex", 'div with tabindex');
 182  });
 183  
 184  test("Tabbable - disabled elements", function() {
 185      expect(9);
 186      
 187      isNotTabbable('#disabledElement-inputTypeNone', 'input, no type');
 188      isNotTabbable('#disabledElement-inputTypeText', 'input, type text');
 189      isNotTabbable('#disabledElement-inputTypeCheckbox', 'input, type checkbox');
 190      isNotTabbable('#disabledElement-inputTypeRadio', 'input, type radio');
 191      isNotTabbable('#disabledElement-inputTypeButton', 'input, type button');
 192      isNotTabbable('#disabledElement-inputTypeHidden', 'input, type hidden');
 193      isNotTabbable('#disabledElement-button', 'button');
 194      isNotTabbable('#disabledElement-select', 'select');
 195      isNotTabbable('#disabledElement-textarea', 'textarea');
 196  });
 197  
 198  test("Tabbable - hidden styles", function() {
 199      expect(8);
 200      
 201      isNotTabbable('#displayNoneAncestor-input', 'input, display: none parent');
 202      isNotTabbable('#displayNoneAncestor-span', 'span with tabindex, display: none parent');
 203      
 204      isNotTabbable('#visibilityHiddenAncestor-input', 'input, visibility: hidden parent');
 205      isNotTabbable('#visibilityHiddenAncestor-span', 'span with tabindex, visibility: hidden parent');
 206      
 207      isNotTabbable('#displayNone-input', 'input, display: none');
 208      isNotTabbable('#visibilityHidden-input', 'input, visibility: hidden');
 209      
 210      isNotTabbable('#displayNone-span', 'span with tabindex, display: none');
 211      isNotTabbable('#visibilityHidden-span', 'span with tabindex, visibility: hidden');
 212  });
 213  
 214  test("Tabbable -  natively tabbable with various tabindex", function() {
 215      expect(4);
 216      
 217      isTabbable('#inputTabindex0', 'input, tabindex 0');
 218      isTabbable('#inputTabindex10', 'input, tabindex 10');
 219      isNotTabbable('#inputTabindex-1', 'input, tabindex -1');
 220      isNotTabbable('#inputTabindex-50', 'input, tabindex -50');
 221  });
 222  
 223  test("Tabbable -  not natively tabbable with various tabindex", function() {
 224      expect(4);
 225      
 226      isTabbable('#spanTabindex0', 'span, tabindex 0');
 227      isTabbable('#spanTabindex10', 'span, tabindex 10');
 228      isNotTabbable('#spanTabindex-1', 'span, tabindex -1');
 229      isNotTabbable('#spanTabindex-50', 'span, tabindex -50');
 230  });
 231  
 232  test("Tabbable - invalid tabindex", function() {
 233      expect(4);
 234      
 235      isTabbable('#inputTabindexfoo', 'input, tabindex foo');
 236      isTabbable('#inputTabindex3foo', 'input, tabindex 3foo');
 237      isNotTabbable('#spanTabindexfoo', 'span tabindex foo');
 238      isNotTabbable('#spanTabindex3foo', 'span, tabindex 3foo');
 239  });
 240  
 241  })(jQuery);