[ADD] doc: new documentation, with training tutorials, and new scaffolding
[odoo/odoo.git] / doc / _themes / odoodoc / static / bootstrap / js / tests / unit / button.js
1 $(function () {
2   'use strict';
3
4   module('button plugin')
5
6   test('should be defined on jquery object', function () {
7     ok($(document.body).button, 'button method is defined')
8   })
9
10   module('button', {
11     setup: function () {
12       // Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
13       $.fn.bootstrapButton = $.fn.button.noConflict()
14     },
15     teardown: function () {
16       $.fn.button = $.fn.bootstrapButton
17       delete $.fn.bootstrapButton
18     }
19   })
20
21   test('should provide no conflict', function () {
22     ok(!$.fn.button, 'button was set back to undefined (org value)')
23   })
24
25   test('should return element', function () {
26     ok($(document.body).bootstrapButton()[0] == document.body, 'document.body returned')
27   })
28
29   test('should return set state to loading', function () {
30     var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
31     equal(btn.html(), 'mdo', 'btn text equals mdo')
32     btn.bootstrapButton('loading')
33     equal(btn.html(), 'fat', 'btn text equals fat')
34     stop()
35     setTimeout(function () {
36       ok(btn.attr('disabled'), 'btn is disabled')
37       ok(btn.hasClass('disabled'), 'btn has disabled class')
38       start()
39     }, 0)
40   })
41
42   test('should return reset state', function () {
43     var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
44     equal(btn.html(), 'mdo', 'btn text equals mdo')
45     btn.bootstrapButton('loading')
46     equal(btn.html(), 'fat', 'btn text equals fat')
47     stop()
48     setTimeout(function () {
49       ok(btn.attr('disabled'), 'btn is disabled')
50       ok(btn.hasClass('disabled'), 'btn has disabled class')
51       start()
52       stop()
53       btn.bootstrapButton('reset')
54       equal(btn.html(), 'mdo', 'btn text equals mdo')
55       setTimeout(function () {
56         ok(!btn.attr('disabled'), 'btn is not disabled')
57         ok(!btn.hasClass('disabled'), 'btn does not have disabled class')
58         start()
59       }, 0)
60     }, 0)
61   })
62
63   test('should work with an empty string as reset state', function () {
64     var btn = $('<button class="btn" data-loading-text="fat"></button>')
65     equal(btn.html(), '', 'btn text equals ""')
66     btn.bootstrapButton('loading')
67     equal(btn.html(), 'fat', 'btn text equals fat')
68     stop()
69     setTimeout(function () {
70       ok(btn.attr('disabled'), 'btn is disabled')
71       ok(btn.hasClass('disabled'), 'btn has disabled class')
72       start()
73       stop()
74       btn.bootstrapButton('reset')
75       equal(btn.html(), '', 'btn text equals ""')
76       setTimeout(function () {
77         ok(!btn.attr('disabled'), 'btn is not disabled')
78         ok(!btn.hasClass('disabled'), 'btn does not have disabled class')
79         start()
80       }, 0)
81     }, 0)
82   })
83
84   test('should toggle active', function () {
85     var btn = $('<button class="btn">mdo</button>')
86     ok(!btn.hasClass('active'), 'btn does not have active class')
87     btn.bootstrapButton('toggle')
88     ok(btn.hasClass('active'), 'btn has class active')
89   })
90
91   test('should toggle active when btn children are clicked', function () {
92     var btn = $('<button class="btn" data-toggle="button">mdo</button>')
93     var inner = $('<i></i>')
94     btn
95       .append(inner)
96       .appendTo($('#qunit-fixture'))
97     ok(!btn.hasClass('active'), 'btn does not have active class')
98     inner.click()
99     ok(btn.hasClass('active'), 'btn has class active')
100   })
101
102   test('should toggle active when btn children are clicked within btn-group', function () {
103     var btngroup = $('<div class="btn-group" data-toggle="buttons"></div>')
104     var btn = $('<button class="btn">fat</button>')
105     var inner = $('<i></i>')
106     btngroup
107       .append(btn.append(inner))
108       .appendTo($('#qunit-fixture'))
109     ok(!btn.hasClass('active'), 'btn does not have active class')
110     inner.click()
111     ok(btn.hasClass('active'), 'btn has class active')
112   })
113
114   test('should check for closest matching toggle', function () {
115     var group = '<div class="btn-group" data-toggle="buttons">' +
116       '<label class="btn btn-primary active">' +
117         '<input type="radio" name="options" id="option1" checked="true"> Option 1' +
118       '</label>' +
119       '<label class="btn btn-primary">' +
120         '<input type="radio" name="options" id="option2"> Option 2' +
121       '</label>' +
122       '<label class="btn btn-primary">' +
123         '<input type="radio" name="options" id="option3"> Option 3' +
124       '</label>' +
125     '</div>'
126
127     group = $(group)
128
129     var btn1 = $(group.children()[0])
130     var btn2 = $(group.children()[1])
131
132     group.appendTo($('#qunit-fixture'))
133
134     ok(btn1.hasClass('active'), 'btn1 has active class')
135     ok(btn1.find('input').prop('checked'), 'btn1 is checked')
136     ok(!btn2.hasClass('active'), 'btn2 does not have active class')
137     ok(!btn2.find('input').prop('checked'), 'btn2 is not checked')
138     btn2.find('input').click()
139     ok(!btn1.hasClass('active'), 'btn1 does not have active class')
140     ok(!btn1.find('input').prop('checked'), 'btn1 is checked')
141     ok(btn2.hasClass('active'), 'btn2 has active class')
142     ok(btn2.find('input').prop('checked'), 'btn2 is checked')
143
144     btn2.find('input').click() /* clicking an already checked radio should not un-check it */
145     ok(!btn1.hasClass('active'), 'btn1 does not have active class')
146     ok(!btn1.find('input').prop('checked'), 'btn1 is checked')
147     ok(btn2.hasClass('active'), 'btn2 has active class')
148     ok(btn2.find('input').prop('checked'), 'btn2 is checked')
149   })
150
151 })