Mercurial > wikked

comparison static/bootstrap/js/tests/unit/bootstrap-dropdown.js @ 88:a5a3d454eac9

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Updated Bootstrap.
author Ludovic Chabant <ludovic@chabant.com>
date Fri, 05 Apr 2013 08:08:12 -0700
parents
children
comparison
equal deleted inserted replaced
87:c0cf67362fb1 88:a5a3d454eac9
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 })