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

   1 $(function () {
   2
   3     module("bootstrap-dropdowns")
   4
   5       test("should provide no conflict", function () {
   6         var dropdown = $.fn.dropdown.noConflict()
   7         ok(!$.fn.dropdown, 'dropdown was set back to undefined (org value)')
   8         $.fn.dropdown = dropdown
   9       })
  10
  11       test("should be defined on jquery object", function () {
  12         ok($(document.body).dropdown, 'dropdown method is defined')
  13       })
  14
  15       test("should return element", function () {
  16         var el = $("<div />")
  17         ok(el.dropdown()[0] === el[0], 'same element returned')
  18       })
  19
  20       test("should not open dropdown if target is disabled", function () {
  21         var dropdownHTML = '<ul class="tabs">'
  22           + '<li class="dropdown">'
  23           + '<button disabled href="#" class="btn dropdown-toggle" data-toggle="dropdown">Dropdown</button>'
  24           + '<ul class="dropdown-menu">'
  25           + '<li><a href="#">Secondary link</a></li>'
  26           + '<li><a href="#">Something else here</a></li>'
  27           + '<li class="divider"></li>'
  28           + '<li><a href="#">Another link</a></li>'
  29           + '</ul>'
  30           + '</li>'
  31           + '</ul>'
  32           , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
  33
  34         ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
  35       })
  36
  37       test("should not open dropdown if target is disabled", function () {
  38         var dropdownHTML = '<ul class="tabs">'
  39           + '<li class="dropdown">'
  40           + '<button href="#" class="btn dropdown-toggle disabled" data-toggle="dropdown">Dropdown</button>'
  41           + '<ul class="dropdown-menu">'
  42           + '<li><a href="#">Secondary link</a></li>'
  43           + '<li><a href="#">Something else here</a></li>'
  44           + '<li class="divider"></li>'
  45           + '<li><a href="#">Another link</a></li>'
  46           + '</ul>'
  47           + '</li>'
  48           + '</ul>'
  49           , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
  50
  51         ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
  52       })
  53
  54       test("should add class open to menu if clicked", function () {
  55         var dropdownHTML = '<ul class="tabs">'
  56           + '<li class="dropdown">'
  57           + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'
  58           + '<ul class="dropdown-menu">'
  59           + '<li><a href="#">Secondary link</a></li>'
  60           + '<li><a href="#">Something else here</a></li>'
  61           + '<li class="divider"></li>'
  62           + '<li><a href="#">Another link</a></li>'
  63           + '</ul>'
  64           + '</li>'
  65           + '</ul>'
  66           , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
  67
  68         ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
  69       })
  70
  71       test("should test if element has a # before assuming it's a selector", function () {
  72         var dropdownHTML = '<ul class="tabs">'
  73           + '<li class="dropdown">'
  74           + '<a href="/foo/" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'
  75           + '<ul class="dropdown-menu">'
  76           + '<li><a href="#">Secondary link</a></li>'
  77           + '<li><a href="#">Something else here</a></li>'
  78           + '<li class="divider"></li>'
  79           + '<li><a href="#">Another link</a></li>'
  80           + '</ul>'
  81           + '</li>'
  82           + '</ul>'
  83           , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
  84
  85         ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
  86       })
  87
  88
  89       test("should remove open class if body clicked", function () {
  90         var dropdownHTML = '<ul class="tabs">'
  91           + '<li class="dropdown">'
  92           + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'
  93           + '<ul class="dropdown-menu">'
  94           + '<li><a href="#">Secondary link</a></li>'
  95           + '<li><a href="#">Something else here</a></li>'
  96           + '<li class="divider"></li>'
  97           + '<li><a href="#">Another link</a></li>'
  98           + '</ul>'
  99           + '</li>'
 100           + '</ul>'
 101           , dropdown = $(dropdownHTML)
 102             .appendTo('#qunit-fixture')
 103             .find('[data-toggle="dropdown"]')
 104             .dropdown()
 105             .click()
 106         ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
 107         $('body').click()
 108         ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class removed')
 109         dropdown.remove()
 110       })
 111
 112       test("should remove open class if body clicked, with multiple drop downs", function () {
 113           var dropdownHTML =
 114             '<ul class="nav">'
 115             + '    <li><a href="#menu1">Menu 1</a></li>'
 116             + '    <li class="dropdown" id="testmenu">'
 117             + '      <a class="dropdown-toggle" data-toggle="dropdown" href="#testmenu">Test menu <b class="caret"></b></a>'
 118             + '      <ul class="dropdown-menu" role="menu">'
 119             + '        <li><a href="#sub1">Submenu 1</a></li>'
 120             + '      </ul>'
 121             + '    </li>'
 122             + '</ul>'
 123             + '<div class="btn-group">'
 124             + '    <button class="btn">Actions</button>'
 125             + '    <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>'
 126             + '    <ul class="dropdown-menu">'
 127             + '        <li><a href="#">Action 1</a></li>'
 128             + '    </ul>'
 129             + '</div>'
 130           , dropdowns = $(dropdownHTML).appendTo('#qunit-fixture').find('[data-toggle="dropdown"]')
 131           , first = dropdowns.first()
 132           , last = dropdowns.last()
 133
 134         ok(dropdowns.length == 2, "Should be two dropdowns")
 135
 136         first.click()
 137         ok(first.parents('.open').length == 1, 'open class added on click')
 138         ok($('#qunit-fixture .open').length == 1, 'only one object is open')
 139         $('body').click()
 140         ok($("#qunit-fixture .open").length === 0, 'open class removed')
 141
 142         last.click()
 143         ok(last.parent('.open').length == 1, 'open class added on click')
 144         ok($('#qunit-fixture .open').length == 1, 'only one object is open')
 145         $('body').click()
 146         ok($("#qunit-fixture .open").length === 0, 'open class removed')
 147
 148         $("#qunit-fixture").html("")
 149       })
 150
 151 })