git.roojs.org Git - bootswatch/blob - 2/bower_components/bootstrap/js/tests/unit/bootstrap-typeahead.js

   1 $(function () {
   2
   3     module("bootstrap-typeahead")
   4
   5       test("should provide no conflict", function () {
   6         var typeahead = $.fn.typeahead.noConflict()
   7         ok(!$.fn.typeahead, 'typeahead was set back to undefined (org value)')
   8         $.fn.typeahead = typeahead
   9       })
  10
  11       test("should be defined on jquery object", function () {
  12         ok($(document.body).typeahead, 'alert method is defined')
  13       })
  14
  15       test("should return element", function () {
  16         ok($(document.body).typeahead()[0] == document.body, 'document.body returned')
  17       })
  18
  19       test("should listen to an input", function () {
  20         var $input = $('<input />')
  21         $input.typeahead()
  22         ok($._data($input[0], 'events').blur, 'has a blur event')
  23         ok($._data($input[0], 'events').keypress, 'has a keypress event')
  24         ok($._data($input[0], 'events').keyup, 'has a keyup event')
  25       })
  26
  27       test("should create a menu", function () {
  28         var $input = $('<input />')
  29         ok($input.typeahead().data('typeahead').$menu, 'has a menu')
  30       })
  31
  32       test("should listen to the menu", function () {
  33         var $input = $('<input />')
  34           , $menu = $input.typeahead().data('typeahead').$menu
  35
  36         ok($._data($menu[0], 'events').mouseover, 'has a mouseover(pseudo: mouseenter)')
  37         ok($._data($menu[0], 'events').click, 'has a click')
  38       })
  39
  40       test("should show menu when query entered", function () {
  41         var $input = $('<input />')
  42             .appendTo('body')
  43             .typeahead({
  44               source: ['aa', 'ab', 'ac']
  45             })
  46           , typeahead = $input.data('typeahead')
  47
  48         $input.val('a')
  49         typeahead.lookup()
  50
  51         ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
  52         equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
  53         equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
  54
  55         $input.remove()
  56         typeahead.$menu.remove()
  57       })
  58
  59       test("should accept data source via synchronous function", function () {
  60         var $input = $('<input />').typeahead({
  61               source: function () {
  62                 return ['aa', 'ab', 'ac']
  63               }
  64             }).appendTo('body')
  65           , typeahead = $input.data('typeahead')
  66
  67         $input.val('a')
  68         typeahead.lookup()
  69
  70         ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
  71         equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
  72         equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
  73
  74         $input.remove()
  75         typeahead.$menu.remove()
  76       })
  77
  78       test("should accept data source via asynchronous function", function () {
  79         var $input = $('<input />').typeahead({
  80               source: function (query, process) {
  81                 process(['aa', 'ab', 'ac'])
  82               }
  83             }).appendTo('body')
  84           , typeahead = $input.data('typeahead')
  85
  86         $input.val('a')
  87         typeahead.lookup()
  88
  89         ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
  90         equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
  91         equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
  92
  93         $input.remove()
  94         typeahead.$menu.remove()
  95       })
  96
  97       test("should not explode when regex chars are entered", function () {
  98         var $input = $('<input />').typeahead({
  99               source: ['aa', 'ab', 'ac', 'mdo*', 'fat+']
 100             }).appendTo('body')
 101           , typeahead = $input.data('typeahead')
 102
 103         $input.val('+')
 104         typeahead.lookup()
 105
 106         ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
 107         equals(typeahead.$menu.find('li').length, 1, 'has 1 item in menu')
 108         equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
 109
 110         $input.remove()
 111         typeahead.$menu.remove()
 112       })
 113
 114       test("should hide menu when query entered", function () {
 115         stop()
 116         var $input = $('<input />').typeahead({
 117               source: ['aa', 'ab', 'ac']
 118             }).appendTo('body')
 119           , typeahead = $input.data('typeahead')
 120
 121         $input.val('a')
 122         typeahead.lookup()
 123
 124         ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
 125         equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
 126         equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
 127
 128         $input.blur()
 129
 130         setTimeout(function () {
 131           ok(!typeahead.$menu.is(":visible"), "typeahead is no longer visible")
 132           start()
 133         }, 200)
 134
 135         $input.remove()
 136         typeahead.$menu.remove()
 137       })
 138
 139       test("should set next item when down arrow is pressed", function () {
 140         var $input = $('<input />').typeahead({
 141               source: ['aa', 'ab', 'ac']
 142             }).appendTo('body')
 143           , typeahead = $input.data('typeahead')
 144
 145         $input.val('a')
 146         typeahead.lookup()
 147
 148         ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
 149         equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
 150         equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
 151         ok(typeahead.$menu.find('li').first().hasClass('active'), "first item is active")
 152
 153         // simulate entire key pressing event
 154         $input.trigger({
 155           type: 'keydown'
 156         , keyCode: 40
 157         })
 158         .trigger({
 159           type: 'keypress'
 160         , keyCode: 40
 161         })
 162         .trigger({
 163           type: 'keyup'
 164         , keyCode: 40
 165         })
 166
 167         ok(typeahead.$menu.find('li').first().next().hasClass('active'), "second item is active")
 168
 169         $input.trigger({
 170           type: 'keydown'
 171         , keyCode: 38
 172         })
 173         .trigger({
 174           type: 'keypress'
 175         , keyCode: 38
 176         })
 177         .trigger({
 178           type: 'keyup'
 179         , keyCode: 38
 180         })
 181
 182         ok(typeahead.$menu.find('li').first().hasClass('active'), "first item is active")
 183
 184         $input.remove()
 185         typeahead.$menu.remove()
 186       })
 187
 188
 189       test("should set input value to selected item", function () {
 190         var $input = $('<input />').typeahead({
 191               source: ['aa', 'ab', 'ac']
 192             }).appendTo('body')
 193           , typeahead = $input.data('typeahead')
 194           , changed = false
 195           , focus = false
 196           , blur = false
 197
 198         $input.val('a')
 199         typeahead.lookup()
 200
 201         $input.change(function() { changed = true });
 202         $input.focus(function() { focus = true; blur = false });
 203         $input.blur(function() { blur = true; focus = false });
 204
 205         $(typeahead.$menu.find('li')[2]).mouseover().click()
 206
 207         equals($input.val(), 'ac', 'input value was correctly set')
 208         ok(!typeahead.$menu.is(':visible'), 'the menu was hidden')
 209         ok(changed, 'a change event was fired')
 210         ok(focus && !blur, 'focus is still set')
 211
 212         $input.remove()
 213         typeahead.$menu.remove()
 214       })
 215
 216       test("should start querying when minLength is met", function () {
 217         var $input = $('<input />').typeahead({
 218               source: ['aaaa', 'aaab', 'aaac'],
 219               minLength: 3
 220             }).appendTo('body')
 221           , typeahead = $input.data('typeahead')
 222
 223         $input.val('aa')
 224         typeahead.lookup()
 225
 226         equals(typeahead.$menu.find('li').length, 0, 'has 0 items in menu')
 227
 228         $input.val('aaa')
 229         typeahead.lookup()
 230
 231         equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
 232
 233         $input.remove()
 234         typeahead.$menu.remove()
 235       })
 236 })